Adding font

.gitattributes

@@ -0,0 +1,6 @@
+**.png filter=lfs diff=lfs merge=lfs -text
+**.jpg filter=lfs diff=lfs merge=lfs -text
+**.jpeg filter=lfs diff=lfs merge=lfs -text
+**.ttf filter=lfs diff=lfs merge=lfs -text
+**.woff filter=lfs diff=lfs merge=lfs -text
+**.ico filter=lfs diff=lfs merge=lfs -text

assets/scss/_fonts.scss

@@ -0,0 +1,52 @@
+
+// 'Mochiy Pop P One' font
+@font-face {
+  font-family: 'Mochiy Pop P One';
+  font-style: normal;
+  font-weight: 400;
+  src: url(/fonts/mochiypoppone.ttf) format('truetype');
+}
+
+// Lato font
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 400;
+  font-display: swap;
+  src: url(/fonts/lato_italic_400.ttf) format('truetype');
+}
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 700;
+  font-display: swap;
+  src: url(/fonts/lato_italic_700.ttf) format('truetype');
+}
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 900;
+  font-display: swap;
+  src: url(/fonts/lato_italic_900.ttf) format('truetype');
+}
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(/fonts/lato_normal_400.ttf) format('truetype');
+}
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url(/fonts/lato_normal_700.ttf) format('truetype');
+}
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 900;
+  font-display: swap;
+  src: url(/fonts/lato_normal_900.ttf) format('truetype');
+}

assets/scss/_footer.scss

@@ -1,6 +1,14 @@
 footer {
     margin: 0 auto;
-    background: $background_accent_1;
+    background: $background_accent_2;
     padding: 20px 30px;
-    box-shadow: 5px 5px 5px 10px $background_accent_1;
+    font-size: $font_size_default;
+    color: $font_default;
+    text-align: center;
+    a {
+        color: $font_accent_4;
+    }
+    a:hover {
+        color: $font_accent_3;
+    }
 }

assets/scss/_general.scss

@@ -1,21 +1,13 @@
 body {
-    font-family: 'Verdana', sans-serif;
+    font-family: 'Lato', sans-serif;
     margin: 25px 25px 50px 25px;
     background: $background_accent_2;
-    color: $font_default;
-}
-
-h1, h2 {
-  color: $font_accent_3;
-  text-shadow: 0px 0px 1px black;
-}
-
-a {
-    color: $font_accent_2;
-}
-
-a:hover {
-    color: $font_accent_3;
+    a {
+        color: $font_accent_2;
+    }
+    a:hover {
+        color: $font_accent_3;
+    }
 }
 
 .left {

assets/scss/_header.scss

@@ -1,16 +1,18 @@
 header {
-    margin: 0 auto;
+    margin: -25px -25px 0px -25px;
     background: $background_accent_1;
     padding: 20px 30px;
     box-shadow: 5px 5px 5px 10px $background_accent_1;
-    h1, h1 a, h1 a:hover, h1 a:link {
+    h1 a, h1 a:hover, h1 a:link {
+        font-family: 'Mochiy Pop P One', sans-serif;
         color: $font_accent_1;
         margin: 0;
-        font-weight: normal;
-        font-size: 42px;
+        font-weight: bold;
         text-decoration: none;
+        font-size: $font_size_h1;
     }
     nav ul {
+        font-size: $font_size_default;
         list-style: none;
         margin: 0;
         padding: 0;

assets/scss/_page.scss

@@ -2,4 +2,23 @@ div.page {
     margin: 0 auto;
     padding: 20px 30px;
     background: transparent;
+    p, a{
+      color: $font_default;
+      font-size: $font_size_default;
+    }
+
+    code {
+      color: $font_accent_4;
+      font-size: $font_size_code;
+    }
+    h1 {
+        color: $font_accent_3;
+        font-size: $font_size_h1;
+        text-shadow: 0px 0px 1px black;
+    }
+    h2 {
+        color: $font_accent_3;
+        font-size: $font_size_h2;
+        text-shadow: 0px 0px 1px black;
+    }
 }

assets/scss/_start.scss

@@ -14,4 +14,19 @@ div.start {
         max-height: 7dh;
         max-width: 100%;
     }
+
+    p, a{
+      color: $font_default;
+      font-size: $font_size_default;
+    }
+
+    code {
+      color: $font_accent_4;
+      font-size: $font_size_code;
+    }
+    h2 {
+        color: $font_accent_3;
+        font-size: $font_size_h2;
+        text-shadow: 0px 0px 1px black;
+    }
 }

assets/scss/_variables.scss

@@ -4,4 +4,10 @@ $background_accent_2: black;
 $font_accent_1: red;
 $font_accent_2: maroon;
 $font_accent_3: orangered;
+$font_accent_4: rgb(247, 196, 24 );
 $font_default: white;
+
+$font_size_default: 1.5em;
+$font_size_code: 1.7em;
+$font_size_h1: 3em;
+$font_size_h2: 2.3em;

assets/scss/main.scss

@@ -1,4 +1,5 @@
 @import "_variables";
+@import "_fonts";
 
 @import "_page.scss";
 

assets/scss/start.scss

@@ -1,4 +1,5 @@
 @import "_variables";
+@import "_fonts";
 
 @import "_start";