zaclys
/
searxng
mirror of https://github.com/searxng/searxng.git
1
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

[theme] optimize switching between different device types

This commit is contained in:
MrPaulBlack 2021-09-25 17:44:54 +02:00 committed by Markus Heiser
parent 385dce213b
commit 859179f0c9
3 changed files with 20 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
searx/static/themes/simple/src/less/definitions.less
View File

@ -31,10 +31,10 @@
@color-url-font: #29314d; @color-url-font: #29314d;
@color-url-visited-font: #684898; @color-url-visited-font: #684898;
@results-width: 40em; @results-width: 35em;
@results-offset: 8rem; @results-offset: 10rem;
@results-tablet-offset: 0.5rem; @results-tablet-offset: 0.5rem;
@results-gap: 4em; @results-gap: 6em;
@search-width: 40em; @search-width: 40em;
// //

4
searx/static/themes/simple/src/less/search.less
View File

@ -104,7 +104,7 @@
vertical-align: middle; vertical-align: middle;
} }
@media screen and (max-width: 1250px) { @media screen and (max-width: 80em) {
#search { #search {
padding: 0 @results-tablet-offset; padding: 0 @results-tablet-offset;
} }
@ -146,7 +146,7 @@
} }
} }
@media screen and (max-width: @results-width) { @media screen and (max-width: 50em) {
#search { #search {
width: 100%; width: 100%;
margin: 0; margin: 0;

34
searx/static/themes/simple/src/less/style.less
View File

@ -598,7 +598,7 @@ article.result-images[data-vim-selected]::before {
} }
} }
@media screen and (max-width: 1250px) { @media screen and (max-width: 80em) {
#main_preferences, #main_preferences,
#main_about, #main_about,
#main_stats { #main_stats {
@ -695,6 +695,20 @@ article.result-images[data-vim-selected]::before {
#backToTop { #backToTop {
left: @results-width; left: @results-width;
} }
#main_results div#results {
margin: 2rem @results-tablet-offset 0 @results-tablet-offset;
display: grid;
grid-template-columns: 50em;
grid-template-rows: min-content min-content min-content 1fr min-content min-content;
gap: 0;
grid-template-areas:
"answers"
"suggestions"
"sidebar"
"urls"
"pagination";
}
} }
#main_results div#results.only_template_images { #main_results div#results.only_template_images {
@ -721,29 +735,11 @@ article.result-images[data-vim-selected]::before {
} }
} }
@media screen and (max-width: 1250px) {
#main_results div#results {
margin: 2rem @results-tablet-offset 0 @results-tablet-offset;
display: grid;
grid-template-columns: 50em;
grid-template-rows: min-content min-content min-content 1fr min-content min-content;
gap: 0;
grid-template-areas:
"answers"
"suggestions"
"sidebar"
"urls"
"pagination";
}
}
@media screen and (max-width: 50em) { @media screen and (max-width: 50em) {
#main_results div#results { #main_results div#results {
grid-template-columns: 100%; grid-template-columns: 100%;
} }
}
@media screen and (max-width: @results-width) {
article[data-vim-selected]::before { article[data-vim-selected]::before {
display: none; display: none;
content: ""; content: "";