feat: enhance background layer handling and uploader functionality
- Introduced automatic overlay opacity and gradient based on layer ID in BackgroundLayer component. - Added disabled state to BackgroundUploader, preventing actions when disabled. - Updated component CSS editor to handle disabled state, preventing changes when disabled. - Modified Header and Layout components to manage background inheritance from the page layer. - Improved Sidebar and Card components to respect background inheritance and layering. - Refactored theme management to include default accent color and normalization functions. - Enhanced AppearanceTab to manage accent color changes with debouncing and validation. - Added UI feedback for inherited background layers in AppearanceTab.
This commit is contained in:
@@ -112,27 +112,27 @@
|
||||
@layer base {
|
||||
:root {
|
||||
/* Color Tokens */
|
||||
--color-primary: 221.2 83.2% 53.3%;
|
||||
--color-primary: 188.5 100% 45.5%;
|
||||
--color-primary-foreground: 210 40% 98%;
|
||||
--color-primary-gradient: none;
|
||||
--color-secondary: 210 40% 96.1%;
|
||||
--color-secondary: 188.5 35% 96%;
|
||||
--color-secondary-foreground: 222.2 47.4% 11.2%;
|
||||
--color-muted: 210 40% 96.1%;
|
||||
--color-muted-foreground: 215.4 16.3% 40%;
|
||||
--color-accent: 210 40% 96.1%;
|
||||
--color-muted: 188.5 12% 96%;
|
||||
--color-muted-foreground: 188.5 20% 46.9%;
|
||||
--color-accent: 223.5 60% 50.4%;
|
||||
--color-accent-foreground: 222.2 47.4% 11.2%;
|
||||
--color-destructive: 0 84.2% 45%;
|
||||
--color-destructive-foreground: 210 40% 98%;
|
||||
--color-background: 0 0% 100%;
|
||||
--color-foreground: 222.2 84% 4.9%;
|
||||
--color-card: 0 0% 100%;
|
||||
--color-card: 188.5 14% 98.6%;
|
||||
--color-card-foreground: 222.2 84% 4.9%;
|
||||
--color-popover: 0 0% 100%;
|
||||
--color-popover: 188.5 16% 99.3%;
|
||||
--color-popover-foreground: 222.2 84% 4.9%;
|
||||
--color-border: 214.3 31.8% 91.4%;
|
||||
--color-input: 214.3 31.8% 91.4%;
|
||||
--color-ring: 221.2 83.2% 53.3%;
|
||||
--color-chart-1: 221.2 83.2% 53.3%;
|
||||
--color-border: 188.5 20% 91.4%;
|
||||
--color-input: 188.5 20% 91.4%;
|
||||
--color-ring: 188.5 100% 45.5%;
|
||||
--color-chart-1: 188.5 100% 45.5%;
|
||||
--color-chart-2: 160 60% 45%;
|
||||
--color-chart-3: 30 80% 55%;
|
||||
--color-chart-4: 280 65% 60%;
|
||||
@@ -230,27 +230,27 @@
|
||||
|
||||
.dark {
|
||||
/* Color Tokens */
|
||||
--color-primary: 217.2 91.2% 59.8%;
|
||||
--color-primary: 188.5 100% 45.5%;
|
||||
--color-primary-foreground: 210 40% 98%;
|
||||
--color-primary-gradient: none;
|
||||
--color-secondary: 217.2 32.6% 17.5%;
|
||||
--color-secondary: 188.5 35% 17.5%;
|
||||
--color-secondary-foreground: 210 40% 98%;
|
||||
--color-muted: 217.2 32.6% 17.5%;
|
||||
--color-muted-foreground: 215 20.2% 65.1%;
|
||||
--color-accent: 217.2 32.6% 17.5%;
|
||||
--color-muted: 188.5 12% 17.5%;
|
||||
--color-muted-foreground: 188.5 20% 65.1%;
|
||||
--color-accent: 223.5 60% 35.3%;
|
||||
--color-accent-foreground: 210 40% 98%;
|
||||
--color-destructive: 0 62.8% 30.6%;
|
||||
--color-destructive-foreground: 210 40% 98%;
|
||||
--color-background: 222.2 84% 4.9%;
|
||||
--color-foreground: 210 40% 98%;
|
||||
--color-card: 222.2 84% 4.9%;
|
||||
--color-card: 188.5 18% 8.8%;
|
||||
--color-card-foreground: 210 40% 98%;
|
||||
--color-popover: 222.2 84% 4.9%;
|
||||
--color-popover: 188.5 21% 10.5%;
|
||||
--color-popover-foreground: 210 40% 98%;
|
||||
--color-border: 217.2 32.6% 17.5%;
|
||||
--color-input: 217.2 32.6% 17.5%;
|
||||
--color-ring: 224.3 76.3% 48%;
|
||||
--color-chart-1: 217.2 91.2% 59.8%;
|
||||
--color-border: 188.5 20% 17.5%;
|
||||
--color-input: 188.5 20% 17.5%;
|
||||
--color-ring: 188.5 100% 45.5%;
|
||||
--color-chart-1: 188.5 100% 45.5%;
|
||||
--color-chart-2: 160 60% 50%;
|
||||
--color-chart-3: 30 80% 60%;
|
||||
--color-chart-4: 280 65% 65%;
|
||||
|
||||
Reference in New Issue
Block a user