Internal · v1.0 · октябрь 2026

Одна система для всех внутренних продуктов

Токены, компоненты и правила, из которых собираются наши рабочие инструменты. Основа — «План отзывов», бренд — Pepper Reputation.

React + CSS, без UI-библиотек Десктоп в первую очередь Русский язык · дд.мм.гггг

01 · Бренд

Логотип, цвета, шрифты

В продукте бренд — это только знак в сайдбаре и экран входа. Всё остальное работает на данные. Полные правила — в брендбуке.

План отзывов

Знак + название продуктаВ сайдбаре — знак 32 px и название продукта 13/800. Полный логотип — только на экране входа.

Цвета бренда

Pepper Green#51B37F

Forest#012813

Ink#111219

Paper#F8F7F4

Pepper Green в интерфейсе — это знак и оценка «5». Для кнопок и ссылок есть более тёмный action-600 (см. токены).

Шрифты

Aa Бб 192 Plus Jakarta Sans Интерфейс и сайт · 400 / 500 / 700 / 800

03.02 · 14:20 JetBrains Mono Коды, ключи API, ID публикаций

Oswald и Jost — только для презентаций и печати, в продуктах их нет.

02 · Токены

Роль важнее оттенка

У каждого цвета одна работа. Зелёный — факт и действие, а не украшение навигации. Все значения есть в pepper-tokens.css.

Текст и поверхности

--ink-900заголовки

#17251D

--ink-700основной текст

#33453A

--ink-500вторичный текст

#5B6D62

--ink-400предел для текста

#6F8177

--surface-pageфон приложения

#F4F7F4

--surface-sunkenшапки таблиц, группы

#EEF2EF

--lineразделители

#E2E7E3

Действие

--action-600primary, ссылки, факт

#157A4E

--action-700hover, текст на success

#0F5F3C

Подсветка сетки

--grid-todayтёплый

--grid-weekendхолодный

--grid-groupнейтральный

Оценки · только внутри бейджа

Состояния · заливка / кант / текст / акцент

Success

#E3F3E8 · #8CC9A4
#0F5F3C · #157A4E

Warning

#FBF1DE · #E3C281
#A8730F · #D9971F

Danger

#FBEAE7 · #E8B3A8
#B4372A · #D0452F

Info

#E9F1F8 · #A9C7E0
#2B6597 · #4B86BD

Типографика интерфейса · минимум 11 px

h1 · 32/800 −2%План по отзывам

h2 · 22/700 −1%Casinova WW

h3 · 15/700Заголовок блока

body · 13/500Значения полей, строки таблиц, тело панелей.

small · 12/500Подписи полей, метаданные строки.

label · 11/700 +8%Шапка колонки

Шаг, радиусы, тени

4 · 8 · 12 · 16 · 24 · 32 · 48

6бейдж

8контрол

10панель

14карточка

card0 1 2 / 6%

popover0 12 32 / 14%

03 · Компоненты

Базовые контролы

Высота кнопки 36 px, поля 38 px, фильтра 32 px. Цель клика — не меньше 24 px.

КнопкиОдин primary на экран

Отправить авторам · 47

Назначить авторов

Применить

Архивировать

Снять выбор

primarysecondarydisableddangertexticon

Поля

Дата

03.02.2026

Формат дд.мм.гггг, а не локаль браузера

Профайл · фокус

Casinova

Доля гео · ошибка

90%

Сумма долей гео должна быть 100%

Выбор

Автор

Настя

Оценка

отлично

✓

Выбрано

Не выбрано

Часть

Фильтры и переключатель

Гео: DE×

Все партнёры

С задачами ✓

Компактно

Подробно

Активный фильтр показывает значение и крестик сброса. Фильтры и переключатели — не кнопки.

Бейджи статуса

В плане

Отправлена

Опубликована

Без автора

Строка потеряна

В архиве

Один язык статусов для плана, карточки, справочников и отчётов.

Тост

✓

Назначено 47 задач восьми авторам Отменить

Снизу по центру области контента, 6 секунд. Массовые действия всегда можно отменить.

Уведомления

✓

Публикация подтверждена. Скрин пришёл из таблицы автора 03.02.2026 в 14:20.

Открыть скрин

У 12 задач недели нет автора — распределение их пропустит.

Показать

Строки задачи нет в таблице авторов дольше трёх минут.

Отправить авторам

История добавляет две колонки: план и факт прошлой недели.

Уведомление сообщает и ничего не меняет. Всё, что меняет данные, выглядит как контрол.

Таблица данныхСтрока 44 px · действия строки на ховере

Выбрано 1

Изменить статус

Применить

Снять выбор

Название ↑

Партнёр

Гео

Статус

✓

Best Casino 2026 DE

KNG Partners

Активен

Fonbet Deutschland DE

KNG Partners

Пауза

Casinova WW

Эксперименты

В архиве

04 · Паттерны

Как собираются экраны

Экраны неглубокие: сайдбар, шапка страницы и рабочая область. Всё редактирование — в панели справа.

План отзывовPepper Reputation

План

Справочники

Подсчёт авторов

Таблица авторов

План по отзывамKNG Partners · 37 профайлов · 03.02 — 09.02.2026

Факт / план

192/ 251

76%

Всего в плане251

Опубликовано192

Осталось59

Каркас и дашбордАктивный пункт меню — нейтральная заливка. Счётчик везде одинаковый: сначала факт, потом план, потом полоса.

Опубликована

03.02.2026

Casinova WW

Дата

03.02.2026

Автор

Настя

Комментарий

Что важно учесть в этой задаче

✓

Выполнена — факт публикации

Архивировать задачу

Отмена

Сохранить

Форма в панели (drawer)Шапка: статус + дата, под ними имя. Поля парами по смыслу, 16 px между группами. Опасное действие — над футером. Primary справа.