f42a390e8b
- index.css: bump text-secondary #888→#b0b0b0, text-muted #555→#787878, border slightly lighter for better readability on dark backgrounds - TopBar: add '← Dashboard' back button on all non-dashboard pages - Sidebar: make AC logo clickable to navigate home Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
98 lines
2.5 KiB
CSS
98 lines
2.5 KiB
CSS
@import "tailwindcss";
|
|
|
|
/* Oliver Agency dark theme */
|
|
:root {
|
|
--bg-color: #000000;
|
|
--bg-card: #121212;
|
|
--bg-sidebar: #0a0a0a;
|
|
--accent: #FFC407;
|
|
--accent-hover: #e6b000;
|
|
--text-primary: #ffffff;
|
|
--text-secondary: #b0b0b0;
|
|
--text-muted: #787878;
|
|
--border: #2a2a2a;
|
|
--border-light: #3a3a3a;
|
|
--success: #22c55e;
|
|
--danger: #ef4444;
|
|
--warning: #f59e0b;
|
|
--info: #3b82f6;
|
|
}
|
|
|
|
* { box-sizing: border-box; }
|
|
|
|
body {
|
|
margin: 0;
|
|
background: var(--bg-color);
|
|
color: var(--text-primary);
|
|
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
|
|
font-size: 14px;
|
|
line-height: 1.5;
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
#root {
|
|
min-height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
/* Scrollbar styling */
|
|
::-webkit-scrollbar { width: 6px; height: 6px; }
|
|
::-webkit-scrollbar-track { background: var(--bg-card); }
|
|
::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: 3px; }
|
|
::-webkit-scrollbar-thumb:hover { background: #444; }
|
|
|
|
/* Handsontable v17 dark theme via CSS variables */
|
|
/* Force dark color-scheme so light-dark() resolves to dark variant */
|
|
.ht-theme-main {
|
|
color-scheme: dark;
|
|
|
|
/* Oliver accent colour instead of blue */
|
|
--ht-colors-primary-100: #FFC407;
|
|
--ht-colors-primary-200: #FFC407;
|
|
--ht-colors-primary-300: #e6b000;
|
|
--ht-colors-primary-400: #e6b000;
|
|
--ht-colors-primary-500: #cc9d00;
|
|
--ht-colors-primary-600: #b38900;
|
|
|
|
/* Dark palette */
|
|
--ht-colors-palette-950: #121212;
|
|
--ht-colors-palette-900: #1a1a1a;
|
|
--ht-colors-palette-800: #ffffff;
|
|
--ht-colors-palette-700: #222222;
|
|
--ht-colors-palette-600: #333333;
|
|
--ht-colors-palette-500: #555555;
|
|
--ht-colors-palette-400: #888888;
|
|
--ht-colors-palette-300: #aaaaaa;
|
|
--ht-colors-palette-200: #cccccc;
|
|
--ht-colors-palette-100: #222222;
|
|
--ht-colors-palette-50: #1a1a1a;
|
|
--ht-colors-white: #121212;
|
|
|
|
/* Font */
|
|
font-family: 'Montserrat', 'Inter', system-ui, sans-serif;
|
|
font-size: 13px;
|
|
}
|
|
|
|
/* Column headers: uppercase accent */
|
|
.ht-theme-main .ht_clone_top th,
|
|
.ht-theme-main .ht_clone_left th,
|
|
.ht-theme-main th {
|
|
font-size: 11px !important;
|
|
font-weight: 600 !important;
|
|
text-transform: uppercase !important;
|
|
letter-spacing: 0.5px !important;
|
|
color: var(--accent) !important;
|
|
}
|
|
|
|
/* Context menu dark */
|
|
.htContextMenu .wtHolder {
|
|
background: #1a1a1a !important;
|
|
border: 1px solid var(--border) !important;
|
|
}
|
|
.htContextMenu td {
|
|
color: var(--text-primary) !important;
|
|
}
|
|
.htContextMenu td.current {
|
|
background: rgba(255,196,7,0.15) !important;
|
|
}
|