phase 1-3 css refactor

This commit is contained in:
Desktop
2025-11-14 15:04:47 +05:00
parent 9eee5168bb
commit 27465457d5
26 changed files with 818 additions and 429 deletions

View File

@@ -13,60 +13,37 @@
=================================================================== */
/* === CSS CUSTOM PROPERTIES (Variables) === */
:root {
/* Primary Brand Colors */
--igny8-blue: #0693e3; /* Rocket vivid cyan blue - primary brand & main CTA */
--igny8-blue-dark: #0472b8; /* Darkened cyan for hover / active / gradient depth */
/* Success Green (cooler to match cyan) */
--igny8-green: #0bbf87; /* Slightly cooler teal-green for success states */
--igny8-green-dark: #08966b; /* Deeper teal-green for hover / active */
/* Amber / Warning (warmed up to complement cyan) */
--igny8-amber: #ff7a00; /* Rocket's vivid orange for highlight / warning */
--igny8-amber-dark: #cc5f00; /* Darker orange for hover / strong warning */
/* Danger / Destructive */
--igny8-red: #ef4444;
--igny8-red-dark: #d13333; /* Refreshed red with better contrast against cyan */
/* Purple */
--igny8-purple: #5d4ae3; /* Purple for highlighting / special emphasis */
--igny8-purple-dark: #3a2f94; /* Darker purple for hover / active */
/* Background Colors */
--igny8-navy-bg: #0d1b2a; /* Sidebar background */
--igny8-navy-bg-2: #142b3f; /* Slightly lighter navy, hover/active */
--igny8-surface: #f8fafc; /* Page background (soft gray-white) */
--igny8-panel: #ffffff; /* Cards / panel foreground */
--igny8-panel-2: #f1f5f9; /* Sub-panel / hover card background */
/* Text Colors */
--igny8-text: #555a68; /* main headings/body text */
--igny8-text-dim: #64748b; /* secondary/subtext */
--igny8-text-light: #e5eaf0; /* text on dark sidebar */
--igny8-stroke: #e2e8f0; /* table/grid borders and dividers */
/* Border Radius */
--igny8-radius: 6px;
/* Gradients */
--igny8-gradient-blue: linear-gradient(135deg, var(--igny8-blue) 0%, var(--igny8-blue-dark) 100%);
--igny8-gradient-success: linear-gradient(135deg, var(--igny8-green) 0%, var(--igny8-green-dark) 100%);
--igny8-gradient-warning: linear-gradient(135deg, var(--igny8-amber) 0%, var(--igny8-amber-dark) 100%);
--igny8-gradient-danger: linear-gradient(135deg, var(--igny8-red) 0%, var(--igny8-red-dark) 100%);
--igny8-gradient-purple: linear-gradient(135deg, var(--igny8-purple) 0%, var(--igny8-purple-dark) 100%);
--igny8-gradient-panel: linear-gradient(180deg, var(--igny8-panel) 0%, var(--igny8-panel-2) 100%);
}
/* Import tokens from centralized tokens.css */
@import "./tokens.css";
/* Dark mode overrides (if needed) */
.dark {
--igny8-surface: #1f2937;
--igny8-panel: #1f2937;
--igny8-panel-2: #111827;
--igny8-text: #e5eaf0;
--igny8-text-dim: #9ca3af;
--igny8-stroke: #374151;
/* Legacy variable aliases for backward compatibility during migration */
:root {
--igny8-blue: var(--color-primary);
--igny8-blue-dark: var(--color-primary-dark);
--igny8-green: var(--color-success);
--igny8-green-dark: var(--color-success-dark);
--igny8-amber: var(--color-warning);
--igny8-amber-dark: var(--color-warning-dark);
--igny8-red: var(--color-danger);
--igny8-red-dark: var(--color-danger-dark);
--igny8-purple: var(--color-purple);
--igny8-purple-dark: var(--color-purple-dark);
--igny8-navy-bg: var(--color-navy);
--igny8-navy-bg-2: var(--color-navy-light);
--igny8-surface: var(--color-surface);
--igny8-panel: var(--color-panel);
--igny8-panel-2: var(--color-panel-alt);
--igny8-text: var(--color-text);
--igny8-text-dim: var(--color-text-dim);
--igny8-text-light: var(--color-text-light);
--igny8-stroke: var(--color-stroke);
--igny8-radius: var(--radius-base);
--igny8-gradient-blue: var(--gradient-primary);
--igny8-gradient-success: var(--gradient-success);
--igny8-gradient-warning: var(--gradient-warning);
--igny8-gradient-danger: var(--gradient-danger);
--igny8-gradient-purple: var(--gradient-purple);
--igny8-gradient-panel: var(--gradient-panel);
}
/* ===================================================================