Классика 5 колонок
Дерево | rail | flyout | workspace | actions. Крошки и заголовок в workspace, свойства над редактором.
Открыть25 интерактивных прототипов раскладки всего интерфейса: дерево нод, 6 групп режимов (Основное · Навигация · Память · Медиа · Вложения · Автоматизация), flyout подрежимов, хлебные крошки, редактирование заметки и форма свойств.
Запуск: cd Examples3 && python3 -m http.server 8767 →
http://localhost:8767
· Перегенерация: node generate.mjs
Дерево | rail | flyout | workspace | actions. Крошки и заголовок в workspace, свойства над редактором.
ОткрытьКрошки и название span-ят rail+flyout+workspace — как в текущем Agent CMS.
Открыть6 групп режимов — вертикальные вкладки внутри левой колонки, flyout+workspace справа.
Открыть6 групп как горизонтальные вкладки под шапкой приложения. Flyout скрыт — подрежимы вторым рядом.
ОткрытьРедактор в центре, форма свойств — узкая колонка между workspace и actions.
ОткрытьФорма полей (макет 15) между заголовком и содержимым — основной рабочий поток.
ОткрытьСвойства слева, редактор справа — видно оба блока одновременно.
ОткрытьСодержимое | Свойства | Превью — переключение вместо одновременного показа.
ОткрытьСвойства свёрнуты по умолчанию — экономия места для длинных заметок.
ОткрытьDrawer с формой свойств выезжает снизу workspace по кнопке.
ОткрытьТолько icon-rail; flyout всплывает поверх workspace при наведении на группу.
ОткрытьIcon-rail расширен: иконка + короткая подпись группы режима.
ОткрытьКлик по rail открывает большую панель со всеми 6 группами и подрежимами.
ОткрытьРяд 1: крошки на всю ширину контента. Ряд 2: rail+flyout+editor. Заголовок внутри editor.
ОткрытьКрошки + название + свойства sticky; прокручивается только редактор.
ОткрытьКрошки сворачиваются в «05 Хобби / … / файл.md» + dropdown полного пути.
ОткрытьКрупный заголовок, свойства inline-полями, крошки мелко над заголовком, без правой панели.
ОткрытьДерево | editor | свойства+actions справа. Rail/flyout — status bar внизу.
ОткрытьКрошки снаружи; заметка + свойства в белой карточке по центру workspace.
ОткрытьChrome появляется при hover: rail, крошки, свойства — минимум отвлечений.
ОткрытьВсе зоны друг под другом — удобно для узких экранов и планшетов.
ОткрытьFlyout всегда открыт слева от workspace; actions — sticky справа; центр — editor+props.
ОткрытьГруппа «Память › Внешняя» + flyout-переключатели inline в одной строке с крошками.
ОткрытьЧёткое деление: Навигация | Режимы | Документ | Операции — с подписями зон.
ОткрытьСборка лучших решений: full-width крошки+title, form-props, rail+flyout, actions справа.
Открыть