From 4eec366672d570c21a3fc0b83ded80918f5c19f2 Mon Sep 17 00:00:00 2001
From: kevin-DL <kevanatole@gmail.com>
Date: Fri, 26 Apr 2024 14:31:58 +0100
Subject: [PATCH] Add vue-router Add home page

---
 frontend/package.json  |  5 +++--
 frontend/src/App.vue   | 22 ++++++----------------
 frontend/src/main.js   | 21 +++++++++++++++++++--
 frontend/src/style.css | 25 +------------------------
 4 files changed, 29 insertions(+), 44 deletions(-)

diff --git a/frontend/package.json b/frontend/package.json
index 43da9cb..e4e6101 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -9,10 +9,11 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "vue": "^3.2.37"
+    "vue": "^3.2.37",
+    "vue-router": "^4.3.2"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^3.0.3",
     "vite": "^3.0.7"
   }
-}
\ No newline at end of file
+}
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 15d2f12..c95bfe2 100644
--- a/frontend/src/App.vue
+++ b/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>
diff --git a/frontend/src/main.js b/frontend/src/main.js
index f9754fe..5122f1e 100644
--- a/frontend/src/main.js
+++ b/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')
diff --git a/frontend/src/style.css b/frontend/src/style.css
index 3940d6c..9c79eb2 100644
--- a/frontend/src/style.css
+++ b/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;
+    height: 100vh;    
 }