Merge pull request #178 from rei/font-fallback-cls

perf(cdr-fonts.css): Low-CLS fallback
rei · Jul 2, 2024 · a9d70d5 · a9d70d5
2 parents 14572b0 + 7cbc27b
commit a9d70d5
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/public/cdr-fonts.css b/public/cdr-fonts.css
@@ -4,6 +4,12 @@
   font-weight: 1 999;
   src: url("//www.rei.com/satchel/media/font-optimized/Stuart/REIStuart-VF-Web-Subset.woff2") format("woff2-variations"), url("//www.rei.com/satchel/media/font-optimized/Stuart/REIStuart-VF-Web-Subset.woff2") format("woff2"); }
 
+@font-face {
+  font-family: "Stuart fallback";
+  src: local("Georgia");
+  size-adjust: 106%
+}
+
 @font-face {
   font-display: swap;
   font-family: Stuart;
@@ -17,6 +23,12 @@
   font-weight: 1 999;
   src: url("//www.rei.com/satchel/media/font-optimized/Graphik/Graphik-VF-Web-Subset.woff2") format("woff2-variations"), url("//www.rei.com/satchel/media/font-optimized/Graphik/Graphik-VF-Web-Subset.woff2") format("woff2"); }
 
+@font-face {
+  font-family: "Graphik fallback";
+  src: local("Verdana");
+  size-adjust: 92%;
+}
+
 @font-face {
   font-display: swap;
   font-family: Graphik;

diff --git a/public/cdr-reset.css b/public/cdr-reset.css
@@ -25,7 +25,7 @@ html {
 
 body {
   /* cdr-text-default */
-  font-family: Graphik, "Helvetica Neue", sans-serif;
+  font-family: Graphik, "Graphik fallback", "Helvetica Neue", sans-serif;
   font-style: normal;
   font-weight: 400;
   letter-spacing: -0.16px;