From 9abe08519e5adf88beacc972fa7167dd38cf5b7d Mon Sep 17 00:00:00 2001
From: Bruno Quaresma <bruno@coder.com>
Date: Thu, 17 Nov 2022 19:33:00 +0000
Subject: [PATCH] refactor: Reemove mono font from empty title

---
 site/src/components/EmptyState/EmptyState.tsx | 45 ++++++++-----------
 1 file changed, 19 insertions(+), 26 deletions(-)

diff --git a/site/src/components/EmptyState/EmptyState.tsx b/site/src/components/EmptyState/EmptyState.tsx
index 0a60a155759b6..17471dc4f2332 100644
--- a/site/src/components/EmptyState/EmptyState.tsx
+++ b/site/src/components/EmptyState/EmptyState.tsx
@@ -2,7 +2,6 @@ import Box from "@material-ui/core/Box"
 import { makeStyles } from "@material-ui/core/styles"
 import Typography from "@material-ui/core/Typography"
 import { FC, ReactNode } from "react"
-import { MONOSPACE_FONT_FAMILY } from "../../theme/constants"
 import { combineClasses } from "../../util/combineClasses"
 
 export interface EmptyStateProps {
@@ -38,24 +37,19 @@ export const EmptyState: FC<React.PropsWithChildren<EmptyStateProps>> = (
 
   return (
     <Box className={combineClasses([styles.root, className])} {...boxProps}>
-      <div className={styles.header}>
-        <Typography variant="h5" className={styles.title}>
-          {message}
+      <Typography variant="h5" className={styles.title}>
+        {message}
+      </Typography>
+      {description && (
+        <Typography
+          variant="body2"
+          color="textSecondary"
+          className={combineClasses([styles.description, descriptionClassName])}
+        >
+          {description}
         </Typography>
-        {description && (
-          <Typography
-            variant="body2"
-            color="textSecondary"
-            className={combineClasses([
-              styles.description,
-              descriptionClassName,
-            ])}
-          >
-            {description}
-          </Typography>
-        )}
-      </div>
-      {cta}
+      )}
+      {cta && <div className={styles.cta}>{cta}</div>}
     </Box>
   )
 }
@@ -70,18 +64,17 @@ const useStyles = makeStyles(
       textAlign: "center",
       minHeight: 300,
       padding: theme.spacing(3),
-      fontFamily: MONOSPACE_FONT_FAMILY,
-    },
-    header: {
-      marginBottom: theme.spacing(3),
     },
+
     title: {
-      fontWeight: 600,
-      fontFamily: "inherit",
+      fontSize: theme.spacing(3),
     },
     description: {
-      marginTop: theme.spacing(1),
-      fontFamily: "inherit",
+      marginTop: theme.spacing(1.5),
+      fontSize: theme.spacing(2),
+    },
+    cta: {
+      marginTop: theme.spacing(4),
     },
   }),
   { name: "EmptyState" },