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>
This commit is contained in:
@@ -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">
|
||||
|
||||
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user