fix(blog): make .is-hidden global, strip HTML tags from search text, add role=search
Final-review findings: - .is-hidden was scoped to blog/index.astro, so it didn't match PostRow or YearHead roots (which carry their own component scope hashes). Net effect: the filter visibly only hid the featured article, while all archive rows + year heads stayed on screen. Wrap in :global() so the runtime-toggled class actually fires its display rule everywhere. - buildSearchText regex stripped > but not <, so inline HTML open-tags like <span class="leadin"> leaked into data-search. Add < to the character class so the haystack stays plain text. - Add role="search" landmark to the BlogSearch wrapper so screen-reader users can navigate to it directly. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
75e7859146
commit
d80cd255d4
2 changed files with 5 additions and 3 deletions
|
|
@ -43,7 +43,7 @@ function buildSearchText(post: (typeof posts)[number]): string {
|
|||
return parts
|
||||
.join(" ")
|
||||
.toLowerCase()
|
||||
.replace(/[#*_>`\[\]()]/g, " ")
|
||||
.replace(/[<>#*_`\[\]()]/g, " ")
|
||||
.replace(/\s+/g, " ")
|
||||
.trim();
|
||||
}
|
||||
|
|
@ -265,7 +265,9 @@ for (const post of posts) {
|
|||
.feature .img { order: -1; aspect-ratio: 16 / 9; }
|
||||
}
|
||||
|
||||
.is-hidden { display: none !important; }
|
||||
/* :global so the runtime-toggled class reaches PostRow and YearHead roots,
|
||||
which carry their own component scope hashes — not this page's. */
|
||||
:global(.is-hidden) { display: none !important; }
|
||||
|
||||
.empty {
|
||||
font-family: var(--font-mono);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue