fix(ui): R10 S4 review r3 — preserve glass-card edge on pills, ease transform
Two low-severity follow-ups from the third /code-review round: - .pill's resting border-color is now scoped `.pill:not(.glass-card)`, so a glass-card-resting pill (PlexSidebar scope/facet, PlexPlaylistView layout) keeps glass-card's own border incl. its lighter top-edge specular highlight, instead of having it flattened to a uniform var(--border). - add `transform` to the recipe transition so the `active:translate-y-px` press nudge on the Sidebar tag/date pills eases again (it lost the utility transition). Verified plain pills keep their resting border (Feed + YOUR TAGS) and active pills still paint solid accent.
This commit is contained in:
@@ -434,12 +434,19 @@ body {
|
||||
.pill,
|
||||
.is-current {
|
||||
color: var(--muted);
|
||||
border-color: var(--border); /* inert unless the site also adds a border-width utility */
|
||||
transition:
|
||||
color 0.15s ease,
|
||||
background-color 0.15s ease,
|
||||
border-color 0.15s ease,
|
||||
box-shadow 0.15s ease; /* so an on-state shadow (Tabs/SettingsPanel) fades in, not pops */
|
||||
box-shadow 0.15s ease,
|
||||
transform 0.15s ease; /* box-shadow: an on-state shadow (Tabs) fades; transform: an active:translate press eases */
|
||||
}
|
||||
/* Resting border colour for the plain pills. NOT applied to a glass-card-resting pill (`.pill.glass-card`),
|
||||
whose own border — including its lighter top-edge specular highlight — must survive. Inert unless the
|
||||
site also adds a border-width utility. */
|
||||
.pill:not(.glass-card),
|
||||
.is-current {
|
||||
border-color: var(--border);
|
||||
}
|
||||
.pill:hover,
|
||||
.is-current:hover {
|
||||
|
||||
Reference in New Issue
Block a user