Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-12 20:38:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: init @toeverything/theme (#2136)

Browse Source
This commit is contained in:
Himself65
2023-04-25 18:44:17 -05:00
committed by GitHub
parent 80f4578f76
commit db52c63d25
34 changed files with 147 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
packages/component/src/theme/theme.css.ts
View File

@@ -1,19 +1,6 @@
import type { AffineCssVariables } from '@affine/component';
import { darkCssVariables, lightCssVariables } from '@toeverything/theme';
import { globalStyle } from '@vanilla-extract/css';
import { darkTheme, lightTheme } from '../styles/theme';
const camelToKebab = (s: string) => {
if (typeof s !== 'string') return '';
return s
.replace(/-/g, '_')
.replace(/([a-z0-9])([A-Z])/g, '$1-$2')
.replace(/([A-Z])([A-Z])(?=[a-z])/g, '$1-$2')
.toLowerCase()
.replace(/(\D+)(\d+)$/g, '$1-$2')
.replace(/\s|_/g, '-');
};
globalStyle('body', {
color: 'var(--affine-text-primary-color)',
fontFamily: 'var(--affine-font-family)',
@@ -22,21 +9,9 @@ globalStyle('body', {
});
globalStyle('html', {
vars: {
...Object.entries(lightTheme).reduce((variables, [key, value]) => {
variables[`--affine-${camelToKebab(key)}` as keyof AffineCssVariables] =
value;
return variables;
}, {} as AffineCssVariables),
},
vars: lightCssVariables,
});
globalStyle('html[data-theme="dark"]', {
vars: {
...Object.entries(darkTheme).reduce((variables, [key, value]) => {
variables[`--affine-${camelToKebab(key)}` as keyof AffineCssVariables] =
value;
return variables;
}, {} as AffineCssVariables),
},
vars: darkCssVariables,
});