upcoming: [DI-20800] - Use theme spacing wherever applicable

venkymano-akamai · Sep 18, 2024 · c8615b2 · c8615b2
1 parent d5db90c
commit c8615b2
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 5 deletions.
diff --git a/packages/manager/src/features/CloudPulse/Dashboard/CloudPulseDashboardLanding.tsx b/packages/manager/src/features/CloudPulse/Dashboard/CloudPulseDashboardLanding.tsx
@@ -1,4 +1,4 @@
-import { Grid, Paper } from '@mui/material';
+import { Grid, Paper, useTheme } from '@mui/material';
 import * as React from 'react';
 
 import CloudPulseIcon from 'src/assets/icons/entityIcons/monitor.svg';
@@ -52,6 +52,8 @@ export const CloudPulseDashboardLanding = () => {
 
   const { isLoading } = useLoadUserPreferences();
 
+  const theme = useTheme();
+
   /**
    * Takes an error message as input and renders a placeholder with the error message
    * @param errorMessage {string} - Error message which will be displayed
@@ -131,7 +133,7 @@ export const CloudPulseDashboardLanding = () => {
   }
 
   return (
-    <Grid container paddingTop={1} spacing={2}>
+    <Grid container paddingTop={theme.spacing(1)} spacing={theme.spacing(2)}>
       <Grid item xs={12}>
         <Paper>
           <GlobalFilters

diff --git a/packages/manager/src/features/CloudPulse/Overview/GlobalFilters.tsx b/packages/manager/src/features/CloudPulse/Overview/GlobalFilters.tsx
@@ -75,13 +75,19 @@ export const GlobalFilters = React.memo((props: GlobalFilterProperties) => {
 
   return (
     <Grid container>
-      <Grid container item m={3} rowGap={1} xs={12}>
+      <Grid
+        container
+        item
+        m={theme.spacing(3)}
+        rowGap={theme.spacing(1)}
+        xs={12}
+      >
         <Grid
-          columnSpacing={2}
+          columnSpacing={theme.spacing(2)}
           container
           item
           justifyContent="space-between"
-          rowSpacing={2}
+          rowSpacing={theme.spacing(2)}
         >
           <Grid display={'flex'} item md={4} sm={5} xs={12}>
             <CloudPulseDashboardSelect