From 5ec993f9f4c9910dc789ca2e45874613660493f9 Mon Sep 17 00:00:00 2001
From: pmankar <pratik.m8@gmail.com>
Date: Thu, 29 Aug 2019 01:51:47 +0200
Subject: [PATCH] GitHub Logo on theme background change

the contrast is improved while the theme is switched.
Handled the case if there is no storage value for the selected class.
---
 layouts/default.vue | 7 +++++--
 pages/settings.vue  | 7 +++++++
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/layouts/default.vue b/layouts/default.vue
index aa5f2f463..3d8273a69 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -22,7 +22,7 @@
     <nuxt id="main" />
     <footer>
       <div>
-        <a href="https://github.com/liyasthomas/postwoman" target="_blank"><img src="~static/icons/github.svg" alt="" style="margin-right: 16px">GitHub</a>
+        <a href="https://github.com/liyasthomas/postwoman" target="_blank"><img id="imgGitHub" src="~static/icons/github.svg" alt="" :style="logoStyle()">GitHub</a>
       </div>
       <button id="installPWA" @click.prevent="showInstallPrompt()">
         Install PWA
@@ -120,7 +120,10 @@
         // Once the PWA code is initialized, this holds a method
         // that can be called to show the user the installation
         // prompt.
-        showInstallPrompt: null
+        showInstallPrompt: null,
+        logoStyle() {
+          return "margin-right: 16px;" + (((this.$store.state.postwoman.settings.THEME_CLASS || '').includes("light")) ? " filter: invert(100%); -webkit-filter: invert(100%);" : '')
+         }
       }
     },
     beforeMount() {
diff --git a/pages/settings.vue b/pages/settings.vue
index fa6b17d7a..8da8a0bd6 100644
--- a/pages/settings.vue
+++ b/pages/settings.vue
@@ -102,6 +102,13 @@
       applyTheme(name) {
         this.applySetting('THEME_CLASS', name);
         document.documentElement.className = name;
+		let imgGitHub = document.getElementById("imgGitHub");
+		imgGitHub.style['filter'] = "";
+		imgGitHub.style['webkit-filter'] = "invert(100%)";
+		if (name.includes("light")){
+			imgGitHub.style['filter'] = "invert(100%)";
+			imgGitHub.style['webkit-filter'] = "invert(100%)";
+		}
       },
       setActiveColor(color, vibrant) {
         // By default, the color is vibrant.