Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 | 1x 4x 1x 4x 4x 4x 2x 2x 2x 2x 2x 2x 2x 1x 1x 4x 4x | // @ts-check
import Vue from "vue";
import { assign } from "lodash";
// @ts-ignore
import dark from "!file-loader?name=dark.css!sass-loader!../../scss/_dark.scss";
// @ts-ignore
import light from "!file-loader?name=light.css!sass-loader!../../scss/_light.scss";
const Themes = {
LIGHT: light,
DARK: dark
};
/**
* @param {boolean} isDarkMode
*/
const getThemeString = (isDarkMode) => (isDarkMode ?
Themes.DARK : Themes.LIGHT);
/**
* @param {string} theme
* @returns
*/
const setDocumentTheme = (theme) => {
const old = document.getElementById("theme");
const filename = theme?.substr(theme.lastIndexOf("/") + 1);
if (old?.getAttribute("href")?.endsWith(filename)) { return; }
const newTheme = document.createElement("link");
newTheme.setAttribute("href", theme);
newTheme.setAttribute("rel", "stylesheet");
newTheme.onload = () => {
document.getElementById("theme")?.remove();
newTheme.id = "theme";
};
document.head.append(newTheme);
};
/** @type {V.Module<BaseVue.UiState>} */
const m = {
namespaced: true,
state: () => ({
showKeyHints: false,
darkMode: false,
muteAlerts: false
}),
mutations: {
/**
* @param {BaseVue.UiState} state
* @param {string} name
*/
remove(state, name) {
Vue.delete(state, name);
},
update: assign
},
actions: {
/** @param {V.ActionContext<BaseVue.StoreState>} ctx */
toggleTheme(ctx) {
ctx.commit("update", { darkMode: !ctx.state.darkMode });
ctx.dispatch("applyTheme");
},
/** @param {V.ActionContext<BaseVue.StoreState>} ctx */
applyTheme(ctx) {
const themeStr = getThemeString(ctx.state.darkMode);
setDocumentTheme(themeStr);
}
}
};
export default m;
|