More tweaks to css..

delegating search-bar style to .css
This commit is contained in:
Alexandar Mechev 2020-10-18 12:39:01 +02:00
parent c0bf85902f
commit 72a006ccfb
No known key found for this signature in database
GPG Key ID: 1B754EA636091772
5 changed files with 80 additions and 11 deletions

View File

@ -25,6 +25,21 @@
border-bottom: 1px solid #242424;
}
body.dark * div#search-bar-autocomplete-list div{
padding: 10px;
cursor: pointer;
color: #ECEFF4 !important;
background-color: #3B4252 !important;
border-bottom: 1px solid #fff;
}
body.dark * div#search-bar-autocomplete-list div:hover {
background-color: #4C566A !important;
color: #ECEFF4 !important;
}
.autocomplete-items div:hover {
background-color: #4C566A !important;
color: #ECEFF4 !important;

View File

@ -25,6 +25,10 @@ a:visited h3 div {
color: #A3BE8C !important;
}
body.dark * a:visited h3 div{
color: #A3BE8C !important;
}
a:link h3 div {
color: #4C566A
}
@ -33,12 +37,12 @@ a:link div {
color: #81a1c1 !important;
}
div span {
color: #3B4252;
div span.dark {
color: #f9fafb !important;
}
div span.dark {
color: #f9fafb;
div span {
color: #3B4252;
}
input {
@ -46,8 +50,22 @@ input {
color: #3B4252 !important;
}
body.dark * input {
background-color: #4C566A !important;
color: #f9fafb !important;
}
body.dark * #search-bar {
width: 100%;
border: 1px solid #e9e9e9;
color: #f9fafb;
background-color: #4C566A;
}
#search-bar {
color: #4C566A !important;
color: #4C566A;
background-color: #ffffff ;
}

View File

@ -24,6 +24,24 @@
border-bottom: 1px solid #d4d4d4;
}
body.dark * div#search-bar-autocomplete-list div{
padding: 10px;
cursor: pointer;
color: #ddd;
background-color: #000;
border-bottom: 1px solid #fff;
}
body.dark * div#search-bar-autocomplete-list div:hover {
background-color: #222;
}
body.dark * #search-bar {
width: 100%;
border: 3px solid #e9e9e9;
color: #fff;
}
.autocomplete-items div:hover {
background-color: #e9e9e9;
}

View File

@ -1,4 +1,26 @@
html.dark {
background-color: #222 !important;
}
body.dark {
background-color: #222 !important;
}
body.dark>#search-bar-autocomplete-list div{
padding: 10px;
cursor: pointer;
color: #ddd;
background-color: #000;
border-bottom: 1px solid #fff;
}
.reskin {
background-color: #fff;
color: #333;
}
.reskin-dark {
background-color: #000;
color: #fff;
}

View File

@ -12,9 +12,7 @@
<div class="H0PQec" style="width: 100%;">
<div class="sbc esbc autocomplete">
<input id="search-bar" autocapitalize="none" autocomplete="off" class="noHIxc" name="q"
style="background-color: {{ '#000' if dark_mode else '#fff' }};
color: {{ '#292E39' if dark_mode else '#000' }};
border: {{ '1px solid #685e79' if dark_mode else '' }}"
style=border: {{ '1px solid #685e79' if dark_mode else '' }}"
spellcheck="false" type="text" value="{{ query }}">
<input name="tbm" value="{{ search_type }}" style="display: none">
<div class="sc"></div>
@ -38,9 +36,7 @@
<div style="width: 100%; display: flex">
<input id="search-bar" autocapitalize="none" autocomplete="off" class="noHIxc" name="q"
spellcheck="false" type="text" value="{{ query }}"
style="background-color: {{ '#000' if dark_mode else '#fff' }};
color: {{ '#685e79' if dark_mode else '#000' }};
border: {{ '1px solid #685e79' if dark_mode else '' }}">
style="border: {{ '1px solid #685e79' if dark_mode else '' }}">
<input name="tbm" value="{{ search_type }}" style="display: none">
<div class="sc"></div>
</div>