feat(app-background): Use white background to cover alpha levels

podlove · Jul 30, 2017 · 162a980 · 162a980
1 parent 336cee5
commit 162a980
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 3 deletions.
diff --git a/src/components/App.vue b/src/components/App.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="podlove" :class="{[display]: display, [runtime.platform]: runtime.platform}">
+  <div class="podlove" :class="{[display]: display, [runtime.platform]: runtime.platform}" :style="appStyle">
     <HeaderComponent></HeaderComponent>
     <PlayerComponent></PlayerComponent>
     <TabsComponent></TabsComponent>
@@ -19,7 +19,8 @@
 
       return {
         display: this.$select('display'),
-        runtime: this.$select('runtime')
+        runtime: this.$select('runtime'),
+        theme: this.$select('theme')
       }
     },
     watch: {
@@ -28,6 +29,13 @@
         this.$i18n.locale = runtime.language
       }
     },
+    computed: {
+      appStyle () {
+        return {
+          background: this.theme.background
+        }
+      }
+    },
     components: {
       HeaderComponent,
       PlayerComponent,

diff --git a/src/store/reducers/theme.js b/src/store/reducers/theme.js
@@ -15,6 +15,7 @@ const themeColors = (colors = {}) => {
   const fallbackColor = (first, second) => first || second
 
   return {
+    background: light,
     player: {
       background: main,
       poster: negative ? light : dark,

diff --git a/src/webpack.config.js b/src/webpack.config.js
@@ -69,7 +69,7 @@ const config = {
     noInfo: true,
     overlay: true,
     inline: true,
-    hotOnly: true,
+    hot: true,
     contentBase: path.resolve(__dirname, '..', 'dist')
   },
   performance: {