bvandeusen/FabledCurator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 33 Wiki Activity

fix(subscriptions): fixed-height hub so only the tab content scrolls

Browse Source 
The whole view scrolled instead of just the subscription list. Made the
hub a viewport-height flex column (tabs stay fixed) with the v-window as
the single internal scroll container; the per-tab sticky control bars now
pin to the window top (top:48px -> 0). Operator-flagged 2026-05-28.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Bryan Van Deusen
2026-05-28 18:13:19 -04:00
parent 1322056b22
commit 42ddac9996
3 changed files with 21 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/subscriptions/DownloadsTab.vue
+1 -1
View File
@@ -334,7 +334,7 @@ async function openDetail(id) {
background so rows don't bleed through. */
.fc-dl__sticky {
position: sticky;
top: 48px;
top: 0;
z-index: 3;
background: rgb(var(--v-theme-background));
padding: 8px 0 10px;
frontend/src/components/subscriptions/SubscriptionsTab.vue
+5 -4
View File
@@ -509,11 +509,12 @@ async function bulkDelete() {
.fc-subs__bar {
display: flex; gap: 0.75rem; align-items: center;
flex-wrap: wrap;
/* Sticky below the top nav so the filter/search controls stay
reachable while scrolling a long subscription list. Opaque bg so
table rows don't bleed through. Operator-flagged 2026-05-28. */
/* Sticky to the top of the hub's scroll window so the filter/search
controls stay reachable while scrolling a long subscription list.
Opaque bg so table rows don't bleed through. Operator-flagged
2026-05-28. */
position: sticky;
top: 48px;
top: 0;
z-index: 3;
background: rgb(var(--v-theme-background));
padding: 8px 0 1rem;
frontend/src/views/SubscriptionsView.vue
+15 -1
View File
@@ -21,7 +21,7 @@
</v-tab>
</v-tabs>
<v-window v-model="tab" class="mt-4">
<v-window v-model="tab" class="mt-4 fc-subs-window">
<v-window-item value="subscriptions">
<SubscriptionsTab />
</v-window-item>
@@ -52,8 +52,22 @@ const { tab } = useTabQuery(VALID_TABS, 'subscriptions')
.fc-subs-shell {
max-width: 1600px;
margin-inline: auto;
/* Fixed-height hub: the tabs (and each tab's sticky control bar) stay
put while ONLY the tab content scrolls — previously the whole view
scrolled instead of just the subscription list (operator-flagged
2026-05-28). 64px = the TopNav height (AppShell .fc-content pad-top). */
height: calc(100vh - 64px);
display: flex;
flex-direction: column;
overflow: hidden;
}
.fc-subs-tabs {
flex: 0 0 auto;
border-bottom: 1px solid rgb(var(--v-theme-on-surface-variant) / 0.18);
}
.fc-subs-window {
flex: 1 1 auto;
min-height: 0;
overflow-y: auto;
}
</style>