Fix: Unwanted Horizontal Scroll on Facility Settings Page (#11045)

ohcnetwork · Mar 6, 2025 · 2e7a84d · 2e7a84d
1 parent d73c849
commit 2e7a84d
Showing 1 changed file with 2 additions and 2 deletions.
diff --git a/src/pages/Facility/settings/layout.tsx b/src/pages/Facility/settings/layout.tsx
@@ -90,12 +90,12 @@ export function SettingsLayout({ facilityId }: SettingsLayoutProps) {
   return (
     <div className="container mx-auto p-4">
       <Tabs defaultValue={currentTab} className="w-full" value={currentTab}>
-        <TabsList className="w-full justify-start border-b bg-transparent p-0 h-auto">
+        <TabsList className="w-full justify-evenly sm:justify-start border-b bg-transparent p-0 h-auto">
           {settingsTabs.map((tab) => (
             <Link key={tab.value} href={tab.href}>
               <TabsTrigger
                 value={tab.value}
-                className="border-b-2 border-transparent px-4 py-2 text-gray-600 hover:text-gray-900 data-[state=active]:border-primary-500 data-[state=active]:bg-transparent data-[state=active]:shadow-none rounded-none"
+                className="border-b-2 border-transparent px-2 sm:px-4 py-2 text-gray-600 hover:text-gray-900 data-[state=active]:border-primary-500 data-[state=active]:bg-transparent data-[state=active]:shadow-none rounded-none"
               >
                 {tab.label}
               </TabsTrigger>