From e9033914e1fd1a0720f27748e51c91d4b21712b7 Mon Sep 17 00:00:00 2001
From: nickofolas <nickofolas@gmail.com>
Date: Mon, 7 Mar 2022 16:40:22 -0600
Subject: [PATCH] Update corp tabs to account for excessively long names

---
 src/Corporation/ui/CityTabs.tsx        |  2 +-
 src/Corporation/ui/CorporationRoot.tsx |  2 +-
 src/Themes/ui/Theme.tsx                | 13 +++++++++++++
 3 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/Corporation/ui/CityTabs.tsx b/src/Corporation/ui/CityTabs.tsx
index 47beaf5b4..743a54770 100644
--- a/src/Corporation/ui/CityTabs.tsx
+++ b/src/Corporation/ui/CityTabs.tsx
@@ -30,7 +30,7 @@ export function CityTabs(props: IProps): React.ReactElement {
   }
   return (
     <>
-      <Tabs variant="fullWidth" value={city} onChange={handleChange} sx={{ minWidth: 'fit-content', maxWidth: '65%' }}>
+      <Tabs variant="fullWidth" value={city} onChange={handleChange} sx={{ maxWidth: '65%' }}>
         {Object.values(division.offices).map(
           (office: OfficeSpace | 0) => office !== 0 && <Tab key={office.loc} label={office.loc} value={office.loc} />,
         )}
diff --git a/src/Corporation/ui/CorporationRoot.tsx b/src/Corporation/ui/CorporationRoot.tsx
index 05543b268..34b1a4aee 100644
--- a/src/Corporation/ui/CorporationRoot.tsx
+++ b/src/Corporation/ui/CorporationRoot.tsx
@@ -38,7 +38,7 @@ export function CorporationRoot(): React.ReactElement {
 
   return (
     <Context.Corporation.Provider value={corporation}>
-      <Tabs variant="fullWidth" value={divisionName} onChange={handleChange} sx={{ minWidth: 'fit-content', maxWidth: '65%' }}>
+      <Tabs variant="scrollable" value={divisionName} onChange={handleChange} sx={{ maxWidth: '65%' }} scrollButtons>
         <Tab label={corporation.name} value={"Overview"} />
         {corporation.divisions.map((div) => (
           <Tab key={div.name} label={div.name} value={div.name} />
diff --git a/src/Themes/ui/Theme.tsx b/src/Themes/ui/Theme.tsx
index 1b8a5058f..f5890b45a 100644
--- a/src/Themes/ui/Theme.tsx
+++ b/src/Themes/ui/Theme.tsx
@@ -348,6 +348,19 @@ export function refreshTheme(): void {
         },
       },
       MuiTabs: {
+        styleOverrides: {
+          scrollButtons: {
+            backgroundColor: Settings.theme.backgroundsecondary,
+            color: Settings.theme.secondary,
+            margin: '3px',
+            opacity: 1,
+            width: 'fit-content',
+
+            "&.Mui-disabled": {
+              opacity: 0.5
+            }
+          }
+        },
         defaultProps: {
           TabIndicatorProps: {
             style: {