sections: Add title property

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

diff --git a/frontend/src/components/Section.vue b/frontend/src/components/Section.vue
index 734abd25314d9dc5706399c1eb0c93e9ad94c726..2bda15f8a26ee5ba85184c3a00b63d0469e51217 100644 (file)
--- a/frontend/src/components/Section.vue
+++ b/frontend/src/components/Section.vue
@@ -1,10 +1,12 @@
-<script setup>
-       // Nothing, yet
+<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>

diff --git a/frontend/src/views/AboutView.vue b/frontend/src/views/AboutView.vue
index ecef8bee3f1d8f9eb120ea0ce8cc6859875a75a8..1573e8acfaad2cb97909c7c8e7d87efdfdaf1e27 100644 (file)
--- a/frontend/src/views/AboutView.vue
+++ b/frontend/src/views/AboutView.vue
@@ -3,8 +3,7 @@
 </script>
 
 <template>
-       <Section>
-               <h1 class="title">About</h1>
+       <Section :title="$t('About')">
                <p>This is the about page</p>
        </Section>
 </template>

diff --git a/frontend/src/views/HomeView.vue b/frontend/src/views/HomeView.vue
index a348a64b19c238b57c7afd67291fc763211df9b7..e61a61ac377efaf42bcc3789630ac6c481af268a 100644 (file)
--- a/frontend/src/views/HomeView.vue
+++ b/frontend/src/views/HomeView.vue
@@ -3,8 +3,7 @@
 </script>
 
 <template>
-       <Section>
-               <h1 class="title">{{ $t("Welcome") }}</h1>
+       <Section :title="$t('Welcome')">
                <p>{{ $t("This is the front page") }}</p>
        </Section>
 </template>