Fix search input text color visibility
- Add search-input class to both desktop and mobile search inputs - Set dark text color (#212529) for search input visibility - Add placeholder styling with lighter color (#6c757d) - Compile SCSS to CSS with new search input styles Resolves: White text on white background issue in search fields
This commit is contained in:
parent
04a9406f14
commit
26f382c41d
@ -8,7 +8,7 @@
|
|||||||
<!-- Desktop search and language -->
|
<!-- Desktop search and language -->
|
||||||
<div class="d-none d-lg-flex ms-auto align-items-center">
|
<div class="d-none d-lg-flex ms-auto align-items-center">
|
||||||
<form class="d-flex me-3" method="GET" action="">
|
<form class="d-flex me-3" method="GET" action="">
|
||||||
<input class="form-control me-2" type="search" name="search" placeholder="{{t_search_placeholder}}" value="{{search_query}}">
|
<input class="form-control me-2 search-input" type="search" name="search" placeholder="{{t_search_placeholder}}" value="{{search_query}}">
|
||||||
<button class="btn btn-outline-light" type="submit">{{t_search_button}}</button>
|
<button class="btn btn-outline-light" type="submit">{{t_search_button}}</button>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
@ -43,7 +43,7 @@
|
|||||||
<div class="collapse navbar-collapse d-lg-none" id="mobileSearch">
|
<div class="collapse navbar-collapse d-lg-none" id="mobileSearch">
|
||||||
<div class="container-fluid px-0">
|
<div class="container-fluid px-0">
|
||||||
<form class="d-flex px-3 pb-3" method="GET" action="">
|
<form class="d-flex px-3 pb-3" method="GET" action="">
|
||||||
<input class="form-control me-2" type="search" name="search" placeholder="{{t_search_placeholder}}" value="{{search_query}}">
|
<input class="form-control me-2 search-input" type="search" name="search" placeholder="{{t_search_placeholder}}" value="{{search_query}}">
|
||||||
<button class="btn btn-outline-light" type="submit">{{t_search_button}}</button>
|
<button class="btn btn-outline-light" type="submit">{{t_search_button}}</button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -271,6 +271,15 @@ footer {
|
|||||||
max-width: 300px;
|
max-width: 300px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Search input text color */
|
||||||
|
.search-input {
|
||||||
|
color: #212529 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-input::placeholder {
|
||||||
|
color: #6c757d !important;
|
||||||
|
}
|
||||||
|
|
||||||
/* Card styling */
|
/* Card styling */
|
||||||
.card-title a {
|
.card-title a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user