From 7b92d1386379dd58e99c9d6a7f7834dea648692c Mon Sep 17 00:00:00 2001
From: Bryan Van Deusen <bryan.vandeusen@fabledsword.com>
Date: Thu, 19 Feb 2026 17:22:31 -0500
Subject: [PATCH] Make Back and Edit navigation consistently styled as bordered
 buttons
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Previously .btn-back and .btn-edit in editor/viewer toolbars were plain
primary-colored links while all other toolbar actions were proper buttons.
All four views now use the same bordered button style: subtle border,
secondary text color, hover highlights primary border/text — matching
the existing convert/assist-toggle button aesthetic.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/views/NoteEditorView.vue | 12 ++++++++++++
 frontend/src/views/NoteViewerView.vue | 13 +++++++++++++
 frontend/src/views/TaskEditorView.vue | 12 ++++++++++++
 frontend/src/views/TaskViewerView.vue | 13 +++++++++++++
 4 files changed, 50 insertions(+)

diff --git a/frontend/src/views/NoteEditorView.vue b/frontend/src/views/NoteEditorView.vue
index 507c4ac..41bae00 100644
--- a/frontend/src/views/NoteEditorView.vue
+++ b/frontend/src/views/NoteEditorView.vue
@@ -476,7 +476,19 @@ onUnmounted(() => window.removeEventListener("beforeunload", onBeforeUnload));
   align-items: center;
 }
 .btn-back {
+  display: inline-flex;
+  align-items: center;
+  padding: 0.45rem 1rem;
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-sm);
+  background: none;
+  color: var(--color-text-secondary);
   text-decoration: none;
+  cursor: pointer;
+  font-size: 0.9rem;
+}
+.btn-back:hover {
+  border-color: var(--color-primary);
   color: var(--color-primary);
 }
 .btn-save {
diff --git a/frontend/src/views/NoteViewerView.vue b/frontend/src/views/NoteViewerView.vue
index 11eb71a..12c34c6 100644
--- a/frontend/src/views/NoteViewerView.vue
+++ b/frontend/src/views/NoteViewerView.vue
@@ -197,7 +197,20 @@ async function convertToTask() {
 }
 .btn-back,
 .btn-edit {
+  display: inline-flex;
+  align-items: center;
+  padding: 0.45rem 1rem;
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-sm);
+  background: none;
+  color: var(--color-text-secondary);
   text-decoration: none;
+  cursor: pointer;
+  font-size: 0.9rem;
+}
+.btn-back:hover,
+.btn-edit:hover {
+  border-color: var(--color-primary);
   color: var(--color-primary);
 }
 .btn-convert {
diff --git a/frontend/src/views/TaskEditorView.vue b/frontend/src/views/TaskEditorView.vue
index eb2212f..74a5b70 100644
--- a/frontend/src/views/TaskEditorView.vue
+++ b/frontend/src/views/TaskEditorView.vue
@@ -525,7 +525,19 @@ onUnmounted(() => window.removeEventListener("beforeunload", onBeforeUnload));
   align-items: center;
 }
 .btn-back {
+  display: inline-flex;
+  align-items: center;
+  padding: 0.45rem 1rem;
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-sm);
+  background: none;
+  color: var(--color-text-secondary);
   text-decoration: none;
+  cursor: pointer;
+  font-size: 0.9rem;
+}
+.btn-back:hover {
+  border-color: var(--color-primary);
   color: var(--color-primary);
 }
 .btn-save {
diff --git a/frontend/src/views/TaskViewerView.vue b/frontend/src/views/TaskViewerView.vue
index 418688e..436cbb6 100644
--- a/frontend/src/views/TaskViewerView.vue
+++ b/frontend/src/views/TaskViewerView.vue
@@ -227,7 +227,20 @@ function onTagClick(tag: string) {
 }
 .btn-back,
 .btn-edit {
+  display: inline-flex;
+  align-items: center;
+  padding: 0.45rem 1rem;
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-sm);
+  background: none;
+  color: var(--color-text-secondary);
   text-decoration: none;
+  cursor: pointer;
+  font-size: 0.9rem;
+}
+.btn-back:hover,
+.btn-edit:hover {
+  border-color: var(--color-primary);
   color: var(--color-primary);
 }
 .btn-convert {