макеты · не панель

SelfPost — полное обновление интерфейса

Проект системы — как собирать экраны, чтобы не чинить пустые колонки, высоту полей и ряды кнопок по одному. Каждый экран — отдельная страница, не простыня с якорями. Знак и палитра из листа утверждения не меняются. HTML в docs/assets/panel-ui/, не вёрстка internal/web.

Система, не рескин

Первый click-through повторил сетку живой панели, поэтому те же сбои чинились по одному. Грамматика задаёт регионы (measure / pair / fill), карточку со слотом справки, field-row (Host и Type одной высоты) и actions-row. Макеты собраны только из этого: один экран — один HTML-файл.

Ширина окна

Сейчас оболочка центрируется, колонка контента упирается в 64rem, формы ещё уже — 48rem. На широком мониторе поля пустые. Растянуть поля на 100% окна нельзя — они становятся нечитаемыми. Две независимые карточки рядом — можно.

Гибрид

Навигация прижата влево. Ops-страницы (Status, Deliveries, очередь, лог, Backup, Settings, DMARC, inbound) занимают остаток до 90rem (~1440px). Backup — полный бэкап ‖ импорт. Settings — учётные данные ‖ DMARC (у domain-admin остаётся одна узкая карточка). Таблица Users — fill. Одиночные формы (подтверждения, форма пользователя) остаются 42rem и выровнены влево. Login и setup — по-прежнему узкий центрированный блок.

сейчас, окно ~1600px
nav 64rem пусто
макет, ops-страница
nav контент до 90rem
макет, форма
nav 42rem поле не растягивает инпуты
На телефоне это не «узкий десктоп». Таблицы из шести колонок складываются в список. Навигация — выезжающая колонка на CSS-checkbox, без обязательного JavaScript (как панели Edit у приложений уже сейчас).

Информационная архитектура

Global administrator

  • Status
  • Domains → domain → delete
  • Deliveries → message
  • Mail queue
  • System log
  • Inbound 1.x — скрыт, пока INBOUND_RELAY_ENABLE выключен
  • DMARC reports candidate
  • Backup, Users, Settings
  • Help candidate — пункт навбара и drawer с карточек Status и страницы домена

Domain-admin

  • Domains (только назначенные) → domain
  • Deliveries → message, включая пояснение retry
  • Settings — только учётные данные панели
  • Help drawer
  • Нет Status, очереди, system log, Backup, Users, inbound, глобального DMARC hub

В прототипе роль, inbound-флаг, ширина и тема переключаются в шапке. contributing и schema-squash экранов не имеют.

Знак и новые иконки

Утверждённый stamp не заменяется. Для узкой шапки телефона предлагается уже существующий SP-значок (фавикон), а не компактный wordmark: на 390px высота важнее, чем прочитать «SelfPost» второй раз.

Полный знак
эталон · login / setup
Компактный знак
колонка навбара
SP
телефон · шапка drawer

Иконки новых пунктов

Тот же штрих 1.5, что у Status / Domains. Не пиктограммы-эмодзи и не заливка.

Inbound
DMARC
Help

Экраны

Система

Вход

Текущая панель

Roadmap

Аварийный телефон

Как смотреть

Откройте любой экран из списка — это отдельная страница, не якорь в одном файле. Шапка прототипа — не часть панели: роль, Desktop/Phone, inbound, светлая/тёмная. Копирайт экранов английский, как в продукте. Drawer Help открывается с «?» на Status или с карточек домена; на карточках остаются показания и колонка Detail.

После утверждения макетов вёрстка panel.css и шаблонов — отдельная задача. CSP и progressive enhancement в этом HTML не воспроизводятся один в один: здесь допустимы вещи, которые в панели останутся в файле стилей.