Dock narzędzi

Narzędzia wzdłuż końca strony, tak jak ma to IDE: pasek ikon, z których każda otwiera strefę w kolumnie obok strony. Pasek po prawej stronie tej strony jest jednym z nich.

Dwie grupy, jedna otwarta w każdej

Ikony na górze paska otwierają swoją strefę w górnej części kolumny, te na jego końcu w dolnej części, jedna otwarta na raz w każdej. Sama strefa zajmuje całą kolumnę; przy braku otwartych stref, kolumna znika. Kolumna jest przeciągana szerzej od swojego początkowego krawędzi, a to, co każde narzędzie miało, powraca z stroną.

Wzdłuż górnej krawędzi

Przy poziomej orientacji, pasek leży wzdłuż góry, a dock jest ciałem strony, zapisanym w stronie--wypełnieniu: to, co otwiera początek paska, stoi obok tego, co otwiera jego koniec, pod nim. Narzędzie narysowane od krawędzi do krawędzi i zajmujące wysokość strefy — edytor — mówi to za pomocą wypełnienia.

Linia 1
Linia 2
Linia 3
Linia 4
Linia 5
Linia 6
Linia 7
Linia 8
Linia 9
Linia 10
Linia 11
Linia 12
Linia 13
Linia 14
Linia 15
Linia 16
Linia 17
Linia 18
Linia 19
Linia 20
Linia 21
Linia 22
Linia 23
Linia 24
Linia 25
Linia 26
Linia 27
Linia 28
Linia 29
Linia 30
Linia 31
Linia 32
Linia 33
Linia 34
Linia 35
Linia 36
Linia 37
Linia 38
Linia 39
Linia 40

Użycie

Strona opisuje swoje narzędzia w bloku page_zones_after, a dock rysuje kolumnę, jej strefy, ich uchwyty i pasek. Narzędzie pokazuje to, co strona narysowała dla niego (zawartość), lub stronę załadowaną po raz pierwszy, gdy się otwiera (url).

{%- block page_zones_after -%}
    {{ tool_dock('board.file', [
        { name: 'outline', label: 'Outline', icon: 'ph:bold/list-bullets', content: outline },
        { name: 'detail', label: 'Detail', icon: 'ph:bold/info', group: 'end', open: true, content: detail },
        { name: 'history', label: 'History', icon: 'ph:bold/clock-counter-clockwise', group: 'end', url: path('app_file_history') },
    ]) }}
{%- endblock -%}