From f575cfb93bbccde5984b02a45e0184496146d055 Mon Sep 17 00:00:00 2001
From: Bryan Van Deusen <bryan.vandeusen@fabledsword.com>
Date: Mon, 1 Jun 2026 20:57:41 -0400
Subject: [PATCH] ux(failing-sources): visible row separators + clearer hover
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The zebra striping in 717b601 was too subtle — inside the tonal error
card, surface-tint contrast washed out and rows still looked uniform.
Operator-flagged the same issue twice.

Replace the surface-tint approach with hard visual structure:
- Bottom border on each row (1px white/0.08) — clearly delineated rows
  regardless of card background
- Hover darkens to black/0.25 — much more obvious than the previous
  error-tint hover, gives the eye a clear horizontal track
- Slightly more vertical padding (8px vs 6px) for tap-target comfort
- Drop the gap; borders are the separator now
---
 .../subscriptions/FailingSourcesCard.vue      | 24 +++++++++++--------
 1 file changed, 14 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/subscriptions/FailingSourcesCard.vue b/frontend/src/components/subscriptions/FailingSourcesCard.vue
index 5f16154..21d8e3d 100644
--- a/frontend/src/components/subscriptions/FailingSourcesCard.vue
+++ b/frontend/src/components/subscriptions/FailingSourcesCard.vue
@@ -90,24 +90,28 @@ async function onViewLogs(s) {
 .fc-fail__title { font-weight: 600; }
 .fc-fail__body {
   padding: 0 14px 10px;
-  display: flex; flex-direction: column; gap: 3px;
+  display: flex; flex-direction: column;
+  /* Borders, not gap, so the row separators are visible inside the
+   * tonal error card (where surface tints get washed out and gap is
+   * just empty space). */
 }
 .fc-fail__row {
   display: flex; align-items: center; gap: 10px;
-  padding: 6px 8px;
+  padding: 8px 10px;
   border-radius: 4px;
-  background: rgb(var(--v-theme-surface) / 0.4);
-  /* Zebra striping + hover highlight: gives the eye a horizontal track
-   * from the artist name on the left to the Logs/Retry buttons on the
-   * right. Operator-flagged 2026-06-01 — without these, all rows blur
-   * together and it's hard to pick which row a button belongs to. */
+  /* Hover-darken gives the eye a horizontal track from the artist
+   * name on the left to the Logs/Retry buttons on the right.
+   * Bottom border replaces the previous-too-subtle zebra striping —
+   * inside the tonal error card, surface-tint contrast was negligible.
+   * Operator-flagged 2026-06-01 (twice). */
+  border-bottom: 1px solid rgb(255 255 255 / 0.08);
   transition: background 80ms ease;
 }
-.fc-fail__row:nth-child(even) {
-  background: rgb(var(--v-theme-surface) / 0.55);
+.fc-fail__row:last-child {
+  border-bottom: none;
 }
 .fc-fail__row:hover {
-  background: rgb(var(--v-theme-error) / 0.18);
+  background: rgb(0 0 0 / 0.25);
 }
 .fc-fail__artist { font-weight: 600; white-space: nowrap; }
 .fc-fail__count { flex: 0 0 auto; }