Этап 1a: фундамент
- Next 16.4 и Payload 3.91 в одном приложении, PostgreSQL с UUID, TypeScript 6, ESLint 9, Prettier, Vitest - Payload: администраторы с ролями, multi-tenant по сайтам, локализация en/ru/de/fr/es, интерфейс админки ru/en, языки сайта (sites.locales) - Коллекции sites, domains, currencies, countries, locations, tags, tariffs, payment-systems (manual), media и начальные данные (pnpm seed) - Proxy: хост → домен, язык и валюта, внутренние маршруты по хосту; /admin и /api закрыты на доменах брендов - Токены и темы брендов, оболочки сайта и кабинета, переключатели языка, валюты и темы, заглушки страниц - /svc/health, юнит systemd veilix-dev.service - Документация: решения D-022…D-024, команды в CLAUDE.md Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
andreypr207andClaude Opus 5.5 committed
1 parent
3400f58a5a
commit
7e331c2c9d
140 files changed
+15885
-43
No files matched your search
@@ -0,0 +1,100 @@
|
||||
@import 'tailwindcss';
|
||||
@import './tokens.css';
|
||||
|
||||
@custom-variant dark (&:where([data-theme='dark'], [data-theme='dark'] *));
|
||||
|
||||
/* только цвета из токенов брендов: палитра Tailwind по умолчанию отключена */
|
||||
@theme {
|
||||
--color-*: initial;
|
||||
/* 900px: шапка сайта и кабинет переходят в мобильный вид, как в макетах */
|
||||
--breakpoint-nav: 56.25rem;
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-bg: var(--bg);
|
||||
--color-surface: var(--surface);
|
||||
--color-surface-2: var(--surface-2);
|
||||
--color-ink: var(--ink);
|
||||
--color-ink-2: var(--ink-2);
|
||||
--color-ink-3: var(--ink-3);
|
||||
--color-border: var(--border);
|
||||
--color-accent: var(--accent);
|
||||
--color-accent-hover: var(--accent-hover);
|
||||
--color-accent-soft: var(--accent-soft);
|
||||
--color-sel: var(--sel);
|
||||
--color-on-accent: var(--on-accent);
|
||||
--color-glow-1: var(--glow-1);
|
||||
--color-glow-2: var(--glow-2);
|
||||
--color-glow-3: var(--glow-3);
|
||||
--color-veil: var(--veil);
|
||||
--color-warn: var(--warn);
|
||||
--color-tg: var(--tg);
|
||||
--color-land: var(--land);
|
||||
--color-land-line: var(--land-line);
|
||||
--color-ocean: var(--ocean);
|
||||
--shadow-card: var(--shadow);
|
||||
--font-sans: var(--font-commissioner), system-ui, sans-serif;
|
||||
--font-logo: var(--font-unbounded), var(--font-commissioner), sans-serif;
|
||||
}
|
||||
|
||||
@layer base {
|
||||
html {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
html[data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
body {
|
||||
min-height: 100vh;
|
||||
background: var(--bg);
|
||||
color: var(--ink);
|
||||
font-family: var(--font-sans);
|
||||
font-weight: 400;
|
||||
letter-spacing: -0.01em;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
transition:
|
||||
background-color 240ms ease,
|
||||
color 240ms ease;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--accent);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--accent-hover);
|
||||
}
|
||||
|
||||
button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input,
|
||||
textarea,
|
||||
select {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
:focus-visible {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
animation-duration: 0.01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: 0.01ms !important;
|
||||
scroll-behavior: auto !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,106 @@
|
||||
/*
|
||||
* Токены брендов из <style> прототипов design/handoff/project.
|
||||
* Бренд — атрибут data-site на <html>, тема — data-theme (ставит скрипт в <head> до отрисовки).
|
||||
* --sel — подсветка выбранного пункта: у Вейликса это --accent-soft, у ВейликсВПН свой цвет.
|
||||
* Цвета карты (--land, --land-line, --ocean) у Вейликса взяты из Locations: в Main глобус светлее,
|
||||
* какой вариант оставить — решаем на этапе 1b.
|
||||
*/
|
||||
|
||||
[data-site='dedicated'] {
|
||||
--bg: oklch(99% 0.005 296);
|
||||
--surface: oklch(100% 0 0);
|
||||
--surface-2: oklch(97.5% 0.01 296);
|
||||
--ink: oklch(24% 0.04 296);
|
||||
--ink-2: oklch(45% 0.03 296);
|
||||
--ink-3: oklch(60% 0.025 296);
|
||||
--border: oklch(92% 0.014 296);
|
||||
--accent: oklch(45% 0.17 296);
|
||||
--accent-hover: oklch(38% 0.17 296);
|
||||
--accent-soft: oklch(95.5% 0.028 296);
|
||||
--sel: var(--accent-soft);
|
||||
--on-accent: oklch(99% 0.01 296);
|
||||
--glow-1: oklch(86% 0.1 296);
|
||||
--glow-2: oklch(89% 0.09 266);
|
||||
--glow-3: oklch(91% 0.08 332);
|
||||
--veil: oklch(100% 0 0 / 0.55);
|
||||
--warn: oklch(62% 0.14 62);
|
||||
--tg: oklch(62% 0.15 250);
|
||||
--land: oklch(93% 0.015 296);
|
||||
--land-line: oklch(87% 0.02 296);
|
||||
--ocean: oklch(97.5% 0.007 296);
|
||||
--shadow: 0 1px 2px oklch(24% 0.04 296 / 0.05), 0 12px 32px -12px oklch(24% 0.04 296 / 0.14);
|
||||
}
|
||||
|
||||
[data-site='dedicated'][data-theme='dark'] {
|
||||
--bg: oklch(17% 0.022 296);
|
||||
--surface: oklch(21% 0.026 296);
|
||||
--surface-2: oklch(24% 0.03 296);
|
||||
--ink: oklch(96% 0.01 296);
|
||||
--ink-2: oklch(79% 0.02 296);
|
||||
--ink-3: oklch(63% 0.025 296);
|
||||
--border: oklch(31% 0.032 296);
|
||||
--accent: oklch(74% 0.15 296);
|
||||
--accent-hover: oklch(80% 0.13 296);
|
||||
--accent-soft: oklch(27% 0.05 296);
|
||||
--on-accent: oklch(17% 0.03 296);
|
||||
--glow-1: oklch(45% 0.16 296);
|
||||
--glow-2: oklch(40% 0.14 266);
|
||||
--glow-3: oklch(42% 0.13 332);
|
||||
--veil: oklch(100% 0 0 / 0.07);
|
||||
--warn: oklch(78% 0.13 62);
|
||||
--tg: oklch(70% 0.13 250);
|
||||
--land: oklch(27% 0.03 296);
|
||||
--land-line: oklch(34% 0.035 296);
|
||||
--ocean: oklch(24% 0.025 296);
|
||||
--shadow: 0 1px 2px oklch(10% 0.02 296 / 0.4), 0 16px 40px -16px oklch(8% 0.02 296 / 0.7);
|
||||
}
|
||||
|
||||
[data-site='mass'] {
|
||||
--bg: oklch(99.6% 0.0015 215);
|
||||
--surface: oklch(100% 0 0);
|
||||
--surface-2: oklch(98.4% 0.003 215);
|
||||
--ink: oklch(24% 0.04 204);
|
||||
--ink-2: oklch(45% 0.03 204);
|
||||
--ink-3: oklch(60% 0.025 204);
|
||||
--border: oklch(92% 0.014 200);
|
||||
--accent: oklch(48% 0.105 178);
|
||||
--accent-hover: oklch(41% 0.1 178);
|
||||
--accent-soft: oklch(95.5% 0.032 180);
|
||||
--sel: oklch(96.5% 0.016 190);
|
||||
--on-accent: oklch(99% 0.01 180);
|
||||
--glow-1: oklch(86% 0.085 190);
|
||||
--glow-2: oklch(88% 0.075 205);
|
||||
--glow-3: oklch(89% 0.07 172);
|
||||
--veil: oklch(100% 0 0 / 0.55);
|
||||
--warn: oklch(62% 0.14 62);
|
||||
--tg: oklch(62% 0.15 250);
|
||||
--land: oklch(95% 0.012 196);
|
||||
--land-line: oklch(90% 0.018 196);
|
||||
--ocean: oklch(97.5% 0.007 196);
|
||||
--shadow: 0 1px 2px oklch(24% 0.04 204 / 0.05), 0 12px 32px -12px oklch(24% 0.04 204 / 0.14);
|
||||
}
|
||||
|
||||
[data-site='mass'][data-theme='dark'] {
|
||||
--bg: oklch(23% 0.026 210);
|
||||
--surface: oklch(26.5% 0.028 210);
|
||||
--surface-2: oklch(30% 0.03 210);
|
||||
--ink: oklch(96% 0.012 196);
|
||||
--ink-2: oklch(80% 0.02 196);
|
||||
--ink-3: oklch(65% 0.025 196);
|
||||
--border: oklch(36% 0.04 204);
|
||||
--accent: oklch(76% 0.105 190);
|
||||
--accent-hover: oklch(83% 0.09 190);
|
||||
--accent-soft: oklch(31% 0.05 190);
|
||||
--sel: oklch(30% 0.03 195);
|
||||
--on-accent: oklch(20% 0.04 204);
|
||||
--glow-1: oklch(52% 0.09 200);
|
||||
--glow-2: oklch(47% 0.085 215);
|
||||
--glow-3: oklch(50% 0.08 180);
|
||||
--veil: oklch(100% 0 0 / 0.07);
|
||||
--warn: oklch(78% 0.13 62);
|
||||
--tg: oklch(70% 0.13 250);
|
||||
--land: oklch(31% 0.035 204);
|
||||
--land-line: oklch(37% 0.04 204);
|
||||
--ocean: oklch(27% 0.035 204);
|
||||
--shadow: 0 1px 2px oklch(12% 0.03 204 / 0.4), 0 16px 40px -16px oklch(9% 0.03 204 / 0.7);
|
||||
}
|
||||
Reference in new issue
Block a user