From 4d8dcef6a2171a680bd24920bd16e9875b2f1cfc Mon Sep 17 00:00:00 2001
From: developomp <developomp@gmail.com>
Date: Tue, 11 Jan 2022 16:26:28 +0900
Subject: [PATCH] added pages

---
 src/constants.ts                    |  6 ++++++
 src/pages/Home/ActionButtons.svelte | 19 +++++++++++--------
 src/pages/Install/index.svelte      |  5 +++++
 src/pages/Status/index.svelte       |  5 +++++
 src/pages/Update/index.svelte       |  5 +++++
 src/routes.ts                       |  6 ++++++
 6 files changed, 38 insertions(+), 8 deletions(-)
 create mode 100644 src/constants.ts
 create mode 100644 src/pages/Install/index.svelte
 create mode 100644 src/pages/Status/index.svelte
 create mode 100644 src/pages/Update/index.svelte

diff --git a/src/constants.ts b/src/constants.ts
new file mode 100644
index 0000000..ab6bf5a
--- /dev/null
+++ b/src/constants.ts
@@ -0,0 +1,6 @@
+export enum ROUTES {
+	HOME = "#/",
+	STATUS = "#/status",
+	INSTALL = "#/install",
+	UPDATE = "#/update",
+}
diff --git a/src/pages/Home/ActionButtons.svelte b/src/pages/Home/ActionButtons.svelte
index 04547c7..48cda07 100644
--- a/src/pages/Home/ActionButtons.svelte
+++ b/src/pages/Home/ActionButtons.svelte
@@ -2,29 +2,32 @@
 	import FaTasks from "svelte-icons/fa/FaTasks.svelte"
 	import FaArrowAltCircleRight from "svelte-icons/fa/FaArrowAltCircleRight.svelte"
 	import Update from "svelte-icons/fa/FaRedoAlt.svelte"
+	import { ROUTES } from "../../constants"
 </script>
 
 <div class="main-buttons-container">
-	<button>
+	<a href={ROUTES.STATUS}>
 		<div class="icon"><FaTasks /></div>
 		<div>Status</div>
-	</button>
-	<button>
+	</a>
+
+	<a href={ROUTES.INSTALL}>
 		<div class="icon"><FaArrowAltCircleRight /></div>
 		<div>Install</div>
-	</button>
-	<button>
+	</a>
+
+	<a href={ROUTES.UPDATE}>
 		<div class="icon"><Update /></div>
 		<div>Update</div>
-	</button>
+	</a>
 </div>
 
 <style lang="scss">
 	.main-buttons-container {
 		@apply grid gap-6 grid-cols-3;
 
-		button {
-			@apply p-4 w-24 h-24 rounded-xl bg-red-500 text-white font-normal;
+		a {
+			@apply p-4 w-24 h-24 text-center rounded-xl bg-red-500 text-white font-normal;
 
 			.icon {
 				@apply w-full h-6 mb-2;
diff --git a/src/pages/Install/index.svelte b/src/pages/Install/index.svelte
new file mode 100644
index 0000000..c3928e3
--- /dev/null
+++ b/src/pages/Install/index.svelte
@@ -0,0 +1,5 @@
+<script lang="ts">
+	import { ROUTES } from "../../constants"
+</script>
+
+<a href={ROUTES.HOME}>Home</a>
diff --git a/src/pages/Status/index.svelte b/src/pages/Status/index.svelte
new file mode 100644
index 0000000..c3928e3
--- /dev/null
+++ b/src/pages/Status/index.svelte
@@ -0,0 +1,5 @@
+<script lang="ts">
+	import { ROUTES } from "../../constants"
+</script>
+
+<a href={ROUTES.HOME}>Home</a>
diff --git a/src/pages/Update/index.svelte b/src/pages/Update/index.svelte
new file mode 100644
index 0000000..c3928e3
--- /dev/null
+++ b/src/pages/Update/index.svelte
@@ -0,0 +1,5 @@
+<script lang="ts">
+	import { ROUTES } from "../../constants"
+</script>
+
+<a href={ROUTES.HOME}>Home</a>
diff --git a/src/routes.ts b/src/routes.ts
index bcc1b5b..c223962 100644
--- a/src/routes.ts
+++ b/src/routes.ts
@@ -1,5 +1,11 @@
 import Home from "./pages/Home/index.svelte"
+import Status from "./pages/Status/index.svelte"
+import Install from "./pages/Install/index.svelte"
+import Update from "./pages/Update/index.svelte"
 
 export default {
 	"/": Home,
+	"/status": Status,
+	"/install": Install,
+	"/update": Update,
 }