refactor: Minor design adjustments (#1637)

BrunoQuaresma · web-flow · commit b29a2dfdde59 · 2022-05-20T19:37:03.000Z
diff --git a/site/src/components/Footer/Footer.tsx b/site/src/components/Footer/Footer.tsx
@@ -42,6 +42,7 @@ const useFooterStyles = makeStyles((theme) => ({
     flex: "0",
     paddingTop: theme.spacing(2),
     paddingBottom: theme.spacing(2),
+    marginTop: theme.spacing(3),
   },
   copyRight: {
     margin: theme.spacing(0.25),
diff --git a/site/src/pages/LoginPage/LoginPage.tsx b/site/src/pages/LoginPage/LoginPage.tsx
@@ -17,7 +17,6 @@ export const useStyles = makeStyles((theme) => ({
   layout: {
     display: "flex",
     flexDirection: "column",
-    gap: theme.spacing(2),
     alignItems: "center",
   },
   container: {
diff --git a/site/src/pages/TemplatesPage/TemplatesPageView.tsx b/site/src/pages/TemplatesPage/TemplatesPageView.tsx
@@ -77,7 +77,7 @@ export const TemplatesPageView: React.FC<TemplatesPageViewProps> = (props) => {
               </TableRow>
             )}
             {props.templates?.map((template) => (
-              <TableRow key={template.id} className={styles.templateRow}>
+              <TableRow key={template.id}>
                 <TableCell>
                   <Box alignItems="center" display="flex">
                     <Avatar variant="square" className={styles.templateAvatar}>
@@ -127,12 +127,6 @@ const useStyles = makeStyles((theme) => ({
       lineHeight: `${theme.spacing(3)}px`,
     },
   },
-  templateRow: {
-    "& > td": {
-      paddingTop: theme.spacing(2),
-      paddingBottom: theme.spacing(2),
-    },
-  },
   templateAvatar: {
     borderRadius: 2,
     marginRight: theme.spacing(1),
diff --git a/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.tsx b/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.tsx
@@ -48,6 +48,7 @@ export const WorkspaceBuildPage: React.FC = () => {
 
 const useStyles = makeStyles((theme) => ({
   title: {
-    marginTop: theme.spacing(5),
+    paddingTop: theme.spacing(5),
+    paddingBottom: theme.spacing(2),
   },
 }))
diff --git a/site/src/pages/WorkspacesPage/WorkspacesPageView.tsx b/site/src/pages/WorkspacesPage/WorkspacesPageView.tsx
@@ -71,7 +71,7 @@ export const WorkspacesPageView: React.FC<WorkspacesPageViewProps> = (props) =>
             {props.workspaces?.map((workspace) => {
               const status = getDisplayStatus(theme, workspace.latest_build)
               return (
-                <TableRow key={workspace.id} className={styles.workspaceRow}>
+                <TableRow key={workspace.id}>
                   <TableCell>
                     <div className={styles.workspaceName}>
                       <Avatar variant="square" className={styles.workspaceAvatar}>
@@ -134,12 +134,6 @@ const useStyles = makeStyles((theme) => ({
       lineHeight: `${theme.spacing(3)}px`,
     },
   },
-  workspaceRow: {
-    "& > td": {
-      paddingTop: theme.spacing(2),
-      paddingBottom: theme.spacing(2),
-    },
-  },
   workspaceAvatar: {
     borderRadius: 2,
     marginRight: theme.spacing(1),
diff --git a/site/src/theme/overrides.ts b/site/src/theme/overrides.ts
@@ -44,6 +44,11 @@ export const getOverrides = (palette: PaletteOptions) => {
         // Gives the appearance of a border!
         borderRadius: 2,
         border: `1px solid ${palette.divider}`,
+
+        "& td": {
+          paddingTop: 16,
+          paddingBottom: 16,
+        },
       },
     },
     MuiTableCell: {
