fix(css/fonts): load fonts in main.scss

leaonline · Jul 4, 2023 · 2ab200c · 2ab200c
1 parent a330ad2
commit 2ab200c
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 18 deletions.
diff --git a/client/main.html b/client/main.html
@@ -6,18 +6,6 @@
 	<meta name="theme-color" content="#FF00AA">
 	<meta http-equiv="Content-Security-Policy"
 		  content="default-src *; style-src 'self' http://* 'unsafe-inline'; script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'" />
-    <style>
-        @font-face {
-            font-family: 'Semikolon';
-            src: url('SemikolonPlus-Regular.otf') format('opentype');
-            font-display: swap;
-        }
-        @font-face {
-            font-family: 'SemikolonBold';
-            src: url('SemikolonPlus-Bold.otf') format('opentype');
-            font-display: swap;
-        }
-    </style>
 	<link rel="shortcut icon" type="image/png" href="/icon/favicon.png?v1" sizes="16x16 32x32 64x64">
 	<link rel="apple-touch-icon" sizes="120x120" href="/icon/apple-touch-icon-precomposed.png">
 	<link rel="fluid-icon" href="/icon/favicon.png?v1" title="otu.lea icon">

diff --git a/client/main.scss b/client/main.scss
@@ -1,3 +1,14 @@
+@font-face {
+  font-family: 'Semikolon';
+  src: url('SemikolonPlus-Regular.otf') format('opentype');
+  font-display: swap;
+}
+@font-face {
+  font-family: 'SemikolonBold';
+  src: url('SemikolonPlus-Bold.otf') format('opentype');
+  font-display: swap;
+}
+
 body, wrapper {
   background-color: #FFF !important;
   min-height:100vh;
@@ -51,40 +62,40 @@ body, wrapper {
 
 @media (min-width: 240px) {
   .lea-text {
-    font-family: Semikolon, Arial !important;
+    font-family: Semikolon !important;
     font-size: 12px;
   }
 }
 @media (min-width: 576px) {
   .lea-text {
-    font-family: Semikolon, Arial !important;
+    font-family: Semikolon !important;
     font-size: 16px;
   }
 }
 
 // Medium devices (tablets, 768px and up)
 @media (min-width: 768px) {
   .lea-text {
-    font-family: Semikolon, Arial !important;
+    font-family: Semikolon !important;
     font-size: 20px;
   }
 }
 
 // Large devices (desktops, 992px and up)
 @media (min-width: 992px) {
   .lea-text {
-    font-family: Semikolon, Arial !important;
+    font-family: Semikolon !important;
     font-size: 24px;
   }
 }
 
 .lea-text-bold {
-  font-family: SemikolonBold, Semikolon, sans-serif;
+  font-family: SemikolonBold !important;
   font-size: 24px;
 }
 
 h1 {
-  font-family: Semikolon, Arial !important;
+  font-family: Semikolon !important;
   font-size: 30px;
 }