import fonts manually || webfontloader

whoisjorge · Jul 12, 2018 · cc8fa48 · cc8fa48
1 parent 62d85c6
commit cc8fa48
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 51 deletions.
diff --git a/src/plugins/webfontloader.js b/src/plugins/webfontloader.js
@@ -1,10 +1,6 @@
 const WebFontLoader = require('webfontloader')
 
 WebFontLoader.load({
-  custom: {
-    families: ['Custom-Font'],
-    urls: ['fonts/import.css']
-  },
   google: {
     families: [
       'Overpass:300,600,700',

diff --git a/src/styles/base/_fonts.scss b/src/styles/base/_fonts.scss
@@ -4,14 +4,14 @@
 // Locally import Google Fonts for safety & performance
 // SIL Open Font License (https://fonts.google.com/attribution)
 
-// @font-face {
-//   font-family: 'Work Sans';
-//   font-style: normal;
-//   font-weight: 200;
-//   src: url('./assets/fonts/Work-Sans/work-sans-v3-latin-200.eot'); /* IE9 Compat Modes */
-//   src: local('Work Sans Thin'), local('WorkSans-Thin'),
-//        url('./assets/fonts/Work-Sans/work-sans-v3-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
-//        url('./assets/fonts/Work-Sans/work-sans-v3-latin-200.woff2') format('woff2'), /* Super Modern Browsers */
-//        url('./assets/fonts/Work-Sans/work-sans-v3-latin-200.woff') format('woff'), /* Modern Browsers */
-//        url('./assets/fonts/Work-Sans/work-sans-v3-latin-200.ttf') format('truetype') /* Safari, Android, iOS */
-// }
+@font-face {
+  font-family: 'Work Sans';
+  font-style: normal;
+  font-weight: 200;
+  src: url('./assets/fonts/Work-Sans/work-sans-v3-latin-200.eot'); /* IE9 Compat Modes */
+  src: local('Work Sans Thin'), local('WorkSans-Thin'),
+       url('./assets/fonts/Work-Sans/work-sans-v3-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+       url('./assets/fonts/Work-Sans/work-sans-v3-latin-200.woff2') format('woff2'), /* Super Modern Browsers */
+       url('./assets/fonts/Work-Sans/work-sans-v3-latin-200.woff') format('woff'), /* Modern Browsers */
+       url('./assets/fonts/Work-Sans/work-sans-v3-latin-200.ttf') format('truetype') /* Safari, Android, iOS */
+}
diff --git a/src/styles/base/_general.scss b/src/styles/base/_general.scss
@@ -3,11 +3,11 @@
 
 @import '../vendor/normalize';
 
-:root { font-size: 62.5% }
 ::selection { background: rgba(27, 141, 29, 0.1) }
 ::-webkit-scrollbar { display: none }
 
 html {
+  font-size: 14px;
   box-sizing: border-box;
   overflow-x: hidden;
   -ms-overflow-style: -ms-autohiding-scrollbar;
@@ -21,21 +21,18 @@ html {
 }
 
 body, input, textarea {
-  font-family: 'Overpass', -apple-system, BlinkMacSystemFont, 'Segoe UI',
-    Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
-    'Segoe UI Symbol';
-  font-size: 1.65rem;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica,
+    Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
   font-weight: 300;
-  line-height: 1.3;
+  line-height: 1.5;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   color: $color--black;
   letter-spacing: -.25px;
 }
 
-h1 {
-  font-size: 30px;
-  line-height: 1;
+h1, h2, h3, h4, h5, h6 {
+  margin: 0;
 }
 
 ul, li {
@@ -71,34 +68,7 @@ input[type=submit] {
   border-radius: 0;
 }
 
-button {
-  background: none;
-  border: 0;
-  border-radius: 0;
-  color: inherit;
-  /* cursor: default; */
-  font: inherit;
-  line-height: normal;
-  overflow: visible;
-  padding: 0;
-  -webkit-appearance: button; /* ~x input */
-  user-select: none; /* ~x button */
-  &:hover {
-    cursor: pointer;
-  }
-}
 button::-moz-focus-inner {
     border: 0;
     padding: 0;
 }
-
-// https://helpx.adobe.com/typekit/using/font-events.html
-html, .wf-loading {
-  visibility: hidden !important;
-  opacity: 0;
-}
-.wf-active, .wf-inactive {
-  visibility: visible !important;
-  opacity: 1;
-  transition: opacity 0.5s;
-}