WorkRoot/Astro-Component
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated New color Schene

Browse Source
This commit is contained in:
Clintchiz
2025-08-19 15:10:33 +05:30
parent 6b8672e1eb
commit 5fbfc2e54b
2 changed files with 18 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/global.css
+1 -1
View File
@@ -33,7 +33,6 @@
--color-danger-foreground: hsl(var(--danger-foreground)); --color-danger-foreground: hsl(var(--danger-foreground));
--color-neutral: hsl(var(--neutral)); --color-neutral: hsl(var(--neutral));
--color-neutral-foreground: hsl(var(--neutral-foreground)); --color-neutral-foreground: hsl(var(--neutral-foreground));
--color-background: hsl(var(--background));
--color-foreground: hsl(var(--foreground)); --color-foreground: hsl(var(--foreground));
--color-card: hsl(var(--card)); --color-card: hsl(var(--card));
--color-card-foreground: hsl(var(--card-foreground)); --color-card-foreground: hsl(var(--card-foreground));
@@ -43,6 +42,7 @@
--color-muted-foreground: hsl(var(--muted-foreground)); --color-muted-foreground: hsl(var(--muted-foreground));
--color-border: hsl(var(--border)); --color-border: hsl(var(--border));
--color-input: hsl(var(--input)); --color-input: hsl(var(--input));
--color-background: var(--background);
--color-background-0: var(--background-default); --color-background-0: var(--background-default);
--color-background-50: var(--background-50); --color-background-50: var(--background-50);
--color-background-100: var(--background-100); --color-background-100: var(--background-100);
src/styles/style.css
+3 -4
View File
@@ -434,12 +434,10 @@
} }
/* Light: base from primary, then darken toward black */ /* Light: base from primary, then darken toward black */
:root { [data-color]:not(.dark [data-color]) {
--bg-tint: 4%; --bg-tint: 4%;
/* make the actual background derived from primary */
--background-default: color-mix(in hsl, hsl(var(--primary)) var(--bg-tint), white); --background-default: color-mix(in hsl, hsl(var(--primary)) var(--bg-tint), white);
--background: var(--background-default); --background: var(--background-default);
--background-50: color-mix(in hsl, var(--background-default) 99%, black 1%); --background-50: color-mix(in hsl, var(--background-default) 99%, black 1%);
--background-100: color-mix(in hsl, var(--background-default) 97%, black 3%); --background-100: color-mix(in hsl, var(--background-default) 97%, black 3%);
--background-200: color-mix(in hsl, var(--background-default) 94%, black 6%); --background-200: color-mix(in hsl, var(--background-default) 94%, black 6%);
@@ -453,7 +451,8 @@
} }
/* Dark: base from primary as well (tint toward black), then lighten toward white */ /* Dark: base from primary as well (tint toward black), then lighten toward white */
:root.dark { .dark [data-color],
:root.dark [data-color] {
--background-default: color-mix(in hsl, hsl(var(--primary)) var(--bg-tint), black); --background-default: color-mix(in hsl, hsl(var(--primary)) var(--bg-tint), black);
--background: var(--background-default); --background: var(--background-default);