web: tab strip reveals the active tab horizontally only (page no longer opens scrolled on mobile)

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

Simon-Pierre Boucher committed 11 days ago (Sep 13, 2026) parent 6f8db5e

1 changed file +6 −1

modified apps/web/src/components/ui/tabs.tsx +6 −1

		`@@ -31,7 +31,12 @@ export function Tabs({ tabs, defaultTab, children, param = 'tab', className, sti`
31	31	};
32	32
33	33	useEffect(() => {
34		− stripRef.current?.querySelector<HTMLElement>(`[data-tab="${active}"]`)?.scrollIntoView({ block: 'nearest', inline: 'nearest' });
	34	+ // Horizontal reveal of the active tab only — never scrollIntoView (it scrolls the page vertically on load, spec: pages open at the top).
	35	+ const strip = stripRef.current;
	36	+ const el = strip?.querySelector<HTMLElement>(`[data-tab="${active}"]`);
	37	+ if (!strip \|\| !el) return;
	38	+ const left = el.offsetLeft - (strip.clientWidth - el.offsetWidth) / 2;
	39	+ if (Math.abs(strip.scrollLeft - left) > 4) strip.scrollTo({ left: Math.max(0, left) });
35	40	}, [active]);
36	41
37	42	const onKey = (e: React.KeyboardEvent) => {
38	43