From 062a87e968e7ba1eac2089049dd476bd7557780b Mon Sep 17 00:00:00 2001
From: Bryan Van Deusen <bryan.vandeusen@fabledsword.com>
Date: Fri, 15 May 2026 23:27:38 -0400
Subject: [PATCH] feat(ui): drop active-link underline + redundant page-title
 headers

---
 frontend/src/components/TopNav.vue  |  6 ++----
 frontend/src/views/GalleryView.vue  |  7 -------
 frontend/src/views/SettingsView.vue | 11 -----------
 frontend/src/views/ShowcaseView.vue |  8 +-------
 frontend/src/views/TagsView.vue     |  6 ------
 5 files changed, 3 insertions(+), 35 deletions(-)

diff --git a/frontend/src/components/TopNav.vue b/frontend/src/components/TopNav.vue
index 60fd0e8..b8c4648 100644
--- a/frontend/src/components/TopNav.vue
+++ b/frontend/src/components/TopNav.vue
@@ -96,7 +96,6 @@ const health = computed(() => {
   text-decoration: none;
   font-weight: 500;
   font-size: 1rem;
-  border-bottom: 2px solid transparent;
   text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
   transition: background 0.2s ease, transform 0.1s ease;
 }
@@ -104,11 +103,10 @@ const health = computed(() => {
   background: rgba(232, 228, 216, 0.12);
   transform: translateY(-1px);
 }
-/* Active route: accent text + thin accent underline (FabledDesignSystem:
-   accent for nav-active, never on action buttons). */
+/* Active route: accent text only (FabledDesignSystem: accent for
+   nav-active, never on action buttons). No underline. */
 .fc-link.router-link-exact-active {
   color: rgb(var(--v-theme-accent));
-  border-bottom-color: rgb(var(--v-theme-accent));
 }
 
 .fc-health {
diff --git a/frontend/src/views/GalleryView.vue b/frontend/src/views/GalleryView.vue
index 32a4488..fe767dc 100644
--- a/frontend/src/views/GalleryView.vue
+++ b/frontend/src/views/GalleryView.vue
@@ -1,6 +1,5 @@
 <template>
   <v-container fluid class="py-6">
-    <h1 class="fc-h1 mb-4">Gallery</h1>
     <div class="fc-gallery-layout">
       <div class="fc-gallery-layout__main">
         <EmptyState v-if="store.isEmpty" />
@@ -63,12 +62,6 @@ function closeImage() {
 </script>
 
 <style scoped>
-.fc-h1 {
-  font-family: 'Fraunces', Georgia, serif;
-  font-size: 32px;
-  font-weight: 500;
-  color: rgb(var(--v-theme-on-surface));
-}
 .fc-gallery-layout {
   display: flex;
   gap: 16px;
diff --git a/frontend/src/views/SettingsView.vue b/frontend/src/views/SettingsView.vue
index df49b72..a9ccab1 100644
--- a/frontend/src/views/SettingsView.vue
+++ b/frontend/src/views/SettingsView.vue
@@ -1,7 +1,5 @@
 <template>
   <v-container class="py-6">
-    <h1 class="fc-h1 mb-6">Settings</h1>
-
     <v-tabs v-model="tab" color="accent" class="mb-4">
       <v-tab value="overview">Overview</v-tab>
       <v-tab value="import">Import</v-tab>
@@ -85,12 +83,3 @@ watch(tab, (t) => {
   }
 })
 </script>
-
-<style scoped>
-.fc-h1 {
-  font-family: 'Fraunces', Georgia, serif;
-  font-size: 32px;
-  font-weight: 500;
-  color: rgb(var(--v-theme-on-surface));
-}
-</style>
diff --git a/frontend/src/views/ShowcaseView.vue b/frontend/src/views/ShowcaseView.vue
index b656cee..4e6a75b 100644
--- a/frontend/src/views/ShowcaseView.vue
+++ b/frontend/src/views/ShowcaseView.vue
@@ -1,7 +1,6 @@
 <template>
   <v-container fluid class="py-6">
     <div class="fc-showcase__head">
-      <h1 class="fc-h1">Showcase</h1>
       <v-btn
         prepend-icon="mdi-shuffle-variant" variant="tonal" color="accent"
         :loading="store.loading" @click="store.shuffle()"
@@ -42,13 +41,8 @@ function openImage(id) {
 </script>
 
 <style scoped>
-.fc-h1 {
-  font-family: 'Fraunces', Georgia, serif;
-  font-size: 32px; font-weight: 500;
-  color: rgb(var(--v-theme-on-surface));
-}
 .fc-showcase__head {
-  display: flex; align-items: center; justify-content: space-between;
+  display: flex; align-items: center; justify-content: flex-end;
   margin-bottom: 16px;
 }
 </style>
diff --git a/frontend/src/views/TagsView.vue b/frontend/src/views/TagsView.vue
index 0e7a73d..c82a018 100644
--- a/frontend/src/views/TagsView.vue
+++ b/frontend/src/views/TagsView.vue
@@ -1,6 +1,5 @@
 <template>
   <v-container fluid class="py-6">
-    <h1 class="fc-h1 mb-4">Tags</h1>
 
     <div class="fc-tags__controls">
       <v-text-field
@@ -77,11 +76,6 @@ function openTag(tagId) {
 </script>
 
 <style scoped>
-.fc-h1 {
-  font-family: 'Fraunces', Georgia, serif;
-  font-size: 32px; font-weight: 500;
-  color: rgb(var(--v-theme-on-surface));
-}
 .fc-tags__controls {
   display: flex; align-items: center; gap: 16px;
   flex-wrap: wrap; margin-bottom: 16px;