From b9c5fcf085bed9c6100283133531b36bfbb06cf0 Mon Sep 17 00:00:00 2001
From: Bastien Wirtz <bastien.wirtz@gmail.com>
Date: Mon, 25 May 2020 15:07:03 -0700
Subject: Build system integration using vue-cli.

---
 src/components/SettingToggle.vue | 41 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 src/components/SettingToggle.vue

(limited to 'src/components/SettingToggle.vue')

diff --git a/src/components/SettingToggle.vue b/src/components/SettingToggle.vue
new file mode 100644
index 0000000..94655bc
--- /dev/null
+++ b/src/components/SettingToggle.vue
@@ -0,0 +1,41 @@
+<template>
+  <a v-on:click="toggleSetting()" class="navbar-item is-inline-block-mobile">
+    <span v-show="value"><i :class="['fas', icon]"></i></span>
+    <span v-show="!value"><i :class="['fas', iconAlt]"></i></span>
+    <slot></slot>
+  </a>
+</template>
+
+<script>
+export default {
+  name: "SettingToggle",
+  props: {
+    name: String,
+    icon: String,
+    iconAlt: String,
+  },
+  data: function () {
+    return {
+      value: true,
+    };
+  },
+  created: function () {
+    if (!this.iconAlt) {
+      this.iconAlt = this.icon;
+    }
+
+    if (this.name in localStorage) {
+      this.value = JSON.parse(localStorage[this.name]);
+    }
+
+    this.$emit("updated", this.value);
+  },
+  methods: {
+    toggleSetting: function () {
+      this.value = !this.value;
+      localStorage[this.name] = this.value;
+      this.$emit("updated", this.value);
+    },
+  },
+};
+</script>
-- 
cgit v1.2.3


From 9814a037a5158d31c77fecc8bfb3b61b45d015b3 Mon Sep 17 00:00:00 2001
From: Bastien Wirtz <bastien.wirtz@gmail.com>
Date: Fri, 29 May 2020 18:21:32 -0700
Subject: Pure CSS font awesome icon

---
 src/components/SettingToggle.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

(limited to 'src/components/SettingToggle.vue')

diff --git a/src/components/SettingToggle.vue b/src/components/SettingToggle.vue
index 94655bc..864a497 100644
--- a/src/components/SettingToggle.vue
+++ b/src/components/SettingToggle.vue
@@ -1,7 +1,6 @@
 <template>
   <a v-on:click="toggleSetting()" class="navbar-item is-inline-block-mobile">
-    <span v-show="value"><i :class="['fas', icon]"></i></span>
-    <span v-show="!value"><i :class="['fas', iconAlt]"></i></span>
+    <span><i :class="['fas', value ? icon : iconAlt]"></i></span>
     <slot></slot>
   </a>
 </template>
-- 
cgit v1.2.3