]> git.immae.eu Git - github/bastienwirtz/homer.git/blame - src/components/SettingToggle.vue
Merge pull request #310 from ArturBa/main
[github/bastienwirtz/homer.git] / src / components / SettingToggle.vue
CommitLineData
b9c5fcf0
BW
1<template>
2 <a v-on:click="toggleSetting()" class="navbar-item is-inline-block-mobile">
ed8b17e0 3 <span><i :class="['fas', 'fa-fw', value ? icon : secondaryIcon]"></i></span>
b9c5fcf0
BW
4 <slot></slot>
5 </a>
6</template>
7
8<script>
9export default {
10 name: "SettingToggle",
11 props: {
12 name: String,
13 icon: String,
14 iconAlt: String,
15 },
16 data: function () {
17 return {
ed8b17e0 18 secondaryIcon: null,
b9c5fcf0
BW
19 value: true,
20 };
21 },
22 created: function () {
ed8b17e0 23 this.secondaryIcon = this.iconAlt || this.icon;
b9c5fcf0
BW
24
25 if (this.name in localStorage) {
26 this.value = JSON.parse(localStorage[this.name]);
27 }
28
29 this.$emit("updated", this.value);
30 },
31 methods: {
32 toggleSetting: function () {
33 this.value = !this.value;
34 localStorage[this.name] = this.value;
35 this.$emit("updated", this.value);
36 },
37 },
38};
39</script>