From 8423759f03ac51bb94d9db154b3ec3aecc5ac6d4 Mon Sep 17 00:00:00 2001
From: Josh Bairstow <joshbairstow@gmail.com>
Date: Tue, 2 Jun 2026 01:25:26 +1000
Subject: [PATCH] fix(blog): drop duplicated hairline and align class names

Code review nits:
- .bsearch border-bottom + .feature border-top rendered a doubled
  hairline; removed the bottom border (feature's top is sufficient).
- Renamed bsearch__input / bsearch__hint to binput / bhint to match
  the project's flat single-class convention (postrow, pdate, yr, ln).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/components/molecules/BlogSearch.astro | 28 +++++++++++------------
 1 file changed, 14 insertions(+), 14 deletions(-)

diff --git a/src/components/molecules/BlogSearch.astro b/src/components/molecules/BlogSearch.astro
index c694e11..3e6763b 100644
--- a/src/components/molecules/BlogSearch.astro
+++ b/src/components/molecules/BlogSearch.astro
@@ -8,29 +8,29 @@
 <div class="bsearch">
   <input
     type="search"
-    class="bsearch__input"
+    class="binput"
     aria-label="Search posts"
     placeholder="Search the journal…"
     autocomplete="off"
     spellcheck="false"
   />
-  <span class="bsearch__hint" aria-hidden="true">Esc to clear</span>
+  <span class="bhint" aria-hidden="true">Esc to clear</span>
 </div>
 
 <style>
+  /* No border-bottom: the adjacent .feature article carries a border-top
+     that already separates this row from the page below. */
   .bsearch {
     display: flex;
     align-items: baseline;
     gap: 14px;
     padding: clamp(14px, 2.4vh, 22px) 0;
     border-top: 1px solid var(--hairline-on-dark);
-    border-bottom: 1px solid var(--hairline-on-dark);
   }
   :global(body:not(.dark)) .bsearch {
     border-top-color: var(--hairline);
-    border-bottom-color: var(--hairline);
   }
-  .bsearch__input {
+  .binput {
     flex: 1;
     max-width: 28ch;
     background: transparent;
@@ -44,19 +44,19 @@
     outline: none;
     transition: border-color var(--dur-base) var(--ease-out);
   }
-  :global(body:not(.dark)) .bsearch__input {
+  :global(body:not(.dark)) .binput {
     color: var(--fg-1);
   }
-  .bsearch__input::placeholder {
+  .binput::placeholder {
     color: var(--fg-on-dark-3);
   }
-  :global(body:not(.dark)) .bsearch__input::placeholder {
+  :global(body:not(.dark)) .binput::placeholder {
     color: var(--fg-3);
   }
-  .bsearch__input:focus {
+  .binput:focus {
     border-bottom-color: var(--accent);
   }
-  .bsearch__hint {
+  .bhint {
     font-family: var(--font-mono);
     font-size: 11px;
     color: var(--fg-on-dark-3);
@@ -64,18 +64,18 @@
     opacity: 0;
     transition: opacity var(--dur-base) var(--ease-out);
   }
-  :global(body:not(.dark)) .bsearch__hint {
+  :global(body:not(.dark)) .bhint {
     color: var(--fg-3);
   }
-  .bsearch:focus-within .bsearch__hint {
+  .bsearch:focus-within .bhint {
     opacity: 1;
   }
 
   @media (max-width: 800px) {
-    .bsearch__input {
+    .binput {
       max-width: none;
     }
-    .bsearch__hint {
+    .bhint {
       display: none;
     }
   }