forked from zaclys/searxng
[mod] simple theme: adjust margins
* index page: margin top is 24% of the view port. avoid to scroll a small screen, center the content in the middle of the screen * link to preferences at the same height same the input fields * increase the category tab heighs * increase the margin bottom of the query field * in the results, change the h3 margin top and bottom to 0.4rem (6px) * move the back to top button slightly on the right when the results are only images
This commit is contained in:
parent
8985d3e6ef
commit
e2d312f6ae
|
@ -211,6 +211,8 @@ html {
|
||||||
@results-gap: 5rem;
|
@results-gap: 5rem;
|
||||||
@results-margin: 2rem;
|
@results-margin: 2rem;
|
||||||
@search-width: 40rem;
|
@search-width: 40rem;
|
||||||
|
// heigh of #search, see detail.less
|
||||||
|
@search-height: 7.5rem;
|
||||||
|
|
||||||
/// Device Size
|
/// Device Size
|
||||||
/// @desktop > @tablet
|
/// @desktop > @tablet
|
||||||
|
|
|
@ -17,7 +17,7 @@ article.result-images .detail {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
left: 60rem;
|
left: 60rem;
|
||||||
right: 0;
|
right: 0;
|
||||||
top: 7rem;
|
top: @search-height;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
background: var(--color-result-detail-background);
|
background: var(--color-result-detail-background);
|
||||||
border: 1px solid var(--color-result-detail-background);
|
border: 1px solid var(--color-result-detail-background);
|
||||||
|
|
|
@ -1,5 +1,9 @@
|
||||||
#main_index {
|
#main_index {
|
||||||
margin-top: 16em;
|
margin-top: 24vh;
|
||||||
|
|
||||||
|
#linkto_preferences {
|
||||||
|
right: 1.8rem;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.index {
|
.index {
|
||||||
|
|
|
@ -9,7 +9,7 @@
|
||||||
border-bottom: 1px solid var(--color-header-border);
|
border-bottom: 1px solid var(--color-header-border);
|
||||||
display: grid;
|
display: grid;
|
||||||
column-gap: 1rem;
|
column-gap: 1rem;
|
||||||
row-gap: 10px;
|
row-gap: 1rem;
|
||||||
grid-template-columns: 3rem 1fr;
|
grid-template-columns: 3rem 1fr;
|
||||||
grid-template-areas:
|
grid-template-areas:
|
||||||
"logo search"
|
"logo search"
|
||||||
|
@ -120,7 +120,7 @@
|
||||||
|
|
||||||
.search_filters {
|
.search_filters {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
vertical-align: middle;
|
margin: 0.8rem 0 0 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: @tablet) {
|
@media screen and (max-width: @tablet) {
|
||||||
|
@ -184,7 +184,6 @@
|
||||||
|
|
||||||
#search_wrapper {
|
#search_wrapper {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -204,7 +203,7 @@
|
||||||
|
|
||||||
.search_filters {
|
.search_filters {
|
||||||
display: block;
|
display: block;
|
||||||
margin: 0.5em;
|
margin: 0.8em 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.language,
|
.language,
|
||||||
|
@ -244,7 +243,7 @@
|
||||||
|
|
||||||
label {
|
label {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding: 4px 10px;
|
padding: 0.3rem 0.75rem 0.5rem 0.75rem;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
display: block;
|
display: block;
|
||||||
text-transform: capitalize;
|
text-transform: capitalize;
|
||||||
|
|
|
@ -157,9 +157,8 @@ article.result-images[data-vim-selected]::before {
|
||||||
h3 {
|
h3 {
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
margin: 8px 0 8px 0 !important;
|
margin: 0.4rem 0 0.4rem 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin-bottom: 0;
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: var(--color-result-link-font);
|
color: var(--color-result-link-font);
|
||||||
|
@ -526,7 +525,7 @@ article.result-images[data-vim-selected]::before {
|
||||||
#linkto_preferences {
|
#linkto_preferences {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 10px;
|
right: 10px;
|
||||||
top: 0.9em;
|
top: 2rem;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
border: 0;
|
border: 0;
|
||||||
display: block;
|
display: block;
|
||||||
|
@ -703,7 +702,7 @@ article.result-images[data-vim-selected]::before {
|
||||||
|
|
||||||
#backToTop {
|
#backToTop {
|
||||||
left: auto;
|
left: auto;
|
||||||
right: 2rem;
|
right: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
#pagination {
|
#pagination {
|
||||||
|
|
Loading…
Reference in New Issue