чёрно-белая палитра
This commit is contained in:
parent
8050b669c2
commit
181440b81d
@ -6,3 +6,7 @@ up to date in 475ms
|
|||||||
|
|
||||||
up to date in 355ms
|
up to date in 355ms
|
||||||
Сервер на порту 3000
|
Сервер на порту 3000
|
||||||
|
--- run Wed Sep 23 10:13:43 AM UTC 2026 :: npm start --silent
|
||||||
|
|
||||||
|
up to date in 326ms
|
||||||
|
Сервер на порту 3000
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
290
|
1345
|
||||||
|
|||||||
@ -1,39 +1,40 @@
|
|||||||
/* Vibe AI: Стандартный дизайн. Load AFTER the four base stylesheets. */
|
/* Vibe AI: Стандартный дизайн. Load AFTER the four base stylesheets. */
|
||||||
|
/* Чёрно-белая палитра по запросу пользователя. */
|
||||||
:root, [data-theme] {
|
:root, [data-theme] {
|
||||||
color-scheme: light;
|
color-scheme: dark;
|
||||||
--kt-ai-bg: #fafaf9;
|
--kt-ai-bg: #0a0a0a;
|
||||||
--kt-ai-bg-soft: #fafaf9;
|
--kt-ai-bg-soft: #111111;
|
||||||
--kt-ai-bg-elevated: #ffffff;
|
--kt-ai-bg-elevated: #141414;
|
||||||
--kt-ai-bg-sunken: #fafaf9;
|
--kt-ai-bg-sunken: #0a0a0a;
|
||||||
--kt-ai-bg-glass: #ffffff;
|
--kt-ai-bg-glass: #141414;
|
||||||
--kt-ai-bg-hover: #c1e1f7;
|
--kt-ai-bg-hover: #1f1f1f;
|
||||||
--kt-ai-bg-active: #c1e1f7;
|
--kt-ai-bg-active: #1f1f1f;
|
||||||
--kt-ai-fg: #0c0a09;
|
--kt-ai-fg: #fafafa;
|
||||||
--kt-ai-fg-muted: #78716c;
|
--kt-ai-fg-muted: #a3a3a3;
|
||||||
--kt-ai-fg-faint: #78716c;
|
--kt-ai-fg-faint: #737373;
|
||||||
--kt-ai-fg-on-fill: #0c0a09;
|
--kt-ai-fg-on-fill: #fafafa;
|
||||||
--kt-ai-border: #e8e6e5;
|
--kt-ai-border: #262626;
|
||||||
--kt-ai-border-strong: #78716c;
|
--kt-ai-border-strong: #525252;
|
||||||
--kt-ai-divider: #e8e6e5;
|
--kt-ai-divider: #262626;
|
||||||
--kt-ai-card-bg: #ffffff;
|
--kt-ai-card-bg: #111111;
|
||||||
--kt-ai-card-bg-glow: #ffffff;
|
--kt-ai-card-bg-glow: #141414;
|
||||||
--kt-ai-card-border: #e8e6e5;
|
--kt-ai-card-border: #262626;
|
||||||
--kt-ai-card-border-hover: #78716c;
|
--kt-ai-card-border-hover: #404040;
|
||||||
--kt-ai-primary: #3ba6f1;
|
--kt-ai-primary: #fafafa;
|
||||||
--kt-ai-primary-hover: #3ba6f1;
|
--kt-ai-primary-hover: #e6e6e6;
|
||||||
--kt-ai-primary-subtle: #c1e1f7;
|
--kt-ai-primary-subtle: #1f1f1f;
|
||||||
--kt-ai-link: #0369a1;
|
--kt-ai-link: #d4d4d4;
|
||||||
--kt-ai-brand-blue: #3ba6f1;
|
--kt-ai-brand-blue: #fafafa;
|
||||||
--kt-ai-selection: #c1e1f7;
|
--kt-ai-selection: #333333;
|
||||||
--kt-ai-focus-ring: #0369a1;
|
--kt-ai-focus-ring: #fafafa;
|
||||||
--kt-ai-focus-shadow: 0 0 0 3px #c1e1f7;
|
--kt-ai-focus-shadow: 0 0 0 3px #333333;
|
||||||
--kt-ai-chip-default-bg: #c1e1f7;
|
--kt-ai-chip-default-bg: #262626;
|
||||||
--kt-ai-chip-default-fg: #0c0a09;
|
--kt-ai-chip-default-fg: #fafafa;
|
||||||
--kt-ai-font-sans: Inter, system-ui, sans-serif;
|
--kt-ai-font-sans: Inter, system-ui, sans-serif;
|
||||||
--kt-ai-card-shadow: 0 2px 6px #0c0a0908;
|
--kt-ai-card-shadow: 0 2px 6px #00000060;
|
||||||
--kt-ai-card-shadow-hover: 0 4px 12px #0c0a0910;
|
--kt-ai-card-shadow-hover: 0 4px 12px #00000080;
|
||||||
--vibe-accent: #3ba6f1;
|
--vibe-accent: #fafafa;
|
||||||
--vibe-tint: #c1e1f7;
|
--vibe-tint: #1f1f1f;
|
||||||
--vibe-heading-font: Inter, system-ui, sans-serif;
|
--vibe-heading-font: Inter, system-ui, sans-serif;
|
||||||
--vibe-heading-weight: 400;
|
--vibe-heading-weight: 400;
|
||||||
--vibe-card-radius: 10px;
|
--vibe-card-radius: 10px;
|
||||||
@ -49,5 +50,8 @@ h1, h2, .kt-ai-h1, .kt-ai-h2 { font-family: var(--vibe-heading-font); font-weigh
|
|||||||
.kt-ai-tile, .kt-ai-card { background: var(--kt-ai-card-bg); border: 1px solid var(--kt-ai-card-border); border-radius: var(--vibe-card-radius); box-shadow: var(--kt-ai-card-shadow); }
|
.kt-ai-tile, .kt-ai-card { background: var(--kt-ai-card-bg); border: 1px solid var(--kt-ai-card-border); border-radius: var(--vibe-card-radius); box-shadow: var(--kt-ai-card-shadow); }
|
||||||
.kt-ai-btn, .kt-ai-btn[data-size] { border-radius: var(--vibe-button-radius); }
|
.kt-ai-btn, .kt-ai-btn[data-size] { border-radius: var(--vibe-button-radius); }
|
||||||
.kt-ai-input, .kt-ai-select, .kt-ai-textarea { border-radius: var(--vibe-field-radius); }
|
.kt-ai-input, .kt-ai-select, .kt-ai-textarea { border-radius: var(--vibe-field-radius); }
|
||||||
.vibe-highlight { background: var(--vibe-tint); color: var(--kt-ai-fg); border-radius: 4px; padding-inline: .12em; }
|
/* Белая акцентная кнопка: текст на ней чёрный для читаемости */
|
||||||
.vibe-accent { color: var(--vibe-accent); }
|
.kt-ai-btn[data-variant="primary"] { color: var(--kt-ai-bg); }
|
||||||
|
.kt-ai-btn[data-variant="primary"]:hover { color: var(--kt-ai-bg); }
|
||||||
|
.vibe-highlight { background: var(--vibe-tint); color: var(--kt-ai-fg); border-radius: 4px; padding-inline: .12em; box-shadow: inset 0 0 0 1px var(--kt-ai-border); }
|
||||||
|
.vibe-accent { color: var(--kt-ai-fg); }
|
||||||
|
|||||||
@ -35,7 +35,7 @@
|
|||||||
.article h3 { font-size: 16px; font-weight: 500; line-height: 1.35; }
|
.article h3 { font-size: 16px; font-weight: 500; line-height: 1.35; }
|
||||||
.article .excerpt { color: var(--kt-ai-fg-muted); font-size: 14px; flex: 1; }
|
.article .excerpt { color: var(--kt-ai-fg-muted); font-size: 14px; flex: 1; }
|
||||||
.article-meta { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: 12px; color: var(--kt-ai-fg-muted); }
|
.article-meta { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: 12px; color: var(--kt-ai-fg-muted); }
|
||||||
.sport-banner { border-radius: var(--vibe-card-radius); background: var(--kt-ai-primary-subtle); border: none; padding: clamp(24px, 5vw, 44px); }
|
.sport-banner { border-radius: var(--vibe-card-radius); background: var(--kt-ai-bg-soft); border: 1px solid var(--kt-ai-border); padding: clamp(24px, 5vw, 44px); }
|
||||||
.sport-banner h2 { font-size: clamp(26px, 4vw, 40px); margin-bottom: 8px; }
|
.sport-banner h2 { font-size: clamp(26px, 4vw, 40px); margin-bottom: 8px; }
|
||||||
.sport-banner p { color: var(--kt-ai-fg-muted); max-width: 560px; }
|
.sport-banner p { color: var(--kt-ai-fg-muted); max-width: 560px; }
|
||||||
.match-strip { display: flex; gap: 12px; flex-wrap: wrap; margin-top: var(--kt-ai-space-8, 28px); }
|
.match-strip { display: flex; gap: 12px; flex-wrap: wrap; margin-top: var(--kt-ai-space-8, 28px); }
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user