Production single row
Как сейчас в CMS: select · префикс+крошки · доп.кнопки · просмотр · Сохранить/Удалить — всё в одной строке.
Открыть25 прототипов шапки workspace: как совместить select подрежима, хлебные крошки (служебные / обычные / доменные) и служебные кнопки (Сохранить, Удалить, Просмотр…). В каждом варианте переключатель контекста сверху.
Рекомендация: вариант 25 или 01 — одна строка, как в текущем Agent CMS.
Запуск: cd public/examples/ui-variant-9 && python3 -m http.server 8770 →
http://localhost:8770
· node generate.mjs
Как сейчас в CMS: select · префикс+крошки · доп.кнопки · просмотр · Сохранить/Удалить — всё в одной строке.
ОткрытьСначала select подрежима, затем путь без текстового префикса — домен читается из выпадающего списка.
ОткрытьПрефикс и путь слева, select подрежима сразу после крошек — удобно, если путь важнее режима.
ОткрытьВместо select — горизонтальные chips подрежимов (TODO, .env, Скрипты…) прямо в строке крошек.
ОткрытьДве строки: домен+select сверху, крошки+кнопки снизу. Антипаттерн — для сравнения с однострочным вариантом.
ОткрытьДоменный префix — цветной pill-chip, путь без дублирующего текста «Настройки ноды» в крошках.
ОткрытьТри зоны с вертикальными разделителями: select | крошки | действия — чёткая структура toolbar.
ОткрытьКнопки слеva — спорный, но удобен для частого Save на широких мониторах.
ОткрытьКрошки на всю ширину, Save/Delete спрятаны в меню ⋯ — минимум шума в шапке.
ОткрытьСлужебные кнопки — только иконки 💾⚙🗑, текст в tooltip.
ОткрытьСлужебный файл: только путь + 🔒 + Сохранить, без select и Удалить.
ОткрытьПамять: select · крошки · «Создать воспоминание» · «Создать раздел» · вид · действия.
ОткрытьПереключатель Просмотр/Редактировать/Источник — между крошками и кнопками Save.
ОткрытьSelect | крошки | действия — группы отделены вертикальными линиями.
ОткрытьЛипкая полупрозрачная шапка с blur — крошки остаются видимы при скролле контента.
ОткрытьПлотная шапка: меньше padding и шрифт — больше места редактору.
ОткрытьДлинный путь обрезается ellipsis посередине — select и кнопки всегда видны.
ОткрытьSelect подрежима встроен в nav крошек как сегмент пути — визуально единая цепочка.
ОткрытьСлужебный файл: строка 1 — крошки+Save; строка 2 — крупное имя файла (как docker-compose.yml).
ОткрытьСохранить и Удалить оформлены как последние «крошки» — максимально компактно.
Открытьflex-wrap: элементы переносятся на вторую строку на узком экране вместо overflow.
ОткрытьОбзор ноды: только префix+путь без Save/Delete в шапке — действия в hero-блоке.
ОткрытьСтрока 1 — крошки+Save; строка 2 — chips подрежимов настроек (только для settings).
ОткрытьШапка как отдельная «плита» doc-slab-path — визуально отделена от контента, как в production.
ОткрытьРекомендуемый: одна строка, select слева, префикс inline в крошках, memory-кнопки по контексту.
Открыть