diff options
| author | Adam Malczewski <[email protected]> | 2026-06-28 19:14:26 +0900 |
|---|---|---|
| committer | Adam Malczewski <[email protected]> | 2026-06-28 19:14:26 +0900 |
| commit | ce676cf89b7b1ba18deaf14c6f4b527895743380 (patch) | |
| tree | e8631c174e0e99ff669bb4ec56c09bdfd0d83a0c | |
| parent | fb891ec40d8d81dca0a215e67e64f2aea3895ddd (diff) | |
| download | dispatch-web-ce676cf89b7b1ba18deaf14c6f4b527895743380.tar.gz dispatch-web-ce676cf89b7b1ba18deaf14c6f4b527895743380.zip | |
fix(tabs): fixed height 60vh with scrollbar on overflow
| -rw-r--r-- | src/features/tabs/ui.test.ts | 4 | ||||
| -rw-r--r-- | src/features/tabs/ui/TabList.svelte | 7 |
2 files changed, 5 insertions, 6 deletions
diff --git a/src/features/tabs/ui.test.ts b/src/features/tabs/ui.test.ts index 0dc5e15..b12ca1a 100644 --- a/src/features/tabs/ui.test.ts +++ b/src/features/tabs/ui.test.ts @@ -183,7 +183,7 @@ describe("TabList", () => { expect(region).toHaveClass("flex-col"); }); - it("caps the tab list region at 80vh so a long set scrolls internally", () => { + it("fixes the tab list region at 60vh so a long set scrolls internally", () => { render(TabList, { props: { tabs: sampleTabs, @@ -196,7 +196,7 @@ describe("TabList", () => { const tabs = screen.getAllByRole("tab"); const region = tabs[0]?.parentElement; - expect(region).toHaveClass("max-h-[80vh]"); + expect(region).toHaveClass("h-[60vh]"); expect(region).toHaveClass("overflow-y-auto"); }); diff --git a/src/features/tabs/ui/TabList.svelte b/src/features/tabs/ui/TabList.svelte index 08a3274..32cd6a4 100644 --- a/src/features/tabs/ui/TabList.svelte +++ b/src/features/tabs/ui/TabList.svelte @@ -83,10 +83,9 @@ </script> <div class="flex flex-col gap-2"> - <!-- Single-column vertical tab list. Capped at 80% of the viewport height - so a long tab set scrolls inside this region instead of growing the - whole sidebar. --> - <div class="flex max-h-[80vh] flex-col gap-1 overflow-y-auto pr-1"> + <!-- Single-column vertical tab list. Fixed at 60% of the viewport height so a + long tab set scrolls inside this region instead of growing the whole sidebar. --> + <div class="flex h-[60vh] flex-col gap-1 overflow-y-auto pr-1"> {#each tabs as tab (tab.conversationId)} <div class="flex items-center gap-1.5 rounded px-2 py-1.5 text-sm hover:bg-base-200" |