ux(nav): pin active tab-strip chip to the scroll start

The Settings + Admin shells centred the active chip via
`scrollIntoView({ inline: "center" })`. On narrow viewports the
strip over-scrolled past the leading chips so the first one or two
were unreachable until the user manually swiped right. `inline:
"start"` lands the active chip at the leading edge so the trail of
preceding chips remains visible.
This commit is contained in:
Marc-André Bombeck committed 2026-05-17 12:21:31 +02:00
1 parent a17e7a46af
commit 83f0b5ae86
2 files changed
+10 -2

No files matched your search

+5 -1
View File
@@ -171,7 +171,11 @@ export function AdminShell({ active, children }: AdminShellProps) {
if (!activeChip) return;
activeChip.scrollIntoView({
block: "nearest",
inline: "center",
// v1.4.36 W4b — `inline: "start"` pins the active chip to the
// left edge of the scroller. `inline: "center"` over-scrolled
// and the first one or two chips were unreachable on narrow
// viewports.
inline: "start",
behavior: "smooth",
});
}, [activeSlug]);
+5 -1
View File
@@ -164,7 +164,11 @@ export function SettingsShell({ active, children }: SettingsShellProps) {
if (!active) return;
active.scrollIntoView({
block: "nearest",
inline: "center",
// v1.4.36 W4b — `inline: "start"` pins the active chip to the
// left edge of the scroller. `inline: "center"` over-scrolled
// and the first one or two chips were unreachable on narrow
// viewports.
inline: "start",
behavior: "smooth",
});
}, [activeSlug]);