jiangyc/ruoyi-plus-soybean
1
0
Fork 0
mirror of https://github.com/m-xlsea/ruoyi-plus-soybean.git synced 2025-09-24 07:49:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(projects): custom unocss colors support opacity

Browse Source
This commit is contained in:
Soybean
2023-03-13 20:36:35 +08:00
parent f73e3f648d
commit 488e6e3204
5 changed files with 133 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/store/subscribe/theme.ts
View File

@ -3,7 +3,7 @@ import { useOsTheme } from 'naive-ui';
import type { GlobalThemeOverrides } from 'naive-ui';
import { useElementSize } from '@vueuse/core';
import { kebabCase } from 'lodash-es';
import { localStg } from '@/utils';
import { localStg, getColorPalettes, getRgbOfColor } from '@/utils';
import { useThemeStore } from '../modules';
/** 订阅theme store */
@ -98,7 +98,21 @@ function addThemeCssVarsToHtml(themeVars: ThemeVars) {
const keys = Object.keys(themeVars) as ThemeVarsKeys[];
const style: string[] = [];
keys.forEach(key => {
style.push(`--${kebabCase(key)}: ${themeVars[key]}`);
const color = themeVars[key];
if (color) {
const { r, g, b } = getRgbOfColor(color);
style.push(`--${kebabCase(key)}: ${r},${g},${b}`);
if (key === 'primaryColor') {
const colorPalettes = getColorPalettes(color);
colorPalettes.forEach((palette, index) => {
const { r: pR, g: pG, b: pB } = getRgbOfColor(palette);
style.push(`--${kebabCase(key)}${index + 1}: ${pR},${pG},${pB}`);
});
}
}
});
const styleStr = style.join(';');
document.documentElement.style.cssText += styleStr;