github_mirrors/vue-vben-admin
1
0
Fork 0
mirror of https://github.com/vbenjs/vue-vben-admin.git synced 2025-08-26 16:46:19 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: use @ant-design/fast-color instead (#4070)

Browse Source 
* refactor: Use @ant-design/fast-color instead

* fix: test failed

* chore: remove isValidColor

All FastColor objects are valid. So isValid is always true.
FastColor("not-a-color") -> `#000000`

* refactor: rename directory `colorful` to `color`

* fix: ci fail
This commit is contained in:
Li Kui
2024-08-07 21:28:25 +08:00
committed by GitHub
parent 861f39b519
commit 1d38fb647e
13 changed files with 871 additions and 1080 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
packages/effects/hooks/src/use-design-tokens.ts
View File

@@ -1,7 +1,7 @@
import { reactive, watch } from 'vue';
import { preferences } from '@vben/preferences';
import { hlsStringToRGBString, updateCSSVariables } from '@vben/utils';
import { convertToRgb, updateCSSVariables } from '@vben/utils';
/**
* 用于适配各个框架的设计系统
@@ -102,7 +102,7 @@ export function useNaiveDesignTokens() {
const getCssVariableValue = (variable: string, isColor: boolean = true) => {
const value = rootStyles.getPropertyValue(variable);
return isColor ? hlsStringToRGBString(value) : value;
return isColor ? convertToRgb(`hsl(${value})`) : value;
};
watch(
@@ -145,8 +145,6 @@ export function useNaiveDesignTokens() {
commonTokens.invertedColor = getCssVariableValue('--background-deep');
commonTokens.borderRadius = getCssVariableValue('--radius', false);
// antDesignTokens.colorBgMask = getCssVariableValue('--overlay');
},
{ immediate: true },
);
@@ -160,7 +158,7 @@ export function useElementPlusDesignTokens() {
const getCssVariableValue = (variable: string, isColor: boolean = true) => {
const value = rootStyles.getPropertyValue(variable);
return isColor ? `hsl(${value})` : value;
return isColor ? convertToRgb(`hsl(${value})`) : value;
};
watch(
() => preferences.theme,

12
packages/effects/layouts/src/widgets/preferences/blocks/theme/builtin.vue
View File

@@ -9,7 +9,7 @@ import {
BUILT_IN_THEME_PRESETS,
type BuiltinThemePreset,
} from '@vben/preferences';
import { convertToHsl, TinyColor } from '@vben/utils';
import { Color, convertToHsl } from '@vben/utils';
defineOptions({
name: 'PreferenceBuiltinTheme',
@@ -22,17 +22,11 @@ const modelValue = defineModel<BuiltinThemeType>({ default: 'default' });
const themeColorPrimary = defineModel<string>('themeColorPrimary');
const inputValue = computed(() => {
return new TinyColor(themeColorPrimary.value).toHexString();
return new Color(themeColorPrimary.value || '').toHexString();
});
const builtinThemePresets = computed(() => {
return [
// {
// color: 'hsl(231 98% 65%)',
// type: 'default',
// },
...BUILT_IN_THEME_PRESETS,
];
return [...BUILT_IN_THEME_PRESETS];
});
function typeView(name: BuiltinThemeType) {