From 98ad16f5e48f11f8ad92717384253cb9b6ffe0c9 Mon Sep 17 00:00:00 2001
From: Jieiku
Date: Fri, 25 Aug 2023 12:12:37 -0700
Subject: Fonts Documentation

---
 sass/abridge.scss      | 11 +++++++++++
 sass/fonts/_Arimo.scss | 17 +++++++++++++++++
 2 files changed, 28 insertions(+)
 create mode 100644 sass/fonts/_Arimo.scss

(limited to 'sass')

diff --git a/sass/abridge.scss b/sass/abridge.scss
index 684a71d..c72689c 100644
--- a/sass/abridge.scss
+++ b/sass/abridge.scss
@@ -5,6 +5,17 @@
 @use "colors";
 @use "colors-syntax";
 
+/******************************************************************************
+ *   FONTS - Abridge by default uses the System Font Stack
+ *     https://css-tricks.com/snippets/css/system-font-stack/
+ *   However if you need you can load a specific font below,
+ *     make sure to have the relevant woff2 fonts in your static/fonts folder
+ *   This is for running the theme directly, if using abridge as a theme
+ *     use the section at the bottom of your root sass/abridge.scss
+ *   I measured the least Cumulative Layout Shift with: Roboto, Lato, Arimo
+ *****************************************************************************/
+//@use "fonts/Roboto";
+
 /******************************************************************************
  *   Variables
  *****************************************************************************/
diff --git a/sass/fonts/_Arimo.scss b/sass/fonts/_Arimo.scss
new file mode 100644
index 0000000..d3dc829
--- /dev/null
+++ b/sass/fonts/_Arimo.scss
@@ -0,0 +1,17 @@
+@font-face {
+    font-family: 'Arimo';
+    src: local("Arimo"), url("fonts/Arimo.woff2");//latin regular
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Arimo';
+    src: local("Arimo-Italic"), url("fonts/Arimo-Italic.woff2");//latin italic
+    font-style: italic;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'Arimo';
+    src: local("Arimo-Bold"), url("fonts/Arimo-Bold.woff2");//latin bold
+    font-weight: bold;
+    font-display: swap;
+}
-- 
cgit v1.3.1