diff --git a/src/components/ui/tabs.tsx b/src/components/ui/tabs.tsx index 16bef7550..8e48bb1dc 100644 --- a/src/components/ui/tabs.tsx +++ b/src/components/ui/tabs.tsx @@ -44,8 +44,11 @@ function Tabs({ // (e.g. the admin feedback `Open / Acknowledged / Resolved / // Archived` tabs Marc reported in v1.4.19). Locking the y-axis hides // that bar without affecting horizontal swipe behaviour. +// Padding sits at `p-1` (4 px) so the 3 px focus-visible ring +// (`focus-visible:ring-[3px]`) on triggers stays inside the +// `overflow-y-hidden` clamp without clipping the bottom of the ring. const tabsListVariants = cva( - "rounded-lg p-[3px] group-data-[orientation=horizontal]/tabs:h-9 data-[variant=line]:rounded-none group/tabs-list text-muted-foreground inline-flex w-fit max-w-full items-center justify-center overflow-x-auto overflow-y-hidden touch-pan-x scrollbar-thin group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col group-data-[orientation=vertical]/tabs:overflow-x-visible group-data-[orientation=vertical]/tabs:overflow-y-visible", + "rounded-lg p-1 group-data-[orientation=horizontal]/tabs:h-9 data-[variant=line]:rounded-none group/tabs-list text-muted-foreground inline-flex w-fit max-w-full items-center justify-center overflow-x-auto overflow-y-hidden touch-pan-x scrollbar-thin group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col group-data-[orientation=vertical]/tabs:overflow-x-visible group-data-[orientation=vertical]/tabs:overflow-y-visible", { variants: { variant: {