Add vue-router

Add home page

frontend/package.json

@@ -9,7 +9,8 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "vue": "^3.2.37"
+    "vue": "^3.2.37",
+    "vue-router": "^4.3.2"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^3.0.3",

frontend/src/App.vue

@@ -1,21 +1,11 @@
 <script setup>
-import HelloWorld from './components/HelloWorld.vue'</script>
+import { RouterView } from 'vue-router'
+</script>
 
 <template>
-  <img id="logo" alt="Wails logo" src="./assets/images/logo-universal.png"/>
-  <HelloWorld/>
+  <main>
+    <RouterView />
+  </main>
 </template>
 
-<style>
-#logo {
-  display: block;
-  width: 50%;
-  height: 50%;
-  margin: auto;
-  padding: 10% 0 0;
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  background-origin: content-box;
-}
-</style>
+<style></style>

frontend/src/main.js

@@ -1,5 +1,22 @@
-import {createApp} from 'vue'
+import { createApp } from 'vue'
+import { createWebHashHistory, createRouter } from 'vue-router'
 import App from './App.vue'
 import './style.css';
 
-createApp(App).mount('#app')
+const routes = [
+	{
+		path: '/',
+		name: 'home',
+		component: () => import('./pages/Index.vue')
+	}
+]
+
+const router = createRouter({
+	history: createWebHashHistory(),	
+	routes
+})
+
+
+createApp(App)
+	.use(router)
+	.mount('#app')

frontend/src/style.css

@@ -1,26 +1,3 @@
-html {
-    background-color: rgba(27, 38, 54, 1);
-    text-align: center;
-    color: white;
-}
-
-body {
-    margin: 0;
-    color: white;
-    font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
-    "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
-    sans-serif;
-}
-
-@font-face {
-    font-family: "Nunito";
-    font-style: normal;
-    font-weight: 400;
-    src: local(""),
-    url("assets/fonts/nunito-v16-latin-regular.woff2") format("woff2");
-}
-
 #app {
     height: 100vh;    
-    text-align: center;
 }