fix: update font size defaults inside theme

Parkreiner · Parkreiner · commit 3ec6823ef009 · 2023-10-18T12:42:53.000Z
diff --git a/site/src/theme/constants.ts b/site/src/theme/constants.ts
@@ -1,7 +1,7 @@
 export const borderRadius = 8;
 export const MONOSPACE_FONT_FAMILY =
   "'IBM Plex Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'Liberation Mono', 'Monaco', 'Courier New', Courier, monospace";
-export const BODY_FONT_FAMILY = `"Inter", sans-serif`;
+export const BODY_FONT_FAMILY = `"Inter", system-ui, sans-serif`;
 export const navHeight = 62;
 export const containerWidth = 1380;
 export const containerWidthMedium = 1080;
diff --git a/site/src/theme/theme.ts b/site/src/theme/theme.ts
@@ -74,13 +74,15 @@ export let dark = createTheme({
   },
   typography: {
     fontFamily: BODY_FONT_FAMILY,
+
     body1: {
-      fontSize: 16,
-      lineHeight: "24px",
+      fontSize: "1rem" /* 16px at default scaling */,
+      lineHeight: "1.5rem" /* 24px at default scaling */,
     },
+
     body2: {
-      fontSize: 14,
-      lineHeight: "20px",
+      fontSize: "0.875rem" /* 14px at default scaling */,
+      lineHeight: "1.25rem" /* 20px at default scaling */,
     },
   },
   shape: {
