use new font distribution

premist · Jun 13, 2024 · dc63141 · dc63141
1 parent 17b42d8
commit dc63141
Show file tree

Hide file tree

Showing 5 changed files with 26 additions and 29 deletions.
diff --git a/themes/simplist2022/assets/styles/common.scss b/themes/simplist2022/assets/styles/common.scss
@@ -1,11 +1,15 @@
+:host, html, body {
+  text-rendering: optimizeLegibility;
+  font-synthesis: none;
+  font-feature-settings: "ss02", "rlig";
+}
+
 body {
-  font-family: $primary-font;
-  font-weight: $force-font-weight;
+  font-family: $font;
+  font-weight: $primary-font-weight;
   font-size: $font-size;
   line-height: $line-height;
-  letter-spacing: 0.005em;
 
-  text-rendering: optimizeLegibility;
   word-break: keep-all;
   word-wrap: break-word;
 
@@ -58,12 +62,13 @@ footer {
 }
 
 h1, h2, h3, h4, h5, h6, strong, b {
-  font-weight: $force-font-weight;
+  font-weight: $primary-font-weight;
 }
 
 h1, h2 {
   font-size: 2em;
-  font-family: $semibold-font;
+  font-family: $font;
+  font-weight: 500;
 
   line-height: 1.5em;
 
@@ -80,9 +85,8 @@ h1, h2 {
 
 h3, h4, h5, h6 {
   font-size: 1.3em;
-  font-family: $bold-font;
-
   line-height: 1.5em;
+  font-weight: 700;
 
   color: $bold-color;
 

diff --git a/themes/simplist2022/assets/styles/content.scss b/themes/simplist2022/assets/styles/content.scss
@@ -17,7 +17,7 @@ figure {
 }
 
 b, strong {
-  font-family: $bold-font;
+  font-weight: 700;
 }
 
 img {
@@ -96,7 +96,7 @@ figure {
 
 figcaption * {
   font-size: 0.8em;
-  font-family: $primary-font;
+  font-family: $font;
   text-align: right;
 
   line-height: 1.6em;

diff --git a/themes/simplist2022/assets/styles/mainpage-archive.scss b/themes/simplist2022/assets/styles/mainpage-archive.scss
@@ -32,14 +32,14 @@
       display: block;
       margin-bottom: 0.2rem;
 
-      font-family: $bold-font;
+      font-weight: 700;
     }
 
     & .meta {
       display: flex;
       gap: 0.8rem;
 
-      font-family: $semibold-font;
+      font-weight: 500;
       text-transform: capitalize;
 
       color: $caption-color;

diff --git a/themes/simplist2022/assets/styles/variables.scss b/themes/simplist2022/assets/styles/variables.scss
@@ -1,13 +1,9 @@
 $container-width: 1024px;
 
 // Fonts
-$force-font-weight: 400;
-
-$primary-font: "Lab Grotesque Regular", "Gothic A1 Medium", "Helvetica", "Arial", "Noto Sans CJK KR", "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
-
-$semibold-font: 'Lab Grotesque Medium', 'Gothic A1 SemiBold', "Helvetica", "Arial", "Noto Sans CJK KR", "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
-$bold-font: 'Lab Grotesque Bold', 'Gothic A1 Bold',  "Helvetica", "Arial", "Noto Sans CJK KR", "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
+$primary-font-weight: 400;
 
+$font: "Lab Grotesque", "Gothic A1 LabGrtsqMatch", "Helvetica", "Arial", "Noto Sans CJK KR", "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 $syntax-highlighting-font: "Fira Code", "Menlo", "Monaco", "Liberation Mono", Consolas, Courier, monospace;
 
 

diff --git a/themes/simplist2022/layouts/partials/begin.html b/themes/simplist2022/layouts/partials/begin.html
@@ -14,17 +14,14 @@
     {{ template "_internal/opengraph.html" . }}
     <meta property="article:author" content="{{ .Site.Params.AuthorFacebook }}">
 
-    <link rel="preload" as="style" href="https://o.polychrome.network/fonts/ofl/Fira Code.css">
-    <link rel="preload" as="style" href="https://o.polychrome.network/fonts/ofl/Gothic A1 Medium.css">
-    <link rel="preload" as="style" href="https://o.polychrome.network/fonts/ofl/Gothic A1 SemiBold.css">
-    <link rel="preload" as="style" href="https://o.polychrome.network/fonts/ofl/Gothic A1 Bold.css">
-    <link rel="preload" as="style" href="https://o.polychrome.network/fonts/lfs/Lab Grotesque.css">
-
-    <link rel="stylesheet" href="https://o.polychrome.network/fonts/ofl/Fira Code.css">
-    <link rel="stylesheet" href="https://o.polychrome.network/fonts/ofl/Gothic A1 Medium.css">
-    <link rel="stylesheet" href="https://o.polychrome.network/fonts/ofl/Gothic A1 SemiBold.css">
-    <link rel="stylesheet" href="https://o.polychrome.network/fonts/ofl/Gothic A1 Bold.css">
-    <link rel="stylesheet" href="https://o.polychrome.network/fonts/lfs/Lab Grotesque.css">
+    <link href="https://o.polychrome.network/fonts/ofl/gothic-a1-labgrtsqmatch-v1/100/Gothic A1 ExtraLight.css" rel="stylesheet" />
+    <link href="https://o.polychrome.network/fonts/ofl/gothic-a1-labgrtsqmatch-v1/300/Gothic A1 Light.css" rel="stylesheet" />
+    <link href="https://o.polychrome.network/fonts/ofl/gothic-a1-labgrtsqmatch-v1/400/Gothic A1 Medium.css" rel="stylesheet" />
+    <link href="https://o.polychrome.network/fonts/ofl/gothic-a1-labgrtsqmatch-v1/500/Gothic A1 SemiBold.css" rel="stylesheet" />
+    <link href="https://o.polychrome.network/fonts/ofl/gothic-a1-labgrtsqmatch-v1/700/Gothic A1 Bold.css" rel="stylesheet" />
+    <link href="https://o.polychrome.network/fonts/ofl/gothic-a1-labgrtsqmatch-v1/900/Gothic A1 Black.css" rel="stylesheet" />
+    <link href="https://o.polychrome.network/fonts/lfs/LabGrotesque-v2.css" rel="stylesheet" />
+    <link href="https://o.polychrome.network/fonts/ofl/Fira Code.css" rel="stylesheet">
 
     {{ $css := resources.Get "styles/main.scss" | toCSS | minify }}
     <style>{{ $css.Content | safeCSS }}</style>