fix: @font-face setup to use same family for different styles

Author: caidanw

components/MarketingServerMono.tsx

@@ -95,7 +95,7 @@ export default function MarketingServerMono(props) {
           </div>
           <div className={styles.right}>
             <Title style={{}}>Regular Slanted</Title>
-            <P style={{ marginTop: `1rem`, fontFamily: 'ServerMono-Regular-Italic' }}>
+            <P style={{ marginTop: `1rem`, fontStyle: 'oblique' }}>
               Mi sina alta mappa ëa, lómëa coivië, lómëa lúmë, á tyelë, á auta mi i sáma lómë, liëa olassëar ar ilyë lúmët elenaië.
               <br />
               <br />

global.scss

@@ -1,15 +1,19 @@
 @font-face {
-  font-family: 'ServerMono-Regular';
+  font-family: 'ServerMono';
   src: url('/fonts/ServerMono-Regular.woff2') format('woff2'),    /* Best compression, modern browsers */
        url('/fonts/ServerMono-Regular.woff') format('woff'),      /* Good compression, wider support */
        url('/fonts/ServerMono-Regular.otf') format('opentype');   /* Largest files, universal support */
+  font-weight: normal;
+  font-style: normal;
 }
 
 @font-face {
-  font-family: 'ServerMono-Regular-Italic';
+  font-family: 'ServerMono';
   src: url('/fonts/ServerMono-RegularSlanted.woff2') format('woff2'),
        url('/fonts/ServerMono-RegularSlanted.woff') format('woff'),
        url('/fonts/ServerMono-RegularSlanted.otf') format('opentype');
+  font-weight: normal;
+  font-style: oblique;
 }
 
 html,
@@ -439,7 +443,7 @@ body {
   --type-scale-fixed-label: 10px;
 
   --font-family: -apple-system, BlinkMacSystemFont, helvetica neue, helvetica, sans-serif;
-  --font-family-mono: 'ServerMono-Regular', Consolas, monaco, monospace;
+  --font-family-mono: 'ServerMono', Consolas, monaco, monospace;
   --font-family-serif: Georgia, Times New Roman, serif;
 
   --theme-border: var(--color-gray-20);