fix(geo.ca): fix style issues of geo.ca closes2355

Canadian-Geospatial-Platform · Jul 11, 2024 · 0c23674 · 0c23674
1 parent 2bfeaa1
commit 0c23674
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 6 deletions.
diff --git a/packages/geoview-core/src/core/components/data-table/data-table.tsx b/packages/geoview-core/src/core/components/data-table/data-table.tsx
@@ -420,7 +420,7 @@ function DataTable({ data, layerPath, tableHeight = '500px' }: DataTableProps):
             </ExportButton>
           </Box>
           <Box sx={{ marginLeft: 'auto', maxWidth: '15rem', marginRight: '1rem' }}>
-            <MRTGlobalFilterTextField className="buttonOutline" table={table} sx={{ '& input': { minHeight: '2.5rem', padding: 0 } }} />
+            <MRTGlobalFilterTextField className="buttonOutline" table={table} />
           </Box>
         </Box>
       </Box>

diff --git a/packages/geoview-core/src/core/components/export/export-modal.tsx b/packages/geoview-core/src/core/components/export/export-modal.tsx
@@ -171,7 +171,6 @@ export default function ExportModal(): JSX.Element {
               sx={{
                 paddingBottom: '1rem',
                 minWidth: 300,
-                '& input': { padding: 0, minHeight: '2.5rem' },
                 '& label + div': { marginTop: '0.5rem' },
               }}
             />

diff --git a/packages/geoview-core/src/ui/select/select-style.ts b/packages/geoview-core/src/ui/select/select-style.ts
@@ -30,9 +30,6 @@ export const getSxClasses = (theme: Theme): any => ({
     '& .MuiSvgIcon-root': {
       color: theme.palette.text.primary,
     },
-    '& select': {
-      height: '2.25rem',
-    },
   },
   label: {
     color: theme.palette.text.primary,

diff --git a/packages/geoview-core/src/ui/style/themeOptionsGenerator.ts b/packages/geoview-core/src/ui/style/themeOptionsGenerator.ts
@@ -389,6 +389,30 @@ export const generateThemeOptions = (geoViewColors: IGeoViewColors = defaultGeoV
           },
         },
       },
+      MuiSelect: {
+        styleOverrides: {
+          select: {
+            minHeight: '2.25rem',
+            padding: '0 !important',
+          },
+        },
+      },
+      MuiNativeSelect: {
+        styleOverrides: {
+          select: {
+            minHeight: '2.25rem',
+            padding: '0 !important',
+          },
+        },
+      },
+      MuiInputBase: {
+        styleOverrides: {
+          input: {
+            minHeight: '2.5rem',
+            padding: '0 !important',
+          },
+        },
+      },
     },
     overrides: {
       button: {

diff --git a/packages/geoview-time-slider/src/time-slider.tsx b/packages/geoview-time-slider/src/time-slider.tsx
@@ -477,7 +477,6 @@ export function TimeSlider(props: TimeSliderProps): JSX.Element {
                   name: 'timeDelay',
                   onChange: (event) => handleTimeChange(event),
                 }}
-                sx={{ minHeight: '2rem', padding: 0 }}
               >
                 <option value={500}>0.5s</option>
                 <option value={750}>0.75s</option>