mirror of
https://github.com/TeamPiped/Piped.git
synced 2024-08-14 23:57:27 +00:00
Move theme handling away from mixin.
This commit is contained in:
parent
9621c346c0
commit
2fb5aa2bec
2 changed files with 19 additions and 14 deletions
19
src/App.vue
19
src/App.vue
|
@ -15,12 +15,31 @@
|
|||
<script>
|
||||
import NavBar from "./components/NavBar.vue";
|
||||
import FooterComponent from "./components/FooterComponent.vue";
|
||||
|
||||
const darkModePreference = window.matchMedia("(prefers-color-scheme: dark)");
|
||||
|
||||
export default {
|
||||
components: {
|
||||
NavBar,
|
||||
FooterComponent,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
theme: "dark",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
setTheme() {
|
||||
let themePref = this.getPreferenceString("theme", "dark");
|
||||
if (themePref == "auto") this.theme = darkModePreference.matches ? "dark" : "light";
|
||||
else this.theme = themePref;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.setTheme();
|
||||
darkModePreference.addEventListener("change", () => {
|
||||
this.setTheme();
|
||||
});
|
||||
if (this.getPreferenceBoolean("watchHistory", false))
|
||||
if ("indexedDB" in window) {
|
||||
const request = indexedDB.open("piped-db", 1);
|
||||
|
|
14
src/main.js
14
src/main.js
|
@ -64,7 +64,6 @@ import "@unocss/reset/tailwind.css";
|
|||
import "uno.css";
|
||||
|
||||
const timeAgo = new TimeAgo("en-US");
|
||||
const darkModePreference = window.matchMedia("(prefers-color-scheme: dark)");
|
||||
|
||||
import("./registerServiceWorker");
|
||||
|
||||
|
@ -239,14 +238,6 @@ const mixin = {
|
|||
},
|
||||
},
|
||||
computed: {
|
||||
theme() {
|
||||
this.refreshTheme; // forces Vue to recompute the value when the var gets changed
|
||||
let themePref = this.getPreferenceString("theme", "dark");
|
||||
if (themePref == "auto") {
|
||||
return darkModePreference.matches ? "dark" : "light";
|
||||
}
|
||||
return themePref;
|
||||
},
|
||||
authenticated(_this) {
|
||||
return _this.getAuthToken() !== undefined;
|
||||
},
|
||||
|
@ -275,13 +266,8 @@ const mixin = {
|
|||
return {
|
||||
TimeAgo: TimeAgo,
|
||||
TimeAgoConfig: timeAgo,
|
||||
refreshTheme: 0,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// Forces the app to recompute the theme class
|
||||
darkModePreference.addEventListener("change", () => this.refreshTheme++);
|
||||
},
|
||||
};
|
||||
|
||||
const i18n = createI18n({
|
||||
|
|
Loading…
Reference in a new issue