Add theme required fixes

This commit is contained in:
kvan7 2023-10-31 14:31:01 +00:00
parent 0058a112cc
commit 281d0aac91
40 changed files with 998 additions and 886 deletions

View file

@ -1,8 +1,8 @@
#main_results #results.image-detail-open.only_template_images {
#main_kvanDark\/results #results.image-detail-open.only_template_images {
width: min(98%, 59.25rem) !important;
}
#main_results #results.only_template_images.image-detail-open #backToTop {
#main_kvanDark\/results #results.only_template_images.image-detail-open #backToTop {
.ltr-left(56.75rem) !important;
.ltr-right(inherit);
}

View file

@ -1,4 +1,5 @@
#main_index {
#main_index,
#main_kvanDark\/index {
margin-top: 26vh;
}
@ -45,7 +46,8 @@
}
}
#main_index {
#main_index,
#main_kvanDark\/index {
margin-top: 6em;
}
}

View file

@ -15,7 +15,8 @@ table {
}
}
#main_preferences {
#main_preferences,
#main_kvanDark\/preferences {
form {
width: 100%;
}

View file

@ -248,7 +248,8 @@ html.no-js #clear_search.hide_if_nojs {
@media screen and (max-width: @tablet) and (hover: none) {
#main_index,
#main_results {
#main_kvanDark\/index,
#main_kvanDark\/results {
#categories_container {
width: max-content;
@ -348,7 +349,7 @@ html.no-js #clear_search.hide_if_nojs {
}
}
#main_results #q:placeholder-shown ~ #send_search {
#main_kvanDark\/results #q:placeholder-shown ~ #send_search {
.ltr-margin-right(2.6rem);
transition: margin 0.1s;
}

View file

@ -4,31 +4,31 @@ see the CSS rules for #results in style.less ( grid-template-columns and gap).
In this file, the --center-page-width values comes from the Oscar theme (Bootstrap 3).
All rules starts with ".center-aligment-yes #main_results" to be enabled only
All rules starts with ".center-aligment-yes #main_kvanDark\/results" to be enabled only
on the /search URL and when the "center alignment" preference is enabled.
*/
@media screen and (min-width: @phone) {
.center-aligment-yes #main_results {
.center-aligment-yes #main_kvanDark\/results {
--center-page-width: 48rem;
}
}
@media screen and (min-width: 62rem) {
.center-aligment-yes #main_results {
.center-aligment-yes #main_kvanDark\/results {
--center-page-width: 60rem;
}
}
@media screen and (min-width: @tablet) {
.center-aligment-yes #main_results {
.center-aligment-yes #main_kvanDark\/results {
--center-page-width: 73rem;
}
}
@media screen and (min-width: @phone) and (max-width: @tablet) {
// any change must be reset in @media screen and (min-width: @tablet) { ... }
.center-aligment-yes #main_results {
.center-aligment-yes #main_kvanDark\/results {
#results {
grid-template-columns: 60% calc(40% - @results-gap);
margin-left: 0;
@ -50,7 +50,7 @@ on the /search URL and when the "center alignment" preference is enabled.
}
@media screen and (min-width: @tablet) {
.center-aligment-yes #main_results {
.center-aligment-yes #main_kvanDark\/results {
display: flex;
flex-direction: column;
align-items: center;
@ -86,7 +86,7 @@ on the /search URL and when the "center alignment" preference is enabled.
&.image-detail-open {
// * grid-template-columns and .ltr-margin-left are set in style.less
// * With .image-detail-open.only_template_images, the width is set in detail.less
// * #results is going to be centered because of the #main_results rules,
// * #results is going to be centered because of the #main_kvanDark\/results rules,
// align-self aligns the results on the left or right according to the language.
align-self: flex-start;
}

View file

@ -100,7 +100,7 @@
}
// Image flexbox
#main_results div#results.only_template_images #urls {
#main_kvanDark\/results div#results.only_template_images #urls {
direction: rtl;
}
@ -136,6 +136,7 @@
// Logo on the right
#main_preferences h1,
#main_kvanDark\/preferences h1,
#main_stats h1 {
background-position-x: 100%;
}

View file

@ -917,7 +917,7 @@ summary.title {
margin: 2rem 0 0 0 !important;
}
#main_results div#results {
#main_kvanDark\/results div#results {
margin: 0 auto;
justify-content: center;
display: grid;
@ -963,7 +963,7 @@ summary.title {
/* Misc */
#main_results div#results.only_template_images {
#main_kvanDark\/results div#results.only_template_images {
margin: 1rem @results-tablet-offset 0 @results-tablet-offset;
display: grid;
grid-template-columns: 100%;
@ -1013,7 +1013,7 @@ summary.title {
background-color: var(--color-base-background-mobile);
}
#main_results div#results {
#main_kvanDark\/results div#results {
grid-template-columns: 100%;
margin: 0 auto;
}
@ -1023,7 +1023,8 @@ summary.title {
.ltr-right(10px);
}
#main_index #links_on_top {
#main_index #links_on_top,
#main_kvanDark\/index {
top: 0.5rem;
.ltr-right(0.5rem);
}