From 147701e7dcb4a86cfacfd01af36d728ab6d820d5 Mon Sep 17 00:00:00 2001
From: jay <thejayman77@gmail.com>
Date: Mon, 22 Jun 2026 14:48:04 -0400
Subject: [PATCH] home3 news: summary clickable (->article); drop Read-article
 underline, add divider before Read-more-good-news

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 frontend/src/routes/home3/+page.svelte | 23 +++++++++++++++--------
 1 file changed, 15 insertions(+), 8 deletions(-)

diff --git a/frontend/src/routes/home3/+page.svelte b/frontend/src/routes/home3/+page.svelte
index 2a9e6e1..f4a0228 100644
--- a/frontend/src/routes/home3/+page.svelte
+++ b/frontend/src/routes/home3/+page.svelte
@@ -121,11 +121,14 @@
       <div class="news-body">
         <span class="label" style="color:#0083ad">GOOD NEWS</span>
         <a class="headline-a" href={news?.id ? `/a/${news.id}` : '/'}><h2>{headline}</h2></a>
-        <p class="summary">{news?.summary || "We read the week so you don't have to doomscroll it. Five quietly hopeful stories, summarised to the gist."}</p>
+        <a class="summary-a" href={news?.id ? `/a/${news.id}` : '/'}>
+          <p class="summary">{news?.summary || "We read the week so you don't have to doomscroll it. Five quietly hopeful stories, summarised to the gist."}</p>
+        </a>
         <div class="news-foot">
           <a class="link news-link" href={news?.id ? `/a/${news.id}` : '/'}>Read article</a>
           <span class="meta">3 min read</span>
         </div>
+        <hr class="news-div" />
         <a class="news-more" href="/">Read more good news →</a>
       </div>
     </div>
@@ -331,18 +334,22 @@
     font-size: clamp(1.55rem, 2.6vw, 30px); line-height: 1.14; margin: 12px 0 0;
     display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden;
   }
-  /* the gist FILLS the room available (the card runs tall), fading only at the very bottom */
-  .summary {
-    font-size: 14.5px; line-height: 1.55; color: var(--body); margin: 12px 0 0;
-    flex: 1 1 auto; min-height: 0; overflow: hidden;
+  /* the gist FILLS the room available (the card runs tall), fading only at the very bottom;
+     it's also a link to the article (whole content block clickable) */
+  .summary-a {
+    flex: 1 1 auto; min-height: 0; overflow: hidden; display: block; text-decoration: none; color: inherit;
     -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 2.1em), transparent);
     mask-image: linear-gradient(to bottom, #000 calc(100% - 2.1em), transparent);
   }
+  .summary { font-size: 14.5px; line-height: 1.55; color: var(--body); margin: 12px 0 0; }
   .news-foot { display: flex; align-items: center; justify-content: space-between; padding-top: 18px; }
-  .news-link { color: var(--teal); border-bottom: 2px solid #6fc4d8; text-decoration: none; }
+  .news-link { color: var(--teal); text-decoration: none; }
+  .news-link:hover { text-decoration: underline; }
   .meta { font-size: 12px; color: var(--muted); }
-  /* secondary link: straight to the full brief, without reading the highlighted article */
-  .news-more { display: inline-block; margin-top: 12px; font-size: 13px; font-weight: 600; color: var(--muted); text-decoration: none; }
+  /* divider sets the secondary "feed" link apart as its own thing */
+  .news-div { border: none; border-top: 1px solid var(--news-border); margin: 14px 0 12px; }
+  .news-more { display: inline-block; font-size: 13px; font-weight: 600; color: var(--muted); text-decoration: none; }
+  .news-more:hover { color: var(--teal); }
   .news-more:hover { color: var(--teal); }
 
   /* Daily Art — wide, text left + artwork swatch right */