bruno
d4fb095baf
Created a shared _header.html template with: - Hamburger button (toggle sidebar) - Breadcrumb navigation with clickable segments and separators - Page icon + title display - Right-side action buttons (configurable per page) - Dropdown panel CSS for More/New menus Updated all pages to use the unified header: - workspaces.html: Home / Workspaces + login/settings - workspace.html: Workspace — Projects + login/settings - local_workspace.html: workspace name - gitea_workspace.html: Home / owner/repo + New/Upload/Refresh/Settings - page_editor.html: title + Edited/Share/Copy/Favorite/More dropdown - settings.html: Settings Added CSS for breadcrumb, dropdown panel components.
48 lines
1.9 KiB
HTML
48 lines
1.9 KiB
HTML
{# ── Unified Header (Notion-inspired) ──
|
|
Parameters available in calling context:
|
|
breadcrumb_items: list of {label: str, url: str|None} — last item = current page
|
|
page_icon: str — emoji icon
|
|
right_actions: str — raw HTML for right-side action buttons
|
|
hamburger_click: str — Alpine expression for hamburger button (default: opens sidebar)
|
|
hide_hamburger: bool — if truthy, hides the hamburger button
|
|
#}
|
|
<header class="topbar unified-header">
|
|
{% if not hide_hamburger %}
|
|
<button class="hamburger-btn"
|
|
@click="{{ hamburger_click|default('sidebarCollapsed ? (sidebarCollapsed = false) : (mobileSidebarOpen = true, sidebarCollapsed = false)') }}"
|
|
title="Toggle sidebar">
|
|
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<line x1="3" y1="6" x2="21" y2="6"/>
|
|
<line x1="3" y1="12" x2="21" y2="12"/>
|
|
<line x1="3" y1="18" x2="21" y2="18"/>
|
|
</svg>
|
|
</button>
|
|
{% endif %}
|
|
|
|
<div class="topbar-left header-breadcrumb">
|
|
{% if page_icon %}
|
|
<span class="header-page-icon">{{ page_icon }}</span>
|
|
{% endif %}
|
|
|
|
{% if breadcrumb_items %}
|
|
{% for item in breadcrumb_items %}
|
|
{% if item.url and not loop.last %}
|
|
<a href="{{ item.url }}" class="breadcrumb-link">{{ item.label }}</a>
|
|
<span class="breadcrumb-sep">/</span>
|
|
{% elif loop.last %}
|
|
<span class="breadcrumb-current">{{ item.label }}</span>
|
|
{% else %}
|
|
<span class="breadcrumb-link disabled">{{ item.label }}</span>
|
|
<span class="breadcrumb-sep">/</span>
|
|
{% endif %}
|
|
{% endfor %}
|
|
{% else %}
|
|
<span class="breadcrumb-current">{{ page_title|default('FlowDeck') }}</span>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="topbar-right header-actions">
|
|
{{ right_actions|safe if right_actions else '' }}
|
|
</div>
|
|
</header>
|