feat(figma-1to1): exact CHAPTER / Между 18+ Figma implementation

This commit is contained in:
Hermes Virtual Office Bot 2026-10-21 14:06:16 +00:00
parent b8eaa9016e
commit 8d83cb510d
4 changed files with 3253 additions and 58 deletions

View File

@ -1,8 +1,29 @@
# DESIGN_SYSTEM.md (Normalized Figma Tokens)
# DESIGN_SYSTEM.md (Normalized Figma Tokens — `Между`)
- **Reference Source:** https://www.figma.com/design/KBYFGreBmq4OqDidZ5QwLm/%D0%9C%D0%B5%D0%B6%D0%B4%D1%83?node-id=12-312729&t=rTTZSAPTuuE8Ofkx-1
- **File Key / Node:** `KBYFGreBmq4OqDidZ5QwLm` / `12:312729`
- **Primary Palette:** `#0F172A, #6366F1, #10B981, #F8FAFC, #1E293B`
- **Typography:** `Inter, JetBrains Mono`
- **Border Radius & Surface:** `12px`, Glassmorphic slate cards (`backdrop-blur-md`)
- **Responsive Breakpoints:** Desktop `1440x900` (12-col grid) | Mobile `390x844` (single-col stack)
- **Mapped FSD Widgets:** `AppHeader, HeroMetricBanner, FilterBar, FeatureCardGrid, ActionModal`
- **Live Figma API Fetched:** `True`
- **Primary Palette:** `#3E392C, #FFFFFF, #B9C0D0, #DFDDD7, #F6F7F2, #24211D, #686158, #FFFDFA, #793C49, #1C2030`
- **Typography:** `Inter, Manrope, Cormorant Garamond, Poppins, Arial`
- **Border Radius & Surface:** `4px - 8px`
- **Responsive Breakpoints & Layout:** `Desktop 1440px (232px Left Sidebar + 48px Content Padding) / Mobile 390px`
- **Detected Figma Screens:**
- `CHAPTER · Личное · десктоп` (1440×1327px, node `12:322663`)
- `CHAPTER · Личное · мобильный` (390×1490px, node `12:322707`)
- `CHAPTER · AI видеодиалог · десктоп` (1440×1261px, node `12:322342`)
- `CHAPTER · AI видеодиалог · мобильный` (390×1136px, node `12:322376`)
- `CHAPTER · Диалог с AI · Лев · десктоп` (1440×1235px, node `12:321943`)
- `CHAPTER · Диалог с AI · Лев · мобильный` (390×1437px, node `12:322016`)
- `CHAPTER · Диалоги · десктоп` (1440×1050px, node `12:321606`)
- `CHAPTER · Диалоги · мобильный` (390×1008px, node `12:321648`)
- `CHAPTER · Мои AI · десктоп` (1440×1418px, node `12:321283`)
- `CHAPTER · Мои AI · мобильный` (390×1491px, node `12:321318`)
- `CHAPTER · Конструктор · 5 · Проверка · мобильный` (390×1447px, node `12:320942`)
- `CHAPTER · Конструктор · 5 · Проверка · десктоп` (1440×1462px, node `12:320854`)
- `CHAPTER · Конструктор · 4 · Голос и общение · десктоп` (1440×1198px, node `12:320265`)
- `CHAPTER · Конструктор · 4 · Голос и общение · мобильный` (390×1240px, node `12:320433`)
- `CHAPTER · Конструктор · 3 · Характер · десктоп` (1440×1284px, node `12:319726`)
- `CHAPTER · Конструктор · 3 · Характер · мобильный` (390×1281px, node `12:319869`)
- `CHAPTER · Конструктор · 2 · Внешность · мобильный` (390×1384px, node `12:319336`)
- `CHAPTER · Конструктор · 2 · Внешность · десктоп` (1440×1411px, node `12:319199`)
- `CHAPTER · Конструктор · 1 · Образ · мобильный` (390×1261px, node `12:318755`)
- `CHAPTER · Конструктор · 1 · Образ · десктоп` (1440×1264px, node `12:318564`)

View File

