diff options
| author | Adam Malczewski <[email protected]> | 2026-10-15 10:12:55 +0900 |
|---|---|---|
| committer | Adam Malczewski <[email protected]> | 2026-10-15 10:12:55 +0900 |
| commit | 307fe78c38b3f06cd34d5032cda40f5876801bb4 (patch) | |
| tree | 7d62f6f6d78ec3d0158c1e8b240b173ae45d7bf4 /src | |
| parent | 7bcb83b1076f45a8f0a1ac58586c60d6460a66fe (diff) | |
| download | dispatch-web-307fe78c38b3f06cd34d5032cda40f5876801bb4.tar.gz dispatch-web-307fe78c38b3f06cd34d5032cda40f5876801bb4.zip | |
fix(ui): lint-clean dvh fallback (@supports); left padding for the overlay (mobile) sidebar
Diffstat (limited to 'src')
| -rw-r--r-- | src/app.css | 8 | ||||
| -rw-r--r-- | src/features/layout/ui/TileSplit.svelte | 5 |
2 files changed, 10 insertions, 3 deletions
diff --git a/src/app.css b/src/app.css index d7e0967..3c7b17c 100644 --- a/src/app.css +++ b/src/app.css @@ -364,10 +364,14 @@ body { while they're showing the bottom of the app sits underneath them (the sidebar's last item / the composer looked flush against the bottom edge). 100dvh tracks the visible viewport as the toolbars show/hide; 100vh stays as - the fallback for engines without dvh (the cascade drops the unknown unit). */ + the fallback for engines without dvh. */ .h-app { height: 100vh; - height: 100dvh; +} +@supports (height: 100dvh) { + .h-app { + height: 100dvh; + } } /* Transcript rows: skip layout + paint for rows scrolled out of view. A long diff --git a/src/features/layout/ui/TileSplit.svelte b/src/features/layout/ui/TileSplit.svelte index b526ccd..84fa075 100644 --- a/src/features/layout/ui/TileSplit.svelte +++ b/src/features/layout/ui/TileSplit.svelte @@ -86,6 +86,9 @@ visible panel. --> <!-- svelte-ignore a11y_no_static_element_interactions --> + <!-- Viewport padding: top/right/bottom always; LEFT only in overlay mode + (< lg) — inline (≥ lg) the chat column's gutter already separates the + views, but the overlay's left edge is the panel's own edge. --> <aside class="flex shrink-0 flex-col overflow-x-hidden transition-[width] duration-300 ease-out max-lg:absolute max-lg:inset-y-0 max-lg:right-0 max-lg:z-30 lg:relative" style="width: {open ? (child.basis ?? 320) : 0}px" @@ -93,7 +96,7 @@ data-open={open} > <div - class="flex h-full flex-col gap-2 overflow-y-auto bg-base-100 pt-3 pr-3 pb-3 transition-transform duration-300 ease-out" + class="flex h-full flex-col gap-2 overflow-y-auto bg-base-100 pt-3 pr-3 pb-3 max-lg:pl-3 transition-transform duration-300 ease-out" style={scrollViewportStyle(child.basis, open, child.node.marker)} data-testid="sidebar-scroll-viewport" > |