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.
This commit is contained in:
@@ -22,7 +22,7 @@
|
|||||||
<nuxt id="main" />
|
<nuxt id="main" />
|
||||||
<footer>
|
<footer>
|
||||||
<div>
|
<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>
|
</div>
|
||||||
<button id="installPWA" @click.prevent="showInstallPrompt()">
|
<button id="installPWA" @click.prevent="showInstallPrompt()">
|
||||||
Install PWA
|
Install PWA
|
||||||
@@ -120,7 +120,10 @@
|
|||||||
// Once the PWA code is initialized, this holds a method
|
// Once the PWA code is initialized, this holds a method
|
||||||
// that can be called to show the user the installation
|
// that can be called to show the user the installation
|
||||||
// prompt.
|
// 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() {
|
beforeMount() {
|
||||||
|
|||||||
@@ -102,6 +102,13 @@
|
|||||||
applyTheme(name) {
|
applyTheme(name) {
|
||||||
this.applySetting('THEME_CLASS', name);
|
this.applySetting('THEME_CLASS', name);
|
||||||
document.documentElement.className = 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) {
|
setActiveColor(color, vibrant) {
|
||||||
// By default, the color is vibrant.
|
// By default, the color is vibrant.
|
||||||
|
|||||||
Reference in New Issue
Block a user