commit 4f451f8479d89aa900095fdefe39b6d070a61867
parent d91a6287a22add7f0e8fa26359d8072e6f84ab04
Author: Theo Browne <me@t3.gg>
Date: Fri, 14 Feb 2025 23:04:53 -0800
better font loading
Diffstat:
2 files changed, 31 insertions(+), 1 deletion(-)
diff --git a/index.html b/index.html
@@ -3,6 +3,27 @@
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/search.svg" />
+ <link
+ rel="preconnect"
+ href="https://fonts.googleapis.com"
+ crossorigin="anonymous"
+ />
+ <link
+ rel="preconnect"
+ href="https://fonts.gstatic.com"
+ crossorigin="anonymous"
+ />
+ <link
+ rel="preload"
+ as="style"
+ href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
+ />
+ <link
+ rel="stylesheet"
+ href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
+ media="print"
+ onload="this.media='all'"
+ />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Unduck</title>
<meta
diff --git a/src/global.css b/src/global.css
@@ -1,8 +1,17 @@
-@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");
+/* @import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"); */
+
+/* Font fallback that closely matches Inter metrics */
+@font-face {
+ font-family: "Inter Fallback";
+ size-adjust: 107%;
+ ascent-override: 90%;
+ src: local("Arial");
+}
:root {
font-family:
Inter,
+ "Inter Fallback",
system-ui,
-apple-system,
BlinkMacSystemFont,