Update admin theme/layout and refresh README details.

Align the project baseline with the latest admin interface styling and layout structure while documenting setup and usage updates in README.
This commit is contained in:
vlad
2026-07-14 17:12:28 +03:00
commit 86cc3fa541
278 changed files with 19416 additions and 0 deletions
+112
View File
@@ -0,0 +1,112 @@
/* Compton design tokens — single source of truth */
:root {
/* Brand */
--primary: #48816d;
--primary-dark: #3a6b58;
--primary-light: #5a9a82;
--primary-accent: #5a9a82;
--primary-tint: #e8f2ef;
--primary-color: var(--primary);
/* Light surfaces */
--bg: #f6f6f4;
--foreground: #1a1e1c;
--muted: #4a5a52;
--marquee-bg: #ebebe5;
--surface: #ffffff;
--border-light: #e8e8e2;
--card: #ffffff;
--card-border: #e8e8e2;
--footer-bg: #1a1e1c;
--bg-page: var(--bg);
--text: var(--foreground);
/* Typography */
--font-sans: "Inter", system-ui, -apple-system, sans-serif;
--font-mono: "JetBrains Mono", "SF Mono", monospace;
--zootech-font: var(--font-sans);
/* Radius */
--radius-card: 18px;
--radius-btn: 40px;
--radius-icon: 16px;
--zt-radius-lg: 16px;
/* Effects */
--shadow-soft: 0 16px 48px rgba(26, 30, 28, 0.08), 0 0 0 1px rgba(26, 30, 28, 0.04);
/* Semantic */
--color-error: #b42318;
--color-success: #0f766e;
--color-danger: #cd3838;
--color-danger-hover: #e94b4b;
--color-warning: #d4a72c;
/* Admin (light — matches site) */
--admin-bg: var(--bg);
--admin-surface: var(--surface);
--admin-surface-2: var(--marquee-bg);
--admin-stroke: var(--border-light);
--admin-soft: var(--muted);
--admin-text: var(--foreground);
--admin-primary: var(--primary);
--admin-primary-hover: var(--primary-tint);
--admin-primary-selected: rgba(72, 129, 109, 0.16);
--admin-primary-option: rgba(72, 129, 109, 0.1);
--admin-btn-bg: var(--surface);
--admin-btn-border: var(--border-light);
--admin-btn-text: var(--foreground);
--admin-success: var(--color-success);
--admin-tag-ok-border: rgba(72, 129, 109, 0.35);
--admin-sider-bg: var(--surface);
--admin-table-header: var(--marquee-bg);
--admin-card-radius: 20px;
/* WESP admin aliases */
--wesp-admin-bg: var(--admin-bg);
--wesp-admin-surface: var(--admin-surface);
--wesp-admin-surface-2: var(--admin-surface-2);
--wesp-admin-stroke: var(--admin-stroke);
--wesp-admin-soft: var(--admin-soft);
--wesp-admin-text: var(--admin-text);
--wesp-admin-primary: var(--admin-primary);
}
html[data-theme="organic"] {
color-scheme: light;
}
html.admin-route,
html.admin-route body {
background: var(--admin-bg);
}
/* Admin dark theme — isolated from public site */
html.admin-route[data-admin-theme="dark"] {
color-scheme: dark;
--admin-deep: #0b0a10;
--admin-bg: #1f2229;
--admin-surface: #0b0a10;
--admin-surface-2: #15141c;
--admin-stroke: rgba(186, 184, 208, 0.14);
--admin-soft: #a8adbb;
--admin-text: #ececf1;
--admin-primary: #5a9a82;
--admin-primary-hover: rgba(90, 154, 130, 0.2);
--admin-primary-selected: rgba(90, 154, 130, 0.32);
--admin-primary-option: rgba(90, 154, 130, 0.16);
--admin-btn-bg: #15141c;
--admin-btn-border: rgba(186, 184, 208, 0.16);
--admin-btn-text: #ececf1;
--admin-success: #6bc4a8;
--admin-tag-ok-border: rgba(90, 154, 130, 0.5);
--admin-sider-bg: #0b0a10;
--admin-table-header: #1a1924;
--admin-card-radius: 20px;
--surface: #0b0a10;
--foreground: #ececf1;
--muted: #a8adbb;
--border-light: rgba(186, 184, 208, 0.14);
--marquee-bg: #1a1924;
--primary-tint: rgba(90, 154, 130, 0.16);
}