Northern_Lights/cherry-studio
1
0
Fork 0
mirror of https://github.com/CherryHQ/cherry-studio.git synced 2026-01-08 14:29:15 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

feat(theme): add hero UI primary color variants

Browse Source 
Add multiple shades of the primary color for hero UI components to support better visual hierarchy and theming flexibility
This commit is contained in:
icarus 2025-09-28 12:18:58 +08:00
parent 0ef2725dfd
commit e4ad5084cf
1 changed files with 11 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/renderer/src/hooks/useUserTheme.ts
View File

@ -13,6 +13,17 @@ export default function useUserTheme() {
document.body.style.setProperty('--color-primary', colorPrimary.toString()) document.body.style.setProperty('--color-primary', colorPrimary.toString())
// overwrite hero UI primary color. // overwrite hero UI primary color.
document.body.style.setProperty('--primary', colorPrimary.toString()) document.body.style.setProperty('--primary', colorPrimary.toString())
document.body.style.setProperty('--heroui-primary', colorPrimary.toString())
document.body.style.setProperty('--heroui-primary-900', colorPrimary.lighten(0.5).toString())
document.body.style.setProperty('--heroui-primary-800', colorPrimary.lighten(0.4).toString())
document.body.style.setProperty('--heroui-primary-700', colorPrimary.lighten(0.3).toString())
document.body.style.setProperty('--heroui-primary-600', colorPrimary.lighten(0.2).toString())
document.body.style.setProperty('--heroui-primary-500', colorPrimary.lighten(0.1).toString())
document.body.style.setProperty('--heroui-primary-400', colorPrimary.toString())
document.body.style.setProperty('--heroui-primary-300', colorPrimary.darken(0.1).toString())
document.body.style.setProperty('--heroui-primary-200', colorPrimary.darken(0.2).toString())
document.body.style.setProperty('--heroui-primary-100', colorPrimary.darken(0.3).toString())
document.body.style.setProperty('--heroui-primary-50', colorPrimary.darken(0.4).toString())
document.body.style.setProperty('--color-primary-soft', colorPrimary.alpha(0.6).toString()) document.body.style.setProperty('--color-primary-soft', colorPrimary.alpha(0.6).toString())
document.body.style.setProperty('--color-primary-mute', colorPrimary.alpha(0.3).toString()) document.body.style.setProperty('--color-primary-mute', colorPrimary.alpha(0.3).toString())