website: replace local font by google font

hugohutri · Sep 19, 2022 · 8c341a4 · 8c341a4
1 parent c6380f7
commit 8c341a4
Show file tree

Hide file tree

Showing 12 changed files with 14 additions and 71 deletions.
diff --git a/website/package-lock.json b/website/package-lock.json
diff --git a/website/src/assets/fonts/FiraMono-Bold.otf b/website/src/assets/fonts/FiraMono-Bold.otf
diff --git a/website/src/assets/fonts/FiraMono-Medium.otf b/website/src/assets/fonts/FiraMono-Medium.otf
diff --git a/website/src/assets/fonts/FiraMono-Regular.otf b/website/src/assets/fonts/FiraMono-Regular.otf
diff --git a/website/src/assets/fonts/FiraSans-Black.ttf b/website/src/assets/fonts/FiraSans-Black.ttf
diff --git a/website/src/assets/fonts/FiraSans-Bold.ttf b/website/src/assets/fonts/FiraSans-Bold.ttf
diff --git a/website/src/assets/fonts/FiraSans-Light.ttf b/website/src/assets/fonts/FiraSans-Light.ttf
diff --git a/website/src/assets/fonts/FiraSans-Medium.ttf b/website/src/assets/fonts/FiraSans-Medium.ttf
diff --git a/website/src/assets/fonts/FiraSans-Regular.ttf b/website/src/assets/fonts/FiraSans-Regular.ttf
diff --git a/website/src/assets/fonts/SIL Open Font License.txt b/website/src/assets/fonts/SIL Open Font License.txt
diff --git a/website/src/components/seo.tsx b/website/src/components/seo.tsx
@@ -57,6 +57,17 @@ const SEO: FC<SEOProps> = ({ title = '', description = '', children }) => {
         src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5817566022458684"
         crossOrigin="anonymous"
       ></script>
+
+      <link rel="preconnect" href="https://fonts.googleapis.com" />
+      <link
+        rel="preconnect"
+        href="https://fonts.gstatic.com"
+        crossOrigin="true"
+      />
+      <link
+        href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400&family=Fira+Sans:wght@300;400;700&display=swap"
+        rel="stylesheet"
+      />
     </>
   )
 }

diff --git a/website/src/theme.ts b/website/src/theme.ts
@@ -3,9 +3,6 @@ import { blue, red } from '@mui/material/colors'
 import { createTheme } from '@mui/material/styles'
 import deepMerge from 'deepmerge'
 
-import FiraCode from './assets/fonts/FiraMono-Regular.otf'
-import FiraRegular from './assets/fonts/FiraSans-Regular.ttf'
-
 export const dracula = {
   background: '#282a36',
   currentLine: '#44475a',
@@ -42,7 +39,7 @@ const makeTheme = (variant: ThemeOptions): Theme => {
     },
     typography: {
       fontFamily: [
-        'Fira Sans Regular',
+        'Fira Sans',
         '-apple-system',
         'BlinkMacSystemFont',
         '"Segoe UI"',
@@ -57,26 +54,6 @@ const makeTheme = (variant: ThemeOptions): Theme => {
     },
 
     components: {
-      MuiCssBaseline: {
-        styleOverrides: `
-          @font-face {
-            font-family: Fira Sans Regular;
-            font-style: normal;
-            font-display: swap;
-            font-weight: 400;
-            src: url(${FiraRegular}) format(truetype);
-          }
-          @font-face {
-            font-family: Fira Code;
-            font-style: normal;
-            font-display: swap;
-            font-weight: 400;
-            src: url(${FiraCode}) format('woOpenTypeff2')
-            local('Open Sans Regular'),
-            local('OpenSans-Regular');
-          }
-        `,
-      },
       MuiLink: {
         defaultProps: {
           underline: 'hover',