Merge pull request #8 from fbartels/subdir

[github/bastienwirtz/homer.git] / app.js

diff --git a/app.js b/app.js
index dc8b6cc65ff9fe055f74cfefccc2e4b4fbcd7525..40830da1a457f3053b4ff230b54e0814c0add6a2 100644 (file)
--- a/app.js
+++ b/app.js
@@ -4,11 +4,19 @@ const app = new Vue({
         config: null,
         offline: false,
         filter: '',
-        vlayout: true
+        vlayout: true,
+        isDark: null
     },
     created: function () {
         let that = this;
 
+        this.isDark = 'overrideDark' in localStorage ?
+            JSON.parse(localStorage.overrideDark) : matchMedia("(prefers-color-scheme: dark)").matches;
+
+        if ('vlayout' in localStorage) {
+            this.vlayout = JSON.parse(localStorage.vlayout)
+        }
+
         this.checkOffline();
         that.getConfig().then(function (config) {
             that.config = config;
@@ -44,6 +52,14 @@ const app = new Vue({
                 });
             });
         },
+        toggleTheme: function() {
+            this.isDark = !this.isDark;
+            localStorage.overrideDark = this.isDark; 
+        }, 
+        toggleLayout: function() {
+            this.vlayout = !this.vlayout;
+            localStorage.vlayout = this.vlayout;
+        },
     }
 });
 
@@ -69,7 +85,9 @@ Vue.component('service', {
                         <p class="subtitle is-6">{{ item.subtitle }}</p>
                     </div>
                 </div>
-                <strong class="tag" v-if="item.tag">#{{ item.tag }}</strong>
+                <div class="tag" :class="item.tagstyle" v-if="item.tag">
+                    <strong class="tag-text">#{{ item.tag }}</strong>
+                </div>
             </div>
         </a>
     </div></div>`
@@ -77,6 +95,6 @@ Vue.component('service', {
 
 if ('serviceWorker' in navigator) {
     window.addEventListener('load', function () {
-        navigator.serviceWorker.register('/worker.js');
+        navigator.serviceWorker.register('worker.js');
     });
 }