fix(ui): one continuous chrome gradient across nav + sticky sub-headers (#1478)
The TopNav and each sticky sub-header pinned beneath it (Gallery's filter bar, the Browse/Series/Settings/Subscriptions tabs bars) each painted their OWN dark-to-transparent gradient (Gallery) or a solid surface band (the rest), so the fade read as happening twice — dark, fade out, then dark again — instead of one gradient flowing from the nav down through the sub-nav. Operator asked to treat the sub-nav as part of the nav with a single gradient. New shared .fc-chrome-continues primitive (app.css): the nav fades from opaque to a shared --fc-chrome-seam alpha (on views flagged meta.stickyChrome), and the sub-header continues from that exact seam alpha to transparent over its own height. Both reference the same var so the alphas meet at the 64px boundary — no re-darkening, no doubling. Percentage stops keep it spanning the filter bar's expanding refine panel; the primitive's blur keeps tabs/controls legible where the old solid bars had none. --fc-chrome-seam is the single tuning knob. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -5,7 +5,7 @@
|
||||
align-tabs="start"
|
||||
color="accent"
|
||||
density="compact"
|
||||
class="fc-subs-tabs"
|
||||
class="fc-subs-tabs fc-chrome-continues"
|
||||
>
|
||||
<v-tab value="subscriptions">
|
||||
<v-icon start>mdi-account-multiple-check</v-icon>
|
||||
@@ -63,7 +63,10 @@ const { tab } = useTabQuery(VALID_TABS, 'subscriptions')
|
||||
}
|
||||
.fc-subs-tabs {
|
||||
flex: 0 0 auto;
|
||||
border-bottom: 1px solid rgb(var(--v-theme-on-surface-variant) / 0.18);
|
||||
/* Cancel the shell's pt-2 so the tabs sit flush under the 64px nav, letting
|
||||
the .fc-chrome-continues fade read as one gradient with it (operator
|
||||
2026-07-13). The fade replaces the old border-bottom separator. */
|
||||
margin-top: -8px;
|
||||
}
|
||||
.fc-subs-window {
|
||||
flex: 1 1 auto;
|
||||
|
||||
Reference in New Issue
Block a user