natty
/
calckey
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Fix #4559 

Close #4564
This commit is contained in:
syuilo 2019-03-22 19:07:13 +09:00
parent 9049ecb1cf
commit 4e2b966b80
No known key found for this signature in database
GPG Key ID: BDC4C49D06AB9D69
1 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/client/app/theme.ts
View File

@ -42,41 +42,41 @@ export const builtinThemes = [
tweetDeckTheme, tweetDeckTheme,
]; ];
export function applyTheme(themes: Theme, persisted = true) { export function applyTheme(theme: Theme, persisted = true) {
document.documentElement.classList.add('changing-themes'); document.documentElement.classList.add('changing-theme');
setTimeout(() => { setTimeout(() => {
document.documentElement.classList.remove('changing-themes'); document.documentElement.classList.remove('changing-theme');
}, 1000); }, 1000);
// Deep copy // Deep copy
const _themes = JSON.parse(JSON.stringify(themes)); const _theme = JSON.parse(JSON.stringify(theme));
if (_themes.base) { if (_theme.base) {
const base = [lightTheme, darkTheme].find(x => x.id == _themes.base); const base = [lightTheme, darkTheme].find(x => x.id == _theme.base);
_themes.vars = Object.assign({}, base.vars, _themes.vars); _theme.vars = Object.assign({}, base.vars, _theme.vars);
_themes.props = Object.assign({}, base.props, _themes.props); _theme.props = Object.assign({}, base.props, _theme.props);
} }
const props = compile(_themes); const props = compile(_theme);
for (const [k, v] of Object.entries(props)) { for (const [k, v] of Object.entries(props)) {
document.documentElement.style.setProperty(`--${k}`, v.toString()); document.documentElement.style.setProperty(`--${k}`, v.toString());
} }
if (persisted) { if (persisted) {
localStorage.setItem('themes', JSON.stringify(props)); localStorage.setItem('theme', JSON.stringify(props));
} }
} }
function compile(themes: Theme): { [key: string]: string } { function compile(theme: Theme): { [key: string]: string } {
function getColor(code: string): tinycolor.Instance { function getColor(code: string): tinycolor.Instance {
// ref // ref
if (code[0] == '@') { if (code[0] == '@') {
return getColor(themes.props[code.substr(1)]); return getColor(theme.props[code.substr(1)]);
} }
if (code[0] == '$') { if (code[0] == '$') {
return getColor(themes.vars[code.substr(1)]); return getColor(theme.vars[code.substr(1)]);
} }
// func // func
@ -98,7 +98,7 @@ function compile(themes: Theme): { [key: string]: string } {
const props = {}; const props = {};
for (const [k, v] of Object.entries(themes.props)) { for (const [k, v] of Object.entries(theme.props)) {
props[k] = genValue(getColor(v)); props[k] = genValue(getColor(v));
} }