girineko/YesPlayMusic
1
0
Fork 0
mirror of https://github.com/GiriNeko/YesPlayMusic.git synced 2025-12-18 06:07:48 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: dynamic PWA theme color

Browse source
This commit is contained in:
qier222 2020-10-25 21:55:20 +08:00
parent b655c59761
commit c448230c14
3 changed files with 19 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/store/index.js
View file

@ -5,6 +5,7 @@ import mutations from "./mutations";
import actions from "./actions";
import initState from "./initState";
import { Howl, Howler } from "howler";
import { changeAppearance } from "@/utils/common";
if (localStorage.getItem("appVersion") === null) {
localStorage.setItem("player", JSON.stringify(initState.player));
@ -45,23 +46,12 @@ if ([undefined, null].includes(store.state.settings.lang)) {
localStorage.setItem("settings", JSON.stringify(store.state.settings));
}
if (
store.state.settings.appearance !== "auto" &&
store.state.settings.appearance !== undefined
) {
document.body.setAttribute("data-theme", store.state.settings.appearance);
} else {
document.body.setAttribute(
"data-theme",
window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"
);
}
changeAppearance(store.state.settings.appearance);
window
.matchMedia("(prefers-color-scheme: dark)")
.addEventListener("change", (e) => {
.addEventListener("change", () => {
if (store.state.settings.appearance === "auto") {
store.commit("updateTmpAppearance", e.matches ? "dark" : "light");
document.body.setAttribute("data-theme", e.matches ? "dark" : "light");
changeAppearance(store.state.settings.appearance);
}
});