diff --git a/src/client/app/app.vue b/src/client/app/app.vue index d8cd4f0796..bb8377c237 100644 --- a/src/client/app/app.vue +++ b/src/client/app/app.vue @@ -6,7 +6,7 @@ import Vue from 'vue'; import { url, lang } from './config'; import applyTheme from './common/scripts/theme'; -import darkTheme from '../theme/dark.json'; +const darkTheme = require('../theme/dark'); export default Vue.extend({ computed: { diff --git a/src/client/app/common/scripts/theme.ts b/src/client/app/common/scripts/theme.ts index bc70223519..7fbac7f574 100644 --- a/src/client/app/common/scripts/theme.ts +++ b/src/client/app/common/scripts/theme.ts @@ -5,6 +5,8 @@ export default function(theme: { [key: string]: string }) { if (k == 'meta') return; document.documentElement.style.setProperty(`--${k}`, v.toString()); }); + + localStorage.setItem('theme', JSON.stringify(props)); } function compile(theme: { [key: string]: string }): { [key: string]: string } { @@ -17,24 +19,24 @@ function compile(theme: { [key: string]: string }): { [key: string]: string } { let m; //#region #RGB - m = code.match(/^#([0-9a-f]{3})$/i)[1]; + m = code.match(/^#([0-9a-f]{3})$/i); if (m) { return [ - parseInt(m.charAt(0), 16) * 0x11, - parseInt(m.charAt(1), 16) * 0x11, - parseInt(m.charAt(2), 16) * 0x11, + parseInt(m[1].charAt(0), 16) * 0x11, + parseInt(m[1].charAt(1), 16) * 0x11, + parseInt(m[1].charAt(2), 16) * 0x11, 255 ]; } //#endregion //#region #RRGGBB - m = code.match(/^#([0-9a-f]{6})$/i)[1]; + m = code.match(/^#([0-9a-f]{6})$/i); if (m) { return [ - parseInt(m.substr(0, 2), 16), - parseInt(m.substr(2, 2), 16), - parseInt(m.substr(4, 2), 16), + parseInt(m[1].substr(0, 2), 16), + parseInt(m[1].substr(2, 2), 16), + parseInt(m[1].substr(4, 2), 16), 255 ]; } diff --git a/src/client/app/init.ts b/src/client/app/init.ts index 7468484b35..8d430ad7ff 100644 --- a/src/client/app/init.ts +++ b/src/client/app/init.ts @@ -8,12 +8,18 @@ import VueRouter from 'vue-router'; import * as TreeView from 'vue-json-tree-view'; import VAnimateCss from 'v-animate-css'; import VModal from 'vue-js-modal'; -import VueHotkey from './common/hotkey'; +import VueHotkey from './common/hotkey'; import App from './app.vue'; import checkForUpdate from './common/scripts/check-for-update'; import MiOS, { API } from './mios'; import { version, codename, lang } from './config'; +import applyTheme from './common/scripts/theme'; +const defaultTheme = require('../theme/light.json'); + +if (localStorage.getItem('theme') == null) { + applyTheme(defaultTheme); +} Vue.use(Vuex); Vue.use(VueRouter);