zaclys/searxng
1
0
Fork 1
mirror of https://github.com/searxng/searxng synced 2024-01-01 19:24:07 +01:00
Code Issues Projects Releases Packages Wiki Activity

Redo Color Theme and css cleanup

Browse source 
* remove vars and add elements to base and btn vars
* change default border radius to 10px and padding to 0.7em
* put border radius and padding on search input form, infoxbox and buttons
* remove unused .help class in #categories_container
* remove active background from tabs to straemline design
* redo search form: 10px padding
* 2rem margin on search results on desktop
* fix modal pacement of engine reliability in prefs
* use darker accent colors
* streamline autocomplete with more padding and a hover effect
This commit is contained in:
MrPaulBlack 2021-10-06 20:12:51 +02:00
parent 7c2a518d12
commit 740fca00cc
7 changed files with 79 additions and 114 deletions
Download patch file Download diff file Expand all files Collapse all files

39
searx/static/themes/simple/src/less/search.less
View file

@ -5,12 +5,12 @@
#search {
padding: 0 2em 0 @results-offset;
margin: 0;
background: var(--color-header-background);
background: var(--color-header-footer-background);
border-bottom: 1px solid var(--color-base-border);
}
#search_wrapper {
padding: 10px 0;
padding: 20px 0 10px 0;
}
.search_box {
@ -32,8 +32,7 @@
box-sizing: border-box;
width: 1.8em;
margin: 0;
padding: 2px;
height: 2.2em;
padding: 8px 2px;
background: none repeat scroll 0 0 var(--color-search-background);
border-top: 1px solid var(--color-search-border);
border-bottom: 1px solid var(--color-search-border);
@ -46,7 +45,7 @@
z-index: 10000;
&:hover {
color: var(--color-search-border);
color: var(--color-search-background-hover);
}
&.empty * {
@ -60,8 +59,7 @@
border-collapse: separate;
box-sizing: border-box;
margin: 0;
padding: 2px;
height: 2.2em;
padding: 8px;
background: none repeat scroll 0 0 var(--color-search-background);
border: 1px solid var(--color-search-border);
border-radius: 0;
@ -73,10 +71,11 @@
#q {
outline: medium none;
padding-left: 8px;
padding-left: 12px;
padding-right: 0 !important;
border-right: none;
width: @search-width;
border-radius: 10px 0 0 10px;
}
#q::-ms-clear,
@ -86,12 +85,12 @@
#send_search {
border-left: none;
width: 2.2em;
border-radius: 0 10px 10px 0;
&:hover {
cursor: pointer;
background-color: var(--color-search-border);
color: var(--color-base-light);
background-color: var(--color-search-background-hover);
color: var(--color-search-background);
}
}
@ -229,7 +228,6 @@
}
input[type="checkbox"]:checked + label {
background: var(--color-categories-item-selected);
color: var(--color-categories-item-selected-font);
border-bottom: 2px solid var(--color-categories-item-border-selected);
}
@ -237,21 +235,4 @@
#categories_container {
position: relative;
.help {
position: absolute;
width: 100%;
bottom: -20px;
overflow: hidden;
opacity: 0;
transition: opacity 1s ease;
font-size: 0.8em;
text-align: center;
background: var(--color-search-help);
}
&:hover .help {
opacity: 0.8;
transition: opacity 1s ease;
}
}