Footer with theme switch, data notice, upgrade cta and a github link

This commit is contained in:
Marek Fraczyk
2021-02-16 17:43:31 +02:00
parent 79e9705b01
commit e281835eee
4 changed files with 86 additions and 7 deletions

View File

@ -16,6 +16,9 @@ export default {
created() {
this.pauseAnimationsUntilLoaded();
},
mounted() {
this.initColorScheme();
},
methods: {
jsLoaded() {
document.body.classList.remove('js-loading');
@ -24,6 +27,24 @@ export default {
document.body.classList.add('js-loading');
window.addEventListener('load', this.jsLoaded, false);
},
initColorScheme() {
// local storage is used to override OS theme settings
if (localStorage.getItem('theme')) {
if (localStorage.getItem('theme') === 'dark') {
this.$store.commit('themes/theme', 'dark');
return document.documentElement.setAttribute('data-theme', 'dark');
}
} else if (!window.matchMedia) {
// matchMedia method not supported
return false;
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
// OS theme setting detected as dark
this.$store.commit('themes/theme', 'dark');
console.log('hello there');
return document.documentElement.setAttribute('data-theme', 'dark');
}
document.documentElement.setAttribute('data-theme', this.theme || 'light');
},
},
};
</script>