summaryrefslogtreecommitdiffstats
path: root/webapp/src/components/StartPage.vue
diff options
context:
space:
mode:
Diffstat (limited to 'webapp/src/components/StartPage.vue')
-rw-r--r--webapp/src/components/StartPage.vue31
1 files changed, 28 insertions, 3 deletions
diff --git a/webapp/src/components/StartPage.vue b/webapp/src/components/StartPage.vue
index fa5da86..2b3dc12 100644
--- a/webapp/src/components/StartPage.vue
+++ b/webapp/src/components/StartPage.vue
@@ -8,9 +8,17 @@
</i18n>
<template>
- <v-app dark class="grey darken-4 non-selectable">
- <div class="start-page">
- <img class="logo non-draggable" src="@/assets/logo.svg" />
+ <v-app class="grey darken-4 non-selectable">
+
+ <div class="setting-buttons">
+ <v-btn class="ma-2" icon @click="$store.commit('saveSetting', { name: 'dark', value: !settings.dark })">
+ <v-icon>invert_colors</v-icon>
+ </v-btn>
+ </div>
+
+ <div dark class="start-page">
+ <img v-if="settings.dark" class="logo" src="@/assets/logo.svg"/>
+ <img v-else class="logo" src="@/assets/logo-light.svg"/>
<router-view></router-view>
</div>
<notifications-snackbars></notifications-snackbars>
@@ -18,9 +26,11 @@
</template>
<script>
+import { mapState } from 'vuex'
import NotificationsSnackbars from '@/components/NotificationsSnackbars'
import StartPageLogin from '@/components/StartPageLogin'
import StartPageSetup from '@/components/StartPageSetup'
+
export default {
name: 'StartPage',
routes () {
@@ -31,11 +41,26 @@ export default {
},
components: {
NotificationsSnackbars
+ },
+ computed: {
+ ...mapState(['settings', 'user']),
+ dark () { return this.settings.dark }
+ },
+ watch: {
+ dark (value) {
+ this.$vuetify.theme.dark = value
+ }
}
}
</script>
<style scoped>
+.setting-buttons {
+ position: absolute;
+ top: 0;
+ right: 0;
+}
+
.start-page {
height: 100%;
width: 100%;