fix(web): Fix settings tab overflow on mobile layouts

MohamedBassem · MohamedBassem · commit cdd0088a7f1d · 2024-10-13T12:10:01.000Z
diff --git a/apps/web/app/dashboard/settings/page.tsx b/apps/web/app/dashboard/settings/page.tsx
@@ -13,7 +13,7 @@ export default async function Settings() {
       orientation="horizontal"
       className="flex flex-col gap-1"
     >
-      <TabsList className="flex justify-start">
+      <TabsList className="flex justify-start overflow-x-auto overflow-y-hidden">
         <TabsTrigger className="flex items-center gap-2 p-3" value="info">
           <User className="size-4" />
           User Info

Original file line number	Diff line number	Diff line change
`@@ -13,7 +13,7 @@ export default async function Settings() {`
`13`	`13`	`orientation="horizontal"`
`14`	`14`	`className="flex flex-col gap-1"`
`15`	`15`	`>`
`16`		`- <TabsList className="flex justify-start">`
	`16`	`+ <TabsList className="flex justify-start overflow-x-auto overflow-y-hidden">`
`17`	`17`	`<TabsTrigger className="flex items-center gap-2 p-3" value="info">`
`18`	`18`	`<User className="size-4" />`
`19`	`19`	`User Info`