Group Back-to-project and Manage together, styled alike

Moves the back link from the far left to sit immediately left of the
Manage button (both now top right, in a new .project-head__actions
row), and switches it from .btn-secondary to .menu__toggle so the two
are visually identical rather than just similar.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-04 20:58:13 +01:00
co-authored by Claude Sonnet 5
parent 89a95f1885
commit c5ffdae2cd
3 changed files with 18 additions and 9 deletions
+4 -3
View File
@@ -134,9 +134,10 @@ side of the move.
## Project configuration ## Project configuration
`/projects/:id/configure` (`ProjectConfigureView.vue`) manages a project's `/projects/:id/configure` (`ProjectConfigureView.vue`) manages a project's
statuses. The header mirrors the project view's — title, `ProjectManageMenu` statuses. The header mirrors the project view's — title, then a
top right — plus a "← Back to project" link (Manage's own Configure link is "← Back to project" link and `ProjectManageMenu` together, top right, styled
hidden here, since it would just point at the current page). alike (both `.menu__toggle`) (Manage's own Configure link is hidden here,
since it would just point at the current page).
The status list is a `vuedraggable` list (its own list, no shared drag group The status list is a `vuedraggable` list (its own list, no shared drag group
with the kanban board) bound directly to a local `statuses` ref; dragging with the kanban board) bound directly to a local `statuses` ref; dragging
+7 -1
View File
@@ -598,10 +598,16 @@ h1 {
background: var(--bg); background: var(--bg);
} }
.project-head__actions {
display: flex;
align-items: center;
gap: 0.5rem;
flex: none;
}
.project-head__back { .project-head__back {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
flex: none;
text-decoration: none; text-decoration: none;
} }
+7 -5
View File
@@ -150,13 +150,15 @@ onBeforeUnmount(() => window.removeEventListener('keydown', onKeydown))
<template v-else-if="project"> <template v-else-if="project">
<div class="project-head"> <div class="project-head">
<RouterLink :to="{ name: 'project', params: { id: projectId } }" class="btn-secondary project-head__back">
&larr; Back to project
</RouterLink>
<h1 class="project-head__title">{{ project.title }}</h1> <h1 class="project-head__title">{{ project.title }}</h1>
<ProjectManageMenu :project-id="projectId" :project-title="project.title" :card-count="project.card_count" /> <div class="project-head__actions">
<RouterLink :to="{ name: 'project', params: { id: projectId } }" class="menu__toggle project-head__back">
&larr; Back to project
</RouterLink>
<ProjectManageMenu :project-id="projectId" :project-title="project.title" :card-count="project.card_count" />
</div>
</div> </div>
<section class="config-section"> <section class="config-section">