Merge pull request #2311 from dappnode/mateu/use-local-fonts

Use fonts locally instead of google fonts

Author: Marketen

packages/admin-ui/index.html

@@ -10,12 +10,6 @@
     <link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32" />
     <link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16" />
     <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
-    <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:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap"
-      rel="stylesheet"
-    />
     <meta name="theme-color" content="#ffffff" />
     <!--
       manifest.json provides metadata used when your web app is added to the

packages/admin-ui/public/fonts/inter/Inter-Italic-VariableFont_opsz,wght.ttf

@@ -0,0 +1,44 @@
+@font-face {
+  font-family: "Montserrat";
+  src: url("/fonts/montserrat/Montserrat-VariableFont_wght.ttf") format("truetype");
+  font-weight: 100 900;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Montserrat";
+  src: url("/fonts/montserrat/Montserrat-Italic-VariableFont_wght.ttf") format("truetype");
+  font-weight: 100 900;
+  font-style: italic;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Inter";
+  src: url("/fonts/inter/Inter-VariableFont_opsz,wght.ttf") format("truetype");
+  font-weight: 100 900;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "Inter";
+  src: url("/fonts/inter/Inter-Italic-VariableFont_opsz,wght.ttf") format("truetype");
+  font-weight: 100 900;
+  font-style: italic;
+  font-display: swap;
+}
+
+.section-title,
+.section-subtitle,
+.sidenav-item,
+.horizontal-navbar,
+.pkgs-back-btn {
+  font-family: "Montserrat", sans-serif;
+}
+
+// Body text style
+body {
+  font-family: "Inter", sans-serif;
+}

packages/admin-ui/public/fonts/inter/Inter-VariableFont_opsz,wght.ttf

@@ -16,6 +16,7 @@ import "./dappnode_styles.scss";
 import "./dappnode_colors.scss";
 import "./light_dark.scss";
 import "./layout.scss";
+import "./fonts.scss";
 import { PwaInstallProvider } from "pages/system/components/App/PwaInstallContext";
 
 // This process.env. vars will be substituted at build time

packages/admin-ui/public/fonts/montserrat/Montserrat-Italic-VariableFont_wght.ttf

@@ -26,24 +26,6 @@
   --z-index-topbar: 1000;
 }
 
-/* 
-  TEXT STYLES 
-*/
-
-// Titles and navigators
-.section-title,
-.section-subtitle,
-.sidenav-item,
-.horizontal-navbar,
-.pkgs-back-btn {
-  font-family: "Montserrat", sans-serif;
-}
-
-// Body text style
-body {
-  font-family: "Inter", sans-serif;
-}
-
 /* Reset margins and underlying sizes. 
    The height 100% is necessary so child elements have a reference to be full width
 */