Витамины Магний и В комплекс, 60 таблеток
1194156735 · MG-B-60
Остаток
46 / 1000
Без кошелька
698 ₽ 1,6%
Скидка
30%
Реклама вчера
48,20 BYN
Остаток ниже порогамагний б6 · 7
Витрина MarketLek
Обновлено 16.10.2026 · 43 элемента · CSS ui/monitor.css · иконки Lucide ui/lucide-sprite.svg
1. Токены
Цвета
bg · фон
surface · карточка
accent · действие
hot · горячий
ok · норма
warn · внимание
danger · тревога
text
text-muted
border
Кегли
28 — число крупно, заголовок экрана
22 — заголовок раздела
18 — значение в карточке
16 — основной текст
14 — кнопки, строки таблиц
13 — подписи, бейджи
Отступы
4
8
12
16
24
32
2. Типографика
Заголовки и текст h1 h2 h3 .muted .caption .num
Горячий монитор
Витамины Магний и В комплекс
Цена на витрине
Основной текст. Цена без кошелька вчера была 709 ₽, сегодня 698 ₽.
Приглушённый текст для второстепенного.
Подпись: данные за 14.10
1 558,26 BYN
3. Кнопки
Главная, второстепенная, опасная, тихая .btn .btn--primary .btn--danger .btn--ghost
Одна главная на экран. Опасная — удаление и выключение. Тихая — в строках и панелях.
4. Поля и формы
Поле, число, выбор, ошибка .field .input .select .field--error .hint
Поиск .search
Переключатель и флажок .switch .check
Ключи .chip .chip--add
Поисковые запросы карточки. Добавить — дашевый чип.
магний б6витамины магний
Форма целиком .dialog__body .field
В горячий монитор
5. Строки, списки, таблицы
Строка списка .list .listrow .listrow--danger .listrow--warn
Компактный список карточек: название, подпись, одно-два значения справа.
Заголовок группы .group-title
Внимание · 3
Таблица .table
| Ключ | Рекламная | Органика | Неделю назад |
|---|---|---|---|
| магний б6 | 7 | 23 | 5 |
| витамины магний | — | 41 | 38 |
6. Карточки
Карточка товара в мониторе .card .card--danger .card--warn .kv
Главное по карточке: остаток, цена без кошелька, скидка к цене продавца, ключ, реклама.
Зубная паста 8 в 1, 75 мл
209834117 · ZP-8-75
Остаток
3 412
Без кошелька
412 ₽
Скидка
41%
Реклама вчера
—
Норма
Мини-график .spark
Цена без кошелька, 30 дней
7. Шапка и навигация
Шапка .topbar .brand
Вкладки .tabs .tab
Боковое меню .sidenav
Нижняя навигация на телефоне .bottomnav .fbadge
Пять пунктов, в центре «Поиск» — открывает шторку поиска. Точка на лупе: фильтр включён.
8. Сообщения
Плашки .banner .banner--danger .banner--warn .banner--ok .banner--info .banner--loud
Пустое состояние и загрузка .empty .skeleton
В горячем мониторе пусто
Отметьте карточки в холодном, и тревоги пойдут по ним
9. Бейджи и статусы
Статусы карточки .badge .dot .t-*
НормаОстаток у порогаОстаток ниже порогаВнимание ценаПозиция проселаГорячийБез ключейДанные за 14.10
нормау порогатревога
Иконки состояний с подсказкой .st .st-row [data-tip]
В строке списка вместо текста. Подпись показывается под иконкой при наведении или фокусе; у нижнего края экрана — класс tip-top, над иконкой.
7
Склады и порог .wh .wh--wb .sup-min
Остаток по складам иконками: продавца с человечком, WB фиолетовый с буквами. Порог — индексом сверху у остатка.
46 шт1 0002818683 ₽1 000 ₽ − 30%
Квадратная плитка сводки .sq .sq-row
Число и иконка, подпись в подсказке. Внизу левого меню на компьютере, рядом в строку на телефоне.
51547412
10. Иконки в деле
Lucide, 20px в тексте и кнопках, 16px в бейджах, 28px в пустых состояниях .i .i-s .i-l
Календарь: на какой день смотрим .period-btn .popover--cal .cal__day
В шапке монитора. Свой календарь, не системный: доступны только дни, за которые есть срезы; последний срез обведён, выбранный залит.
октябрь 2026
ПнВтСрЧтПтСбВс
Срезы с 15.09 по 14.10
11. Модальные окна и шторка
Диалог .dialog
Убрать из горячего монитора?
Тревоги по карточке «Витамины Магний и В комплекс» перестанут приходить. Ключи и порог останутся на случай возврата.
Шторка снизу на телефоне .sheet .sheet__handle .scroll-quiet
Подробности карточки по нажатию на строку. Внутри — тихая прокрутка: дорожка прозрачная, ползунок виден при прокрутке.
Витамины Магний и В комплекс
1194156735 · MG-B-60
Остаток
46 шт
порог 1 000
Ключи
магний б6
Реклама вчера
48,20 BYN
Настройки
Шторка поиска на телефоне .msheet .msheet__head .msheet__tags .btn--hit
По кнопке «Поиск» нижнего меню: поле, плитки сводки, список тегов. Enter и крестик закрывают, список под шторкой уже отфильтрован.
176755412
Полоса активного фильтра .mfilter .mfilt .chip--tag
Над нижним меню, пока включён поиск или тег: слово поиска и теги чипами, крестик снимает. Пустая — не видна.
гельГели
12. Шаблоны экранов
Список монитора: шапка → вкладки → плашка состояния → поиск → карточки