[+] Home screen

public/fonts/hua/font-hua.css

@@ -0,0 +1,4 @@
+@font-face {
+    font-family: 'Hua';
+    src: url("./FZSJ-HUAZCMWWKQ.woff2") format('woff2'), url("./FZSJ-HUAZCMWWKQ.ttf") format('truetype');
+}

src/css/global.sass

@@ -1,8 +1,25 @@
 @import colors
 
-// Constants
+// Google Fonts
+// TODO: Localize
+@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@300&family=Shadows+Into+Light&display=swap')
+@import url('https://fonts.googleapis.com/css2?family=Caveat&display=swap')
+@import url('/fonts/hua/font-hua.css')
+
 $font: "Microsoft YaHei UI", Avenir, Helvetica, Arial, sans-serif
 
+.font-code
+  font-family: Inconsolata, Monaco, Monospaced, serif
+
+.font-script-en
+  font-family: 'Caveat', 'Shadows Into Light', cursive
+
+.font-script-cn
+  font-family: Hua, $font
+
+.bold
+  font-weight: bold
+
 // Container width (This is normally 50vw,
 //   but when it's smaller than 900px, use 100vw - 50px, because 50px is the margin)
 $app-width: max(50vw, min(900px, 100vw - 50px))

src/views/Home.vue

@@ -1,6 +1,9 @@
 <template>
-    <div class="home">
-        Hello World
+    <div id="Home" class="fbox-center f-grow1">
+        <div id="box">
+            <div class="font-script-en">Hykilpikonna's</div>
+            <div class="font-script-en bold">Road Less Traveled</div>
+        </div>
     </div>
 </template>
 
@@ -10,5 +13,14 @@ import {Options, Vue} from 'vue-class-component';
 @Options({components: {}})
 export default class Home extends Vue
 {
+
 }
 </script>
+
+<style lang="sass" scoped>
+#box
+    font-size: 3em
+
+#Home
+    text-align: left
+</style>