stlyes fixes

This commit is contained in:
IGNY8 VPS (Salman)
2025-12-29 19:52:51 +00:00
parent c91175fdcb
commit 4f7ab9c606
155 changed files with 1576 additions and 2489 deletions

View File

@@ -69,82 +69,82 @@ export interface LinkStyles {
export const DEFAULT_COMPONENT_STYLES: ComponentStyles = {
button: {
primary: {
background: '#3b82f6',
color: '#ffffff',
background: 'var(--color-primary, #2C7AA1)',
color: 'var(--color-white, #ffffff)',
hover: {
background: '#2563eb',
color: '#ffffff',
background: 'var(--color-brand-700, #236185)',
color: 'var(--color-white, #ffffff)',
},
active: {
background: '#1d4ed8',
color: '#ffffff',
background: 'var(--color-brand-800, #1a4963)',
color: 'var(--color-white, #ffffff)',
},
},
secondary: {
background: '#6b7280',
color: '#ffffff',
background: 'var(--color-gray-500, #6b7280)',
color: 'var(--color-white, #ffffff)',
hover: {
background: '#4b5563',
color: '#ffffff',
background: 'var(--color-gray-600, #4b5563)',
color: 'var(--color-white, #ffffff)',
},
active: {
background: '#374151',
color: '#ffffff',
background: 'var(--color-gray-700, #374151)',
color: 'var(--color-white, #ffffff)',
},
},
outline: {
background: 'transparent',
color: '#3b82f6',
border: '#3b82f6',
color: 'var(--color-primary, #2C7AA1)',
border: 'var(--color-primary, #2C7AA1)',
hover: {
background: '#3b82f6',
color: '#ffffff',
border: '#3b82f6',
background: 'var(--color-primary, #2C7AA1)',
color: 'var(--color-white, #ffffff)',
border: 'var(--color-primary, #2C7AA1)',
},
active: {
background: '#2563eb',
color: '#ffffff',
background: 'var(--color-brand-700, #236185)',
color: 'var(--color-white, #ffffff)',
},
},
ghost: {
background: 'transparent',
color: '#6b7280',
color: 'var(--color-gray-500, #6b7280)',
hover: {
background: '#f3f4f6',
color: '#1f2937',
background: 'var(--color-gray-100, #f3f4f6)',
color: 'var(--color-gray-800, #1f2937)',
},
active: {
background: '#e5e7eb',
color: '#111827',
background: 'var(--color-gray-200, #e5e7eb)',
color: 'var(--color-gray-900, #111827)',
},
},
},
card: {
background: '#ffffff',
border: '#e5e7eb',
background: 'var(--color-white, #ffffff)',
border: 'var(--color-gray-200, #e5e7eb)',
borderRadius: '0.5rem',
padding: '1.5rem',
shadow: '0 1px 3px 0 rgba(0, 0, 0, 0.1)',
},
input: {
background: '#ffffff',
border: '#d1d5db',
background: 'var(--color-white, #ffffff)',
border: 'var(--color-gray-300, #d1d5db)',
borderRadius: '0.375rem',
padding: '0.5rem 0.75rem',
focus: {
border: '#3b82f6',
ring: '0 0 0 3px rgba(59, 130, 246, 0.1)',
border: 'var(--color-primary, #2C7AA1)',
ring: '0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)',
},
},
heading: {
fontFamily: 'Inter, system-ui, sans-serif',
fontWeight: '700',
lineHeight: '1.2',
color: '#111827',
color: 'var(--color-gray-900, #111827)',
},
link: {
color: '#3b82f6',
hoverColor: '#2563eb',
color: 'var(--color-primary, #2C7AA1)',
hoverColor: 'var(--color-brand-700, #236185)',
underline: false,
},
};

View File

@@ -34,12 +34,12 @@ export const STYLE_PRESETS: StylePreset[] = [
name: 'Modern',
description: 'Clean, contemporary design with vibrant colors',
colors: {
primary: '#3b82f6',
secondary: '#8b5cf6',
accent: '#10b981',
background: '#ffffff',
text: '#1f2937',
border: '#e5e7eb',
primary: 'var(--color-primary, #2C7AA1)',
secondary: 'var(--color-purple, #2C40A1)',
accent: 'var(--color-success, #2CA18E)',
background: 'var(--color-white, #ffffff)',
text: 'var(--color-gray-800, #1f2937)',
border: 'var(--color-gray-200, #e5e7eb)',
},
typography: {
fontFamily: 'Inter, system-ui, sans-serif',
@@ -57,12 +57,12 @@ export const STYLE_PRESETS: StylePreset[] = [
name: 'Classic',
description: 'Traditional, professional design',
colors: {
primary: '#1e40af',
secondary: '#6b7280',
accent: '#059669',
background: '#f9fafb',
text: '#111827',
border: '#d1d5db',
primary: 'var(--color-brand-700, #236185)',
secondary: 'var(--color-gray-500, #6b7280)',
accent: 'var(--color-success-600, #228a7a)',
background: 'var(--color-gray-50, #f9fafb)',
text: 'var(--color-gray-900, #111827)',
border: 'var(--color-gray-300, #d1d5db)',
},
typography: {
fontFamily: 'Georgia, serif',
@@ -80,12 +80,12 @@ export const STYLE_PRESETS: StylePreset[] = [
name: 'Minimal',
description: 'Minimalist design with ample whitespace',
colors: {
primary: '#000000',
secondary: '#4b5563',
accent: '#6b7280',
background: '#ffffff',
text: '#111827',
border: '#f3f4f6',
primary: 'var(--color-gray-900, #000000)',
secondary: 'var(--color-gray-600, #4b5563)',
accent: 'var(--color-gray-500, #6b7280)',
background: 'var(--color-white, #ffffff)',
text: 'var(--color-gray-900, #111827)',
border: 'var(--color-gray-100, #f3f4f6)',
},
typography: {
fontFamily: 'Helvetica, Arial, sans-serif',
@@ -103,12 +103,12 @@ export const STYLE_PRESETS: StylePreset[] = [
name: 'Bold',
description: 'High contrast, bold design',
colors: {
primary: '#dc2626',
secondary: '#ea580c',
accent: '#f59e0b',
background: '#ffffff',
text: '#000000',
border: '#000000',
primary: 'var(--color-danger, #A12C40)',
secondary: 'var(--color-warning-600, #c28a26)',
accent: 'var(--color-warning, #D9A12C)',
background: 'var(--color-white, #ffffff)',
text: 'var(--color-gray-900, #000000)',
border: 'var(--color-gray-900, #000000)',
},
typography: {
fontFamily: 'Arial Black, sans-serif',
@@ -126,12 +126,12 @@ export const STYLE_PRESETS: StylePreset[] = [
name: 'Elegant',
description: 'Sophisticated, refined design',
colors: {
primary: '#7c3aed',
secondary: '#a855f7',
accent: '#ec4899',
background: '#faf5ff',
text: '#1e1b4b',
border: '#e9d5ff',
primary: 'var(--color-purple, #2C40A1)',
secondary: 'var(--color-purple-400, #5f73d1)',
accent: 'var(--color-purple-300, #8895e0)',
background: 'var(--color-purple-50, #f0f2fc)',
text: 'var(--color-purple-900, #1a2660)',
border: 'var(--color-purple-200, #b1baeb)',
},
typography: {
fontFamily: 'Playfair Display, serif',
@@ -149,12 +149,12 @@ export const STYLE_PRESETS: StylePreset[] = [
name: 'Tech',
description: 'Modern tech startup aesthetic',
colors: {
primary: '#06b6d4',
secondary: '#3b82f6',
accent: '#8b5cf6',
background: '#0f172a',
text: '#f1f5f9',
border: '#1e293b',
primary: 'var(--color-brand-400, #4899bd)',
secondary: 'var(--color-primary, #2C7AA1)',
accent: 'var(--color-purple, #2C40A1)',
background: 'var(--color-gray-900, #0f172a)',
text: 'var(--color-gray-100, #f1f5f9)',
border: 'var(--color-gray-800, #1e293b)',
},
typography: {
fontFamily: 'SF Pro Display, system-ui, sans-serif',

View File

@@ -67,11 +67,11 @@
DARK MODE OVERRIDES
=================================================================== */
.dark {
--color-surface: #1f2937;
--color-panel: #1f2937;
--color-panel-alt: #111827;
--color-text: #e5eaf0;
--color-text-dim: #9ca3af;
--color-stroke: #374151;
--color-surface: #1A2B3C; /* Charcoal navy (matches --color-navy) */
--color-panel: #243A4D; /* Slightly lighter navy for cards */
--color-panel-alt: #142230; /* Deeper navy for nested panels */
--color-text: #E8F0F4; /* Cool off-white (matches --color-text-light) */
--color-text-dim: #8A9BAC; /* Muted blue-gray for secondary text */
--color-stroke: #2E4A5E; /* Blue-tinted border color */
}