AboutDialog hinzugefügt

src/components/AboutDialog.vue

@@ -0,0 +1,49 @@
+<template>
+  <v-dialog
+    v-model="dialog"
+    max-width="400"
+  >
+    <v-card>
+      <v-card-title class="text-h5">
+        Über SISSy
+      </v-card-title>
+
+      <v-card-text>
+        <AboutScreen/>
+      </v-card-text>
+
+      <v-card-actions>
+        <v-spacer></v-spacer>
+
+        <v-btn
+          color="indigo darken-1"
+          text
+          @click="dialog = false"
+        >
+          Ok
+        </v-btn>
+      </v-card-actions>
+    </v-card>
+  </v-dialog>
+</template>
+
+<script>
+import AboutScreen from '@/components/AboutScreen'
+
+export default {
+  name: 'AboutDialog',
+  components: {
+    AboutScreen
+  },
+  data: () => {
+    return {
+      dialog: false
+    }
+  },
+  methods: {
+    showAbout () {
+      this.dialog = true
+    }
+  }
+}
+</script>

src/components/AboutScreen.vue

@@ -1,6 +1,12 @@
 <template>
   <div class="about">
-    <h1>Über SISSy</h1>
+    <h1>SISSy v0.5.1</h1>
+    <h2>Sedan Informations- und Stundenplansystem</h2>
+    <img src="@/assets/sissy.png" width="350" />
+    <span>2021 by Daniel Spittank</span><br/>
+    <span>Lizensiert unter der AGPL 3.0 oder später</span>
+    <br/>
+    <span>Logo by Anabel Fabis, CC-BY-NC-SA</span>
   </div>
 </template>
 

src/views/InfodisplayLehrer.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="ids">
+    <AboutDialog ref="ad" />
     <v-app-bar
       app
       color="indigo"
@@ -9,9 +10,10 @@
         alt="Logo"
         class="shrink mr-2"
         contain
-        src="@/assets/logo.svg"
+        src="@/assets/sissy.png"
         transition="scale-transition"
         width="40"
+        @click.stop="$refs.ad.showAbout()"
       />
 
       <v-spacer></v-spacer>
@@ -77,6 +79,7 @@
 <script>
 import Newsreader from '@/components/Newsreader'
 import Vertretungsplan from '@/components/Vertretungsplan'
+import AboutDialog from '@/components/AboutDialog'
 
 export default {
   name: 'InfodisplayLehrer',
@@ -91,7 +94,8 @@ export default {
 
   components: {
     Newsreader,
-    Vertretungsplan
+    Vertretungsplan,
+    AboutDialog
   },
 
   created() {