vignesh/trypost
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): stop the scrollable tabs list from clipping button borders

Browse source 
overflow-x-auto forces overflow-y to auto too, so the tab triggers' border and
shadow were clipped at the list edges (visible on the editor Preview/Channels/
Comments tabs). Drop the fixed h-10 and pad the list (p-1) so the scroll
container has room around the buttons on all sides.
This commit is contained in:
Paulo Castellano 2026-07-17 20:58:53 -03:00
parent f9a1731073
commit d3738a2ec1
1 changed files with 1 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
resources/js/components/ui/tabs/TabsList.vue
View file

@ -15,7 +15,7 @@ const delegatedProps = reactiveOmit(props, "class")
data-slot="tabs-list"
v-bind="delegatedProps"
:class="cn(
'inline-flex h-10 w-fit max-w-full items-center gap-2 overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden',
'inline-flex w-fit max-w-full items-center gap-2 overflow-x-auto p-1 [scrollbar-width:none] [&::-webkit-scrollbar]:hidden',
props.class,
)"
>