123 lines
3.4 KiB
CSS
123 lines
3.4 KiB
CSS
[data-theme="dark"] {
|
|
/* Backgrounds */
|
|
--color-bg-page: #0f172a;
|
|
--color-bg-surface: #1e293b;
|
|
--color-bg-input: #0f172a;
|
|
--color-bg-hover: #334155;
|
|
--color-bg-muted: #1a2540;
|
|
--color-bg-subtle: #162032;
|
|
--color-bg-alt: #0f172a;
|
|
--color-bg-input-alt: #253045;
|
|
--color-bg-empty: #253045;
|
|
|
|
/* Borders */
|
|
--color-border: #334155;
|
|
--color-border-light: #334155;
|
|
--color-border-medium: #475569;
|
|
--color-border-faint: #2a3650;
|
|
--color-border-subtle: #2a3650;
|
|
--color-border-xfaint: #1e293b;
|
|
--color-border-ddd: #334155;
|
|
|
|
/* Text */
|
|
--color-text: #e2e8f0;
|
|
--color-text-heading: #f1f5f9;
|
|
--color-text-muted: #94a3b8;
|
|
--color-text-faint: #7a8a9f;
|
|
--color-text-secondary: #cbd5e1;
|
|
--color-text-subtle: #94a3b8;
|
|
--color-text-dark: #cbd5e1;
|
|
--color-text-placeholder: #64748b;
|
|
--color-text-gray: #94a3b8;
|
|
--color-text-medium: #94a3b8;
|
|
--color-text-faint2: #64748b;
|
|
--color-text-light: #64748b;
|
|
--color-text-black: #e2e8f0;
|
|
--color-text-dim: #94a3b8;
|
|
|
|
/* Accent */
|
|
--color-accent: #ff5e3a;
|
|
--color-accent-hover: #ff7a5c;
|
|
--color-accent-gradient: linear-gradient(135deg, #ff5e3a 0%, #ff2d55 100%);
|
|
--color-accent-shadow: rgba(255, 94, 58, 0.3);
|
|
--color-accent-ring: rgba(255, 94, 58, 0.15);
|
|
--color-accent-tint: #2a1a15;
|
|
|
|
/* Feedback */
|
|
--color-error-bg: #3b1111;
|
|
--color-error-text: #fca5a5;
|
|
--color-success-bg: #052e16;
|
|
--color-success-text: #86efac;
|
|
|
|
/* Shadows (stronger on dark mode) */
|
|
--color-shadow: rgba(0, 0, 0, 0.3);
|
|
--color-shadow-lg: rgba(0, 0, 0, 0.3);
|
|
--color-shadow-md: rgba(0, 0, 0, 0.3);
|
|
|
|
/* Additional dark overrides */
|
|
--color-warning-bg: #3d2e00;
|
|
--color-warning-bg-dark: #5a4200;
|
|
--color-notification-bg: #1e293b;
|
|
--color-trash-surface: #1e293b;
|
|
--color-trash-border: #334155;
|
|
--color-trash-empty-bg: #334155;
|
|
--color-user-menu-header-bg: linear-gradient(135deg, #1a2332 0%, #1e2940 100%);
|
|
--color-user-menu-header-border: #3a2520;
|
|
--color-info-bg: #0c1e35;
|
|
--color-info-bg-alt: #0c1e35;
|
|
--color-info-surface: #0c1e35;
|
|
--color-danger-light-bg: #2a0c0c;
|
|
--color-danger-lighter: #2a0c0c;
|
|
--color-purple-bg: #1a0a33;
|
|
--color-success-bg-alt: #0a2015;
|
|
--color-success-bg-green: #0a2015;
|
|
--color-content-bg-warn: #3d2e00;
|
|
--color-content-bg-warn-dark: #5a4200;
|
|
|
|
/* Sidebar */
|
|
--color-sidebar-bg-from: #0f172a;
|
|
--color-sidebar-bg-to: #0c1322;
|
|
|
|
/* Items */
|
|
--color-item-active: #5a5047;
|
|
--color-item-selected: #39281a;
|
|
--color-item-hover-accent: #3d342c;
|
|
|
|
/* Primary */
|
|
/* TODO: rename into primary-blue ? */
|
|
--color-primary: #60a5fa;
|
|
--color-primary-hover: #6fa8ee;
|
|
}
|
|
|
|
/* ------------ */
|
|
|
|
[data-theme="dark"] select {
|
|
background-color: #1e293b;
|
|
border-color: #334155;
|
|
color: #e2e8f0;
|
|
}
|
|
|
|
[data-theme="dark"] select:hover {
|
|
border-color: #475569;
|
|
}
|
|
|
|
[data-theme="dark"] select:focus {
|
|
border-color: #ff5e3a;
|
|
background-color: #1e293b;
|
|
}
|
|
|
|
/* ── trash.css ── */
|
|
/* FIXME avoir as much as possible specific cases */
|
|
[data-theme="dark"] .trash-actions button,
|
|
[data-theme="dark"] .actions-cell button {
|
|
background: var(--color-bg-surface);
|
|
border-color: var(--color-border);
|
|
color: var(--color-text);
|
|
}
|
|
|
|
[data-theme="dark"] .trash-actions button:hover,
|
|
[data-theme="dark"] .actions-cell button:hover {
|
|
background: var(--color-bg-alt);
|
|
color: var(--color-accent);
|
|
}
|