@ -0,0 +1,292 @@
{
"source_url": "https://www.figma.com/design/KBYFGreBmq4OqDidZ5QwLm/%D0%9C%D0%B5%D0%B6%D0%B4%D1%83?node-id=12-312729&t=rTTZSAPTuuE8Ofkx-1",
"file_key": "KBYFGreBmq4OqDidZ5QwLm",
"node_id": "12:312729",
"document_name": "Между",
"colors": [
"#3E392C",
"#FFFFFF",
"#B9C0D0",
"#DFDDD7",
"#F6F7F2",
"#24211D",
"#686158",
"#FFFDFA",
"#793C49",
"#1C2030"
],
"fonts": [
"Inter",
"Manrope",
"Cormorant Garamond",
"Poppins",
"Arial"
],
"border_radius": "4px - 8px",
"layout_mode": "Desktop 1440px (232px Left Sidebar + 48px Content Padding) / Mobile 390px",
"screens": [
{
"id": "12:322663",
"name": "CHAPTER · Личное · десктоп",
"width": 1440,
"height": 1327
},
{
"id": "12:322707",
"name": "CHAPTER · Личное · мобильный",
"width": 390,
"height": 1490
},
{
"id": "12:322342",
"name": "CHAPTER · AI видеодиалог · десктоп",
"width": 1440,
"height": 1261
},
{
"id": "12:322376",
"name": "CHAPTER · AI видеодиалог · мобильный",
"width": 390,
"height": 1136
},
{
"id": "12:321943",
"name": "CHAPTER · Диалог с AI · Лев · десктоп",
"width": 1440,
"height": 1235
},
{
"id": "12:322016",
"name": "CHAPTER · Диалог с AI · Лев · мобильный",
"width": 390,
"height": 1437
},
{
"id": "12:321606",
"name": "CHAPTER · Диалоги · десктоп",
"width": 1440,
"height": 1050
},
{
"id": "12:321648",
"name": "CHAPTER · Диалоги · мобильный",
"width": 390,
"height": 1008
},
{
"id": "12:321283",
"name": "CHAPTER · Мои AI · десктоп",
"width": 1440,
"height": 1418
},
{
"id": "12:321318",
"name": "CHAPTER · Мои AI · мобильный",
"width": 390,
"height": 1491
},
{
"id": "12:320942",
"name": "CHAPTER · Конструктор · 5 · Проверка · мобильный",
"width": 390,
"height": 1447
},
{
"id": "12:320854",
"name": "CHAPTER · Конструктор · 5 · Проверка · десктоп",
"width": 1440,
"height": 1462
},
{
"id": "12:320265",
"name": "CHAPTER · Конструктор · 4 · Голос и общение · десктоп",
"width": 1440,
"height": 1198
},
{
"id": "12:320433",
"name": "CHAPTER · Конструктор · 4 · Голос и общение · мобильный",
"width": 390,
"height": 1240
},
{
"id": "12:319726",
"name": "CHAPTER · Конструктор · 3 · Характер · десктоп",
"width": 1440,
"height": 1284
},
{
"id": "12:319869",
"name": "CHAPTER · Конструктор · 3 · Характер · мобильный",
"width": 390,
"height": 1281
},
{
"id": "12:319336",
"name": "CHAPTER · Конструктор · 2 · Внешность · мобильный",
"width": 390,
"height": 1384
},
{
"id": "12:319199",
"name": "CHAPTER · Конструктор · 2 · Внешность · десктоп",
"width": 1440,
"height": 1411
},
{
"id": "12:318755",
"name": "CHAPTER · Конструктор · 1 · Образ · мобильный",
"width": 390,
"height": 1261
},
{
"id": "12:318564",
"name": "CHAPTER · Конструктор · 1 · Образ · десктоп",
"width": 1440,
"height": 1264
},
{
"id": "12:318274",
"name": "CHAPTER · Профиль AI · Лев · мобильный",
"width": 390,
"height": 1433
},
{
"id": "12:318237",
"name": "CHAPTER · Профиль AI · Лев · десктоп",
"width": 1440,
"height": 1050
},
{
"id": "12:317944",
"name": "CHAPTER · AI герои · мобильный",
"width": 390,
"height": 2091
},
{
"id": "12:317904",
"name": "CHAPTER · AI герои · десктоп",
"width": 1440,
"height": 1423
},
{
"id": "12:317745",
"name": "CHAPTER · Обзор и спецификация",
"width": 1440,
"height": 4234
},
{
"id": "12:317425",
"name": "CHAPTER · Полная история · видео закрыто · мобильный · 320 px",
"width": 320,
"height": 5117
},
{
"id": "12:317414",
"name": "CHAPTER · Раскрытое меню · 320 px",
"width": 320,
"height": 1173
},
{
"id": "12:317402",
"name": "CHAPTER · Раскрытое меню · 390 px",
"width": 390,
"height": 1154
},
{
"id": "12:316943",
"name": "CHAPTER · Доска статических состояний · мобильный",
"width": 390,
"height": 9430
},
{
"id": "12:316744",
"name": "CHAPTER · Доска статических состояний · десктоп",
"width": 1440,
"height": 6881
}
],
"sample_texts": [
"между.",
"CHAPTER / ЖУРНАЛ 18+",
"Главная\nИстории\nВидео по историям\nПродолжить чтение\nИзбранное\n\nДРУГОЙ ФОРМАТ · AI\nAI герои\nДиалоги\nМои AI\nСоздать героя\n• Личное\n\nПодписка\nАнна · Аккаунт\nНастройки\nПомощь",
"Только для взрослых 18+\nИстории о чувствах и близости.",
"Личное",
"Поиск по журналу",
"⌘ K",
"СОХРАНЕНО ИЗ ВАШИХ ДИАЛОГОВ",
"Маленькие вещи,\nкоторые остаются.",
"Ваши материалы из собственных AI-диалогов. Не избранные истории, не просмотренные видео и не личные версии героев.",
"Видно только вам",
"Сохранённые фрагменты не публикуются. Не добавляйте чужие персональные данные. В этом макете сохранение и удаление не выполняются.",
"ФРАГМЕНТ РАЗГОВОРА",
"Несколько минут для себя",
"«Можно сохранить это ощущение без фотографии: свет, вечер и несколько минут, которые принадлежат только тебе».",
"Лев · моя версия / Сегодня, 19:42",
"К исходному диалогу",
"Удалить",
"ЗАМЕТКА ИЗ ДИАЛОГА",
"Слова без перевода",
"«У некоторых слов нет перевода — только настроение».",
"Инга, 32 · AI / Вчера, 21:10",
"v1.0",
"Badge-sm",
"Htmlstream",
"Marketing",
"18+",
"Log in",
"Sign up",
"Главная\nИстории\nВидео по историям\nПродолжить чтение\nИзбранное\n\nДРУГОЙ ФОРМАТ · AI\nAI герои\n• Диалоги\nМои AI\nСоздать героя\nЛичное\n\nПодписка\nАнна · Аккаунт\nНастройки\nПомощь",
"Диалоги / AI аватар",
"AI АВАТАР / ЛОКАЛЬНАЯ ИМИТАЦИЯ",
"Лев · AI аватар",
"Это AI видеодиалог, не записанная экранизация рассказа.",
"AI аватар · 36 лет",
"«Что ты заметила первым?»",
"Без камеры и микрофона",
"Локальная симуляция, показанная статическим кадром. Доступ к устройствам не запрашивается. Звук, видео и соединение не запускаются.",
"Текстовый ввод",
"Вернуться в диалог",
"Возврат в ту же переписку с «Лев · моя версия». Подписка на экранизации не является доступом к этому формату.",
"Диалоги / Лев",
"Лев · моя версия",
"36 лет · AI собеседник",
"AI, не человек и не персонаж истории",
"Отдельный личный разговор. Сообщения ниже — статический пример, не сгенерированные ответы в реальном времени.",
"СЕГОДНЯ / 19:42",
"Сегодня я прошла домой другой дорогой. Город будто оказался совсем новым.",
"Лев · AI",
"Иногда достаточно свернуть на одну улицу раньше. Что ты заметила первым?",
"Тёплый свет в окне мастерской. И что совсем не хочется спешить.",
"Можно сохранить это ощущение без фотографии: свет, вечер и несколько минут, которые принадлежат только тебе.",
"Сохранить в «Личное»",
"Ваше сообщение · неактивный макет",
"Label",
"Secondary",
"Email",
"Badge",
"Написать сообщение…",
"Copy",
"This is a feedback message",
"Отправить",
"AI видеодиалог",
"Не вводите персональные данные. Камера и микрофон не используются. AI может ошибаться.",
"Диалоги",
"ЛИЧНЫЕ РАЗГОВОРЫ / AI",
"Разговор можно\nпродолжить.",
"Переписки с вашими AI собеседниками. Не история чтения и не литературные произведения.",
"«В каком месте города тебе легче дышится?»",
"Сегодня, 19:42",
"Продолжить диалог →",
"Инга, 32 · AI",
"«У некоторых слов нет перевода — только настроение»",
"Вчера, 21:10",
"Приватно по умолчанию",
"Материалы из собственных разговоров можно отдельно сохранить в «Личное». В «Избранное» они не попадают.",
"Главная\nИстории\nВидео по историям\nПродолжить чтение\nИзбранное\n\nДРУГОЙ ФОРМАТ · AI\nAI герои\nДиалоги\n• Мои AI\nСоздать героя\nЛичное\n\nПодписка\nАнна · Аккаунт\nНастройки\nПомощь",
"Мои AI",
"ВАШИ ЛИЧНЫЕ ВЕРСИИ",
"Знакомый образ.\nВаши настройки."
],
"live_api_fetched": true
}

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff