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

fix: color variable (#2059)

Browse Source
This commit is contained in:
Flrande
2023-04-21 12:41:43 +08:00
committed by GitHub
parent a5a6203a95
commit 01115f8957
5 changed files with 67 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,9 +1,19 @@
import type { AffineCssVariables } from '@affine/component';
import { globalStyle } from '@vanilla-extract/css';
import kebabCase from 'kebab-case';
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)',
@@ -14,7 +24,7 @@ globalStyle('body', {
globalStyle('html', {
vars: {
...Object.entries(lightTheme).reduce((variables, [key, value]) => {
variables[`--affine-${kebabCase(key)}` as keyof AffineCssVariables] =
variables[`--affine-${camelToKebab(key)}` as keyof AffineCssVariables] =
value;
return variables;
}, {} as AffineCssVariables),
@@ -24,7 +34,7 @@ globalStyle('html', {
globalStyle('html[data-theme="dark"]', {
vars: {
...Object.entries(darkTheme).reduce((variables, [key, value]) => {
variables[`--affine-${kebabCase(key)}` as keyof AffineCssVariables] =
variables[`--affine-${camelToKebab(key)}` as keyof AffineCssVariables] =
value;
return variables;
}, {} as AffineCssVariables),