[WIP]: Add styling to itemPage

- centralizing navbar scss
- building custom 404 page
- building navbar struct MainPage

frontend/src/components/HomePage.vue

@@ -0,0 +1,71 @@
+<template>
+  <div class="main">
+
+      <div v-if="loading">
+        <h1 class="loading">Loading...</h1>
+      </div>
+      <div v-else>
+
+        <!-- navbar -->
+
+        <header class="navbar-header">
+          <div class="logo">
+            <a>Home</a>
+          </div>
+
+          <input type="checkbox" class="menu-btn" id="menu-btn">
+          <label for="menu-btn" class="menu-icon">
+            <span class="menu-icon__line"></span>
+          </label>
+
+          <ul class="nav-links">
+            <li class="nav-link">
+              <a href="#">Profile</a>
+            </li>
+            <li class="nav-link">
+              <a href="#">Storage</a>
+            </li>
+            <li class="nav-link">
+              <a href="#">Recipes</a>
+            </li>
+            <li class="nav-link">
+              <a href="#">About</a>
+            </li>
+          </ul>
+        </header>
+    </div>
+  </div>
+
+</template>
+
+
+<script>
+export default {
+  name: "HomePage"
+}
+</script>
+
+<style lang="scss">
+
+@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200&display=swap');
+@import 'src/styling/navbar';
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+.main {
+  font-family: 'Montserrat', sans-serif;
+  height: 100vh;
+  display: grid;
+  justify-content: center;
+  align-items: center;
+  font-size: 1.25rem;
+  background-color: darkcyan;
+}
+
+</style>