fix: search bar icon/placeholder overlap caused by specificity conflict

The base input rule uses a high-specificity :not() chain (0,8,1) that
overpowered .header-search-input-wrap input (0,1,1). The base padding
won, so the search input's padding-left (which makes room for the icon)
was overridden. Switched to #site-search-input (1,0,0) to win the
specificity battle.
This commit is contained in:
Pontoporeia
2026-07-05 15:00:47 +02:00
parent 10df92b643
commit 148ffe79f0
2 changed files with 7 additions and 2 deletions
+2 -2
View File
@@ -47,7 +47,7 @@ form[role="search"]:not(.header-search-form) {
pointer-events: none; pointer-events: none;
} }
.header-search-input-wrap input { #site-search-input {
width: 100%; width: 100%;
padding: var(--space-2xs) var(--space-s); padding: var(--space-2xs) var(--space-s);
padding-left: calc(18px + var(--space-l)); padding-left: calc(18px + var(--space-l));
@@ -59,7 +59,7 @@ form[role="search"]:not(.header-search-form) {
font-family: inherit; font-family: inherit;
} }
.header-search-input-wrap input::placeholder { #site-search-input::placeholder {
color: var(--accent-primary); color: var(--accent-primary);
font-family: var(--font-body); font-family: var(--font-body);
font-weight: 300; font-weight: 300;
+5
View File
@@ -138,6 +138,11 @@
max-width: 100%; max-width: 100%;
} }
#apropos-contacts,
#apropos-intro {
border-bottom: none;
}
/* Section separators (about page only) */ /* Section separators (about page only) */
.page-content > article > section { .page-content > article > section {
padding-bottom: var(--space-xl); padding-bottom: var(--space-xl);