From b29a2dfdde59032fabdbf6e04fa092367fb56a46 Mon Sep 17 00:00:00 2001
From: Bruno Quaresma <bruno@coder.com>
Date: Fri, 20 May 2022 14:37:03 -0500
Subject: [PATCH] refactor: Minor design adjustments (#1637)

---
 site/src/components/Footer/Footer.tsx                    | 1 +
 site/src/pages/LoginPage/LoginPage.tsx                   | 1 -
 site/src/pages/TemplatesPage/TemplatesPageView.tsx       | 8 +-------
 site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.tsx | 3 ++-
 site/src/pages/WorkspacesPage/WorkspacesPageView.tsx     | 8 +-------
 site/src/theme/overrides.ts                              | 5 +++++
 6 files changed, 10 insertions(+), 16 deletions(-)

diff --git a/site/src/components/Footer/Footer.tsx b/site/src/components/Footer/Footer.tsx
index 00e0a42224..d4764cf496 100644
--- 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
index 660df299a1..fe4bcedae5 100644
--- 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
index debe2fa600..122863beb3 100644
--- 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
index 1ae2b1fdcc..f895373ba2 100644
--- 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
index 4138379286..e1f173675c 100644
--- 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
index c6261c4cce..88f78f5d32 100644
--- 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: {