- Replaced hardcoded colors with CSS variables in ObjectivesBoard and TaskCard for improved theme consistency. - Updated status icon in STATUS_CONFIG for better visual representation. - Adjusted global CSS variables for enhanced contrast and clarity across components.
81 lines
2.2 KiB
CSS
81 lines
2.2 KiB
CSS
@import "tailwindcss";
|
|
|
|
:root {
|
|
/* Dark theme (default) */
|
|
--background: #1e293b; /* slate-800 - encore plus clair */
|
|
--foreground: #f1f5f9; /* slate-100 */
|
|
--card: #334155; /* slate-700 - beaucoup plus clair pour contraste fort */
|
|
--card-hover: #475569; /* slate-600 */
|
|
--card-column: #0f172a; /* slate-900 - plus foncé que les cartes */
|
|
--border: #64748b; /* slate-500 - encore plus clair */
|
|
--input: #334155; /* slate-700 - plus clair */
|
|
--primary: #06b6d4; /* cyan-500 */
|
|
--primary-foreground: #f1f5f9; /* slate-100 */
|
|
--muted: #64748b; /* slate-500 */
|
|
--muted-foreground: #94a3b8; /* slate-400 */
|
|
--accent: #f59e0b; /* amber-500 */
|
|
--destructive: #ef4444; /* red-500 */
|
|
--success: #10b981; /* emerald-500 */
|
|
}
|
|
|
|
.light {
|
|
/* Light theme */
|
|
--background: #f1f5f9; /* slate-100 */
|
|
--foreground: #0f172a; /* slate-900 */
|
|
--card: #ffffff; /* white */
|
|
--card-hover: #f8fafc; /* slate-50 */
|
|
--card-column: #f8fafc; /* slate-50 - colonnes plus foncées que les cartes */
|
|
--border: #cbd5e1; /* slate-300 */
|
|
--input: #ffffff; /* white */
|
|
--primary: #0891b2; /* cyan-600 */
|
|
--primary-foreground: #ffffff; /* white */
|
|
--muted: #94a3b8; /* slate-400 - plus clair pour scrollbar */
|
|
--muted-foreground: #64748b; /* slate-500 */
|
|
--accent: #d97706; /* amber-600 */
|
|
--destructive: #dc2626; /* red-600 */
|
|
--success: #059669; /* emerald-600 */
|
|
}
|
|
|
|
@theme inline {
|
|
--color-background: var(--background);
|
|
--color-foreground: var(--foreground);
|
|
--font-sans: var(--font-geist-sans);
|
|
--font-mono: var(--font-geist-mono);
|
|
}
|
|
|
|
body {
|
|
background: var(--background);
|
|
color: var(--foreground);
|
|
font-family: var(--font-geist-mono), 'Courier New', monospace;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
/* Scrollbar tech style */
|
|
::-webkit-scrollbar {
|
|
width: 6px;
|
|
height: 6px;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background: var(--card);
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background: var(--muted);
|
|
border-radius: 4px;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: var(--primary);
|
|
}
|
|
|
|
/* Animations tech */
|
|
@keyframes glow {
|
|
0%, 100% { box-shadow: 0 0 5px rgba(6, 182, 212, 0.3); }
|
|
50% { box-shadow: 0 0 20px rgba(6, 182, 212, 0.6); }
|
|
}
|
|
|
|
.animate-glow {
|
|
animation: glow 2s ease-in-out infinite;
|
|
}
|