From aa0564406a95824cc45c815571292716b65806a1 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sat, 31 Mar 2018 21:14:36 +0300
Subject: getting rid of baseXX, some small fixes. Seems to be usable.

---
 src/components/style_switcher/style_switcher.js  |  8 ++++----
 src/components/style_switcher/style_switcher.vue | 14 +++++++++-----
 2 files changed, 13 insertions(+), 9 deletions(-)

(limited to 'src/components/style_switcher')

diff --git a/src/components/style_switcher/style_switcher.js b/src/components/style_switcher/style_switcher.js
index a762f914..6e414338 100644
--- a/src/components/style_switcher/style_switcher.js
+++ b/src/components/style_switcher/style_switcher.js
@@ -21,10 +21,10 @@ export default {
       })
   },
   mounted () {
-    this.bgColorLocal = rgbstr2hex(this.$store.state.config.colors['base00'])
-    this.fgColorLocal = rgbstr2hex(this.$store.state.config.colors['base02'])
-    this.textColorLocal = rgbstr2hex(this.$store.state.config.colors['base05'])
-    this.linkColorLocal = rgbstr2hex(this.$store.state.config.colors['base08'])
+    this.bgColorLocal = rgbstr2hex(this.$store.state.config.colors.bg)
+    this.fgColorLocal = rgbstr2hex(this.$store.state.config.colors.lightBg)
+    this.textColorLocal = rgbstr2hex(this.$store.state.config.colors.fg)
+    this.linkColorLocal = rgbstr2hex(this.$store.state.config.colors.link)
   },
   methods: {
     setCustomTheme () {
diff --git a/src/components/style_switcher/style_switcher.vue b/src/components/style_switcher/style_switcher.vue
index 31bf546d..6c0cc6e7 100644
--- a/src/components/style_switcher/style_switcher.vue
+++ b/src/components/style_switcher/style_switcher.vue
@@ -7,22 +7,22 @@
     <p>{{$t('settings.theme_help')}}</p>
     <div class="color-container">
       <div class="color-item">
-        <label for="bgcolor" class="base04 theme-color-lb">{{$t('settings.background')}}</label>
+        <label for="bgcolor" class="theme-color-lb">{{$t('settings.background')}}</label>
         <input id="bgcolor" class="theme-color-cl" type="color" v-model="bgColorLocal">
         <input id="bgcolor-t" class="theme-color-in" type="text" v-model="bgColorLocal">
       </div>
       <div class="color-item">
-        <label for="fgcolor" class="base04 theme-color-lb">{{$t('settings.foreground')}}</label>
+        <label for="fgcolor" class="theme-color-lb">{{$t('settings.foreground')}}</label>
         <input id="fgcolor" class="theme-color-cl" type="color" v-model="fgColorLocal">
         <input id="fgcolor-t" class="theme-color-in" type="text" v-model="fgColorLocal">
       </div>
       <div class="color-item">
-        <label for="textcolor" class="base04 theme-color-lb">{{$t('settings.text')}}</label>
+        <label for="textcolor" class="theme-color-lb">{{$t('settings.text')}}</label>
         <input id="textcolor" class="theme-color-cl" type="color" v-model="textColorLocal">
         <input id="textcolor-t" class="theme-color-in" type="text" v-model="textColorLocal">
       </div>
       <div class="color-item">
-        <label for="linkcolor" class="base04 theme-color-lb">{{$t('settings.links')}}</label>
+        <label for="linkcolor" class="theme-color-lb">{{$t('settings.links')}}</label>
         <input id="linkcolor" class="theme-color-cl" type="color" v-model="linkColorLocal">
         <input id="linkcolor-t" class="theme-color-in" type="text" v-model="linkColorLocal">
       </div>
@@ -40,7 +40,7 @@
         </div>
       </div>
     </div>
-    <button class="btn base02-background base04" @click="setCustomTheme">{{$t('general.apply')}}</button>
+    <button class="btn" @click="setCustomTheme">{{$t('general.apply')}}</button>
   </div>
 </template>
 
@@ -63,6 +63,10 @@
     flex: 1 1 0;
     align-items: baseline;
     margin: 5px 6px 5px 0;
+
+    label {
+        color: var(--faint);
+    }
 }
 .theme-color-cl,
 .theme-color-in {
-- 
cgit v1.2.3-70-g09d2