From aad57424c9a79a0eada46a85dc46cece8eff0714 Mon Sep 17 00:00:00 2001
From: Peptide News Team <ongterence@gmail.com>
Date: Mon, 6 Apr 2026 18:55:22 +0700
Subject: [PATCH] fix: add focus states for keyboard a11y and guard empty
 excerpt

Addresses QA Agent 2 findings:
- Add :focus outline on title and thumbnail links for keyboard navigation
- Wrap excerpt paragraph in conditional to avoid empty <p> when both
  ai_summary and excerpt are missing

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 public/class-peptide-news-public.php | 15 ++++++++-------
 public/css/public-style.css          |  6 ++++++
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/public/class-peptide-news-public.php b/public/class-peptide-news-public.php
index 384205f..88a2bf1 100644
--- a/public/class-peptide-news-public.php
+++ b/public/class-peptide-news-public.php
@@ -130,13 +130,14 @@ class Peptide_News_Public {
                             </a>
                         </h3>
 
-                        <p class="pn-article-excerpt">
-                            <?php
-                            // Prefer AI summary over raw excerpt.
-                            $display_text = ! empty( $article->ai_summary ) ? $article->ai_summary : $article->excerpt;
-                            echo esc_html( $display_text );
-                            ?>
-                        </p>
+                        <?php
+                        // Prefer AI summary over raw excerpt.
+                        $display_text = ! empty( $article->ai_summary ) ? $article->ai_summary : ( $article->excerpt ?? '' );
+                        if ( ! empty( $display_text ) ) : ?>
+                            <p class="pn-article-excerpt">
+                                <?php echo esc_html( $display_text ); ?>
+                            </p>
+                        <?php endif; ?>
 
                         <?php if ( ! empty( $article->author ) ) : ?>
                             <span class="pn-author">
diff --git a/public/css/public-style.css b/public/css/public-style.css
index 737a51e..11fb011 100644
--- a/public/css/public-style.css
+++ b/public/css/public-style.css
@@ -121,6 +121,12 @@
     color: #0073aa;
 }
 
+.pn-article-title a:focus,
+.pn-article-thumb a:focus {
+    outline: 2px solid #0073aa;
+    outline-offset: 2px;
+}
+
 /* ── Excerpt / AI summary ──────────────────────────────────────── */
 .pn-article-excerpt {
     font-size: 0.875rem;