Панель дерева — компактные варианты

10 live-примеров, как упростить блок над деревом тем: .sidebar-slab-menu-tools + .sidebar-menu-before-tree. Сейчас в production это ~114px до дерева — много для часто используемой зоны.

Как открыть: http://127.0.0.1:3000/examples/sidebar-menu-tools/ (запустите CMS-сервер).

Серия v2 (восприятие, ещё 10 вариантов): sidebar-menu-tools-v2

01 · Как сейчас

~114px

Два slab: tools + index, затем поиск отдельно.

Открыть

02 · Одна строка

~40px

Поиск и 4 иконки в одной строке, без отдельного slab.

Открыть

03 · Меню ⋯

~36px

Только поиск + overflow для редких действий.

Открыть

04 · Микро-иконки

~64px

Тот же layout, кнопки 24px и плотные отступы.

Открыть

05 · Единый блок

~88px

Tools и поиск в одной белой панели без двойной рамки.

Открыть

06 · Иконки в поиске

~38px

Trailing icons внутри search bar справа.

Открыть

07 · Капсула

~36px

Одна pill: поле поиска + кластер иконок.

Открыть

08 · Свёрнутая полоса

36px → 78px

Жёлтая accent-band «Дерево и поиск», раскрывается по клику.

Открыть

09 · Только поиск

~34px

Chip режима внутри строки + gear для остального.

Открыть

10 · Плотные 2 строки

~62px

Строка 1: view cluster · строка 2: поиск + 3 action.

Открыть