From: Michael Tremer <michael.tremer@ipfire.org>
Date: Thu, 19 Jun 2025 16:11:07 +0000 (+0000)
Subject: frontend: Create some simple Home view
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=3729646a64c4ec5411122f907af816c3fb74e883;p=pbs.git

frontend: Create some simple Home view

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>
---

diff --git a/frontend/src/components/Notification.vue b/frontend/src/components/Notification.vue
new file mode 100644
index 00000000..563799ce
--- /dev/null
+++ b/frontend/src/components/Notification.vue
@@ -0,0 +1,25 @@
+<script setup lang="ts">
+	import { ref } from "vue";
+
+	defineProps<{
+		title?: string,
+		isClosable?: boolean,
+	}>()
+
+	// Should this notification be shown?
+	const show = ref(true);
+</script>
+
+<template>
+	<div class="notification" v-if="show">
+		<button v-if="isClosable" class="delete" @click="show = false"></button>
+
+		<!-- Title -->
+		<p v-if="title">
+			<strong>{{ title }}</strong>
+		</p>
+
+		<!-- Content -->
+		<slot />
+	</div>
+</template>
diff --git a/frontend/src/components/Section.vue b/frontend/src/components/Section.vue
new file mode 100644
index 00000000..7e70e92f
--- /dev/null
+++ b/frontend/src/components/Section.vue
@@ -0,0 +1,13 @@
+<script setup lang="ts">
+	const { title } = defineProps(["title"])
+</script>
+
+<template>
+	<section class="section">
+		<div class="container">
+			<h1 v-if="title" class="title">{{ title }}</h1>
+
+			<slot />
+		</div>
+	</section>
+</template>
diff --git a/frontend/src/views/HomeView.vue b/frontend/src/views/HomeView.vue
new file mode 100644
index 00000000..6227d54c
--- /dev/null
+++ b/frontend/src/views/HomeView.vue
@@ -0,0 +1,9 @@
+<script setup lang="ts">
+	import Section from "../components/Section.vue"
+</script>
+
+<template>
+	<Section :title="$t('Welcome')">
+		<p>{{ $t("This is the front page") }}</p>
+	</Section>
+</template>