Replace site-search BEM classes with semantic header form[role="search"] selectors

CSS: .site-search → header form[role="search"],
     .site-search__icon → header form[role="search"] svg,
     .site-search__input → header form[role="search"] input,
     .site-search__input::placeholder → header form[role="search"] input::placeholder

HTML: Removed class="site-search", class="site-search__icon", and
class="site-search__input" from header.php and search-bar.php.
The form already uses role="search" and contains a single svg + input,
so the semantic selectors are unambiguous.
This commit is contained in:
Pontoporeia
2026-04-01 12:40:52 +02:00
parent 92a07d0b99
commit a5ee9b162f
4 changed files with 12 additions and 14 deletions

View File

@@ -114,7 +114,7 @@ header nav ul a[aria-current="page"] {
/* ============================================================
SEARCH BAR (shared)
============================================================ */
.site-search {
header form[role="search"] {
display: flex;
align-items: center;
gap: 0.5rem;
@@ -126,7 +126,7 @@ header nav ul a[aria-current="page"] {
color: #9557b5;
}
.site-search__icon {
header form[role="search"] svg {
color: var(--text-muted);
flex-shrink: 0;
width: 16px;
@@ -134,7 +134,7 @@ header nav ul a[aria-current="page"] {
stroke: #9557b5;
}
.site-search__input {
header form[role="search"] input {
flex: 1;
border: none;
font-size: 0.95rem;
@@ -144,7 +144,7 @@ header nav ul a[aria-current="page"] {
font-family: inherit;
}
.site-search__input::placeholder {
header form[role="search"] input::placeholder {
color: #9557b5;
}