Icycoide/searxng
1
0
Fork 1
mirror of https://github.com/searxng/searxng.git synced 2025-08-03 10:32:21 +02:00
Code Issues Projects Releases Packages Wiki Activity

[enh][mod] results ui refactor

Browse source
This commit is contained in:
Adam Tauber 2014-05-09 01:27:55 +02:00
parent a41c1392f0
commit 47d548d6a2
5 changed files with 86 additions and 78 deletions
Download patch file Download diff file Expand all files Collapse all files

1
searx/static/less/definitions.less
View file

@ -17,6 +17,7 @@
@color-url-font: #1a11be;
@color-url-visited-font: #8E44AD;
@results-width: 50em;
/// Start-Screen

12
searx/static/less/search.less
View file

@ -3,25 +3,25 @@
*/
.search {
background: @color-result-search-background;
padding: 0;
margin: 0;
.checkbox_container label {
border-bottom: 4px solid @color-categories-item-border-unselected;
font-size: 0.9em;
border-bottom: 2px solid @color-categories-item-border-unselected;
}
.checkbox_container label:hover {
border-bottom: 4px solid @color-categories-item-border-unselected-hover;
border-bottom: 2px solid @color-categories-item-border-unselected-hover;
}
.checkbox_container input[type="checkbox"]:checked + label {
border-bottom: 4px solid @color-categories-item-border-selected;
border-bottom: 2px solid @color-categories-item-border-selected;
}
}
#search_wrapper {
position: relative;
max-width: 600px;
width: 50em;
padding: 10px;
}
@ -59,7 +59,7 @@
font-size: 0;
}
@media screen and (max-width: 680px) {
@media screen and (max-width: @results-width) {
#search_wrapper {
width: 90%;
clear:both;

125
searx/static/less/style.less
View file

@ -195,7 +195,6 @@ a {
.result {
margin: 19px 0 18px 0;
padding: 0;
max-width: 53em;
clear: both;
}
@ -345,20 +344,36 @@ tr {
}
#results {
margin: 10px;
margin: auto;
padding: 0;
width: @results-width;
margin-bottom: 20px;
}
#sidebar {
position: absolute;
left: 54em;
width: 15em;
top: 100px;
left: 10px;
margin: 0 2px 5px 5px;
padding: 0 2px 2px 2px;
width: 14em;
input {
padding: 2px;
margin: 1px;
font-size: 0.8em;
display: inline-block;
background: transparent;
color: @color-result-search-url-font;
cursor: pointer;
}
input[type="submit"] {
text-decoration: underline;
}
}
#suggestions {
span {
display: block;
margin: 0 2px 2px 2px;
@ -368,18 +383,6 @@ tr {
form {
display: block;
}
input {
padding: 2px 6px;
margin: 2px 4px;
font-size: 0.8em;
display: inline-block;
background: @color-suggestions-button-background;
color: @color-suggestions-button-font;
.rounded-corners;
border: 0;
cursor: pointer;
}
}
#search_url {
@ -389,9 +392,10 @@ tr {
border: 1px solid @color-result-search-url-border;
padding: 4px;
color: @color-result-search-url-font;
width: 20em;
width: 14em;
display: block;
margin: 4px;
font-size: 0.8em;
}
}
@ -413,6 +417,7 @@ tr {
#pagination {
clear: both;
width: 40em;
}
#apis {
@ -420,40 +425,45 @@ tr {
clear: both;
}
@media screen and (max-width: 60em) {
#sidebar {
position: static;
max-width: 50em;
margin: 0 0 2px 0;
padding: 0;
float: none;
border: none;
width: auto
@media screen and (max-width: @results-width) {
#categories {
font-size: 90%;
clear: both;
.checkbox_container {
margin-top: 2px;
margin: auto;
}
}
#results {
margin: auto;
padding: 0;
width: 90%;
}
.checkbox_container {
display: block;
width: 90%;
//float: left;
label {
border-bottom: 0;
}
}
}
@media screen and (max-width: 70em) {
#suggestions {
span {
display: inline;
font-size: 0.8em
}
form {
display: inline;
}
input {
padding: 2px 6px;
margin: 2px 4px;
font-size: 0.8em;
display: inline-block;
.rounded-corners;
border: 0;
cursor: pointer;
}
}
}
@media screen and (max-width: 680px) {
.right {
display: none;
postion: fixed !important;
@ -461,29 +471,26 @@ tr {
right: 0px;
}
#sidebar {
position: static;
max-width: @results-width;
margin: 0 0 2px 0;
padding: 0;
float: none;
border: none;
width: auto;
input {
border: 0;
}
}
#apis {
display: none;
}
#categories {
font-size: 80%;
clear: both;
.checkbox_container {
margin-top: 2px;
margin: 0 2px;
}
}
.checkbox_container {
display: block;
width: 100%;
//float: left;
label {
border-bottom: 0;
}
}
#search_url {
display: none;
}
.result {
border-top: 1px solid @color-result-top-border;