web: unify page headers into one shared page-header bar
Nightly Build / build (push) Successful in 7m17s

Every full-page view now renders the same sticky top bar (back button,
title, right-side actions) from the new web/css/page-header.css,
replacing a dozen per-page duplicates (.page-panel-header,
.project-page-header, .task-page-header, .llm-page-header, .um-header,
.apr-header, .llmr-header, .pv-header, .sa-header, .config-page-header,
.agents-page-header). Pages that padded the whole container (config,
agents, system-agents, llm-requests, models-hub) move that padding into
a body wrapper so the bar sits flush and stays pinned on scroll.
Back buttons are standardized to the icon-only .page-header-back.
This commit is contained in:
2026-07-29 12:36:24 +01:00
parent da8a835d70
commit 0ed94225b2
45 changed files with 389 additions and 492 deletions
+6 -6
View File
@@ -246,19 +246,19 @@ export class ProjectBoardSection extends LightElement {
return html`
<div class="project-page">
<div class="project-page-header">
<div style="display:flex;align-items:center;gap:12px">
<button class="btn btn-sm btn-outline-secondary" @click=${() => this._back()}>
<i class="bi bi-arrow-left me-1"></i>${t('project_board.back')}
<div class="page-header">
<div class="page-header-left">
<button class="btn btn-sm btn-outline-secondary page-header-back" title=${t('project_board.back')} @click=${() => this._back()}>
<i class="bi bi-arrow-left"></i>
</button>
<h2 class="project-page-title">
<h2 class="page-header-title">
<i class="bi bi-folder2"></i>${this._project.name}
</h2>
${this._project.is_owner
? html`<span class="badge text-bg-light"><i class="bi bi-person me-1"></i>${t('projects.badge.owned')}</span>`
: html`<span class="badge text-bg-light"><i class="bi bi-people me-1"></i>${t('projects.badge.shared_by', { name: this._project.owner_name })}</span>`}
</div>
<div style="display:flex;gap:0.5rem">
<div class="page-header-actions">
<button class="btn btn-sm btn-outline-primary" @click=${() => this._openChat()}>
<i class="bi bi-chat-dots me-1"></i>${t('project_board.open_chat')}
</button>
+9 -5
View File
@@ -194,11 +194,15 @@ export class ProjectListSection extends LightElement {
render() {
return html`
<div class="project-page">
<div class="project-page-header">
<h2 class="project-page-title"><i class="bi bi-kanban"></i> ${t('projects.title')}</h2>
<button class="btn btn-sm btn-primary" @click=${() => this._openAdd()}>
<i class="bi bi-plus-lg me-1"></i>${t('projects.btn.new')}
</button>
<div class="page-header">
<div class="page-header-left">
<h2 class="page-header-title"><i class="bi bi-kanban"></i> ${t('projects.title')}</h2>
</div>
<div class="page-header-actions">
<button class="btn btn-sm btn-primary" @click=${() => this._openAdd()}>
<i class="bi bi-plus-lg me-1"></i>${t('projects.btn.new')}
</button>
</div>
</div>
${this._error ? html`