From 5d34ec0433acc7d1604722f43dbd556613adc58d Mon Sep 17 00:00:00 2001
From: John Corser <xss@amazon.com>
Date: Fri, 31 Jul 2026 10:17:04 -0400
Subject: [PATCH] style(list): render list rows as a dense table, not floating
 cards

---
 src/features/board/board.css | 24 ++++++++++++++++++------
 1 file changed, 18 insertions(+), 6 deletions(-)

diff --git a/src/features/board/board.css b/src/features/board/board.css
index 84e2448..013e7f2 100644
--- a/src/features/board/board.css
+++ b/src/features/board/board.css
@@ -303,11 +303,16 @@
 }
 
 li.list-row {
+  /* A List row reads as a dense TABLE row, not a floating card: flush rows with
+   * a hairline divider + hover highlight (Asana-style), NOT the board card's
+   * border/shadow/radius. `.list-section__rows` zeroes the inter-row gap so the
+   * dividers butt together into one ruled table. */
   background: var(--tf-surface);
-  border: 1px solid var(--tf-border);
-  border-radius: var(--tf-radius-sm);
-  box-shadow: var(--tf-shadow);
-  padding: 10px 14px;
+  border: none;
+  border-bottom: 1px solid var(--tf-border);
+  border-radius: 0;
+  box-shadow: none;
+  padding: 8px 14px;
   /* A list row also carries `.task-card` (for shared card styling + testids),
    * whose `display:flex` has equal specificity to `.list-row`'s `display:grid`
    * and was winning by source order — collapsing the grid so cells no longer
@@ -317,6 +322,11 @@ li.list-row {
   grid-template-columns: 44px minmax(0, 1fr) 140px 130px 110px;
   align-items: center;
   gap: 10px;
+  transition: background 0.1s ease;
+}
+
+li.list-row:hover {
+  background: var(--tf-surface-2);
 }
 
 li.list-row.task-card--done .task-card__title {
@@ -354,11 +364,13 @@ li.list-row.task-card--done .task-card__title {
 
 .list-section__rows {
   list-style: none;
-  margin: 8px 0;
+  margin: 0 0 8px;
   padding: 0;
   display: flex;
   flex-direction: column;
-  gap: 8px;
+  /* Flush rows: no gap, so each row's bottom hairline butts against the next to
+   * form one continuous ruled table (the header row supplies the top rule). */
+  gap: 0;
 }
 
 /* Filter/sort controls bar */