commit 07bba607fc34ac863be7dcd679f3cae1de329ed8
parent 509c559d403bf41542c9f51f0196fc5b303eec4e
Author: MTRNord <mtrnord1@gmail.com>
Date: Sun, 30 Jan 2022 18:09:02 +0100
Use local fonts instead of google fonts
Diffstat:
11 files changed, 92 insertions(+), 3 deletions(-)
diff --git a/pages/_document.tsx b/pages/_document.tsx
@@ -5,9 +5,13 @@ class MyDocument extends Document {
return (
<Html>
<Head>
- <link rel="preconnect" href="https://fonts.googleapis.com" />
- <link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="" />
- <link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet" />
+ <link
+ rel="preload"
+ href="/fonts/Inter-VariableFont_slnt,wght.woff2"
+ as="font"
+ type="font/woff2"
+ crossOrigin="anonymous"
+ />
</Head>
<body>
<Main />
diff --git a/public/fonts/Inter-Black.woff2 b/public/fonts/Inter-Black.woff2
Binary files differ.
diff --git a/public/fonts/Inter-Bold.woff2 b/public/fonts/Inter-Bold.woff2
Binary files differ.
diff --git a/public/fonts/Inter-ExtraBold.woff2 b/public/fonts/Inter-ExtraBold.woff2
Binary files differ.
diff --git a/public/fonts/Inter-ExtraLight.woff2 b/public/fonts/Inter-ExtraLight.woff2
Binary files differ.
diff --git a/public/fonts/Inter-Light.woff2 b/public/fonts/Inter-Light.woff2
Binary files differ.
diff --git a/public/fonts/Inter-Medium.woff2 b/public/fonts/Inter-Medium.woff2
Binary files differ.
diff --git a/public/fonts/Inter-Regular.woff2 b/public/fonts/Inter-Regular.woff2
Binary files differ.
diff --git a/public/fonts/Inter-SemiBold.woff2 b/public/fonts/Inter-SemiBold.woff2
Binary files differ.
diff --git a/public/fonts/Inter-VariableFont_slnt,wght.woff2 b/public/fonts/Inter-VariableFont_slnt,wght.woff2
Binary files differ.
diff --git a/styles/globals.css b/styles/globals.css
@@ -2,6 +2,91 @@
@tailwind components;
@tailwind utilities;
+@supports not (font-variation-settings: normal) {
+ @font-face {
+ font-family: "Inter";
+ font-style: normal;
+ font-weight: 100;
+ font-display: optional;
+ src: url(/fonts/Inter-Thin.woff2) format("woff2")
+ }
+
+ @font-face {
+ font-family: "Inter";
+ font-style: normal;
+ font-weight: 200;
+ font-display: optional;
+ src: url(/fonts/Inter-ExtraLight.woff2) format("woff2")
+ }
+
+ @font-face {
+ font-family: "Inter";
+ font-style: normal;
+ font-weight: 300;
+ font-display: optional;
+ src: url(/fonts/Inter-Light.woff2) format("woff2")
+ }
+
+ @font-face {
+ font-family: "Inter";
+ font-style: normal;
+ font-weight: 400;
+ font-display: optional;
+ src: url(/fonts/Inter-Regular.woff2) format("woff2")
+ }
+
+ @font-face {
+ font-family: "Inter";
+ font-style: normal;
+ font-weight: 500;
+ font-display: optional;
+ src: url(/fonts/Inter-Medium.woff2) format("woff2")
+ }
+
+ @font-face {
+ font-family: "Inter";
+ font-style: normal;
+ font-weight: 600;
+ font-display: optional;
+ src: url(/fonts/Inter-SemiBold.woff2) format("woff2")
+ }
+
+ @font-face {
+ font-family: "Inter";
+ font-style: normal;
+ font-weight: 700;
+ font-display: optional;
+ src: url(/fonts/Inter-Bold.woff2) format("woff2")
+ }
+
+ @font-face {
+ font-family: "Inter";
+ font-style: normal;
+ font-weight: 800;
+ font-display: optional;
+ src: url(/fonts/Inter-ExtraBold.woff2) format("woff2")
+ }
+
+ @font-face {
+ font-family: "Inter";
+ font-style: normal;
+ font-weight: 900;
+ font-display: optional;
+ src: url(/fonts/Inter-Black.woff2) format("woff2")
+ }
+}
+
+@supports (font-variation-settings: normal) {
+ @font-face {
+ font-family: "Inter";
+ font-style: normal;
+ font-weight: 100 900;
+ font-display: optional;
+ src: url(/fonts/Inter-VariableFont_slnt,wght.woff2) format("woff2 supports variations"),
+ url(/fonts/Inter-VariableFont_slnt,wght.woff2) format("woff2-variations");
+ }
+}
+
html, body, #__next {
margin: 0;
@apply h-full bg-[#f8f8f8] dark:bg-[#06070D];
