diff options
| author | syuilo <syuilotan@yahoo.co.jp> | 2018-09-29 00:01:11 +0900 |
|---|---|---|
| committer | syuilo <syuilotan@yahoo.co.jp> | 2018-09-29 00:01:11 +0900 |
| commit | 6a82e94c5489d4879cbbf86091cd15c7d144f284 (patch) | |
| tree | 148f1b4bba454a71075d4b7b21d983b58215e8af /src/client/app/common/scripts | |
| parent | wip (diff) | |
| download | misskey-6a82e94c5489d4879cbbf86091cd15c7d144f284.tar.gz misskey-6a82e94c5489d4879cbbf86091cd15c7d144f284.tar.bz2 misskey-6a82e94c5489d4879cbbf86091cd15c7d144f284.zip | |
wip
Diffstat (limited to 'src/client/app/common/scripts')
| -rw-r--r-- | src/client/app/common/scripts/theme.ts | 89 |
1 files changed, 0 insertions, 89 deletions
diff --git a/src/client/app/common/scripts/theme.ts b/src/client/app/common/scripts/theme.ts deleted file mode 100644 index 7a1c6abb76..0000000000 --- a/src/client/app/common/scripts/theme.ts +++ /dev/null @@ -1,89 +0,0 @@ -import * as tinycolor from 'tinycolor2'; -const lightTheme = require('../../../theme/light'); -const darkTheme = require('../../../theme/dark'); - -type Theme = { - meta: { - id: string; - name: string; - inherit: string; - vars: any; - }; -} & { - [key: string]: string; -}; - -export default function(theme: Theme) { - if (theme.meta.inherit) { - const inherit = [lightTheme, darkTheme].find(x => x.meta.id == theme.meta.inherit); - theme = Object.assign({}, inherit, theme); - } - - const props = compile(theme); - - Object.entries(props).forEach(([k, v]) => { - if (k == 'meta') return; - document.documentElement.style.setProperty(`--${k}`, v.toString()); - }); - - localStorage.setItem('theme', JSON.stringify(props)); -} - -function compile(theme: Theme): { [key: string]: string } { - function getColor(code: string): tinycolor.Instance { - // ref - if (code[0] == '@') { - return getColor(theme[code.substr(1)]); - } - if (code[0] == '$') { - return getColor(theme.meta.vars[code.substr(1)]); - } - - // func - if (code[0] == ':') { - const parts = code.split('<'); - const func = parts.shift().substr(1); - const arg = parseFloat(parts.shift()); - const color = getColor(parts.join('<')); - - switch (func) { - case 'darken': return color.darken(arg); - case 'lighten': return color.lighten(arg); - case 'alpha': return color.setAlpha(arg); - } - } - - return tinycolor(code); - } - - const props = {}; - - Object.entries(theme).forEach(([k, v]) => { - if (k == 'meta') return; - const c = getColor(v); - props[k] = genValue(c); - }); - - const primary = getColor(props['primary']); - - for (let i = 1; i < 10; i++) { - const color = primary.clone().setAlpha(i / 10); - props['primaryAlpha0' + i] = genValue(color); - } - - for (let i = 1; i < 100; i++) { - const color = primary.clone().lighten(i); - props['primaryLighten' + i] = genValue(color); - } - - for (let i = 1; i < 100; i++) { - const color = primary.clone().darken(i); - props['primaryDarken' + i] = genValue(color); - } - - return props; -} - -function genValue(c: tinycolor.Instance): string { - return c.toRgbString(); -} |