Fix: Tweaked and made some units consistent to prevent misalignments and overlaps

This commit is contained in:
lscambo13
2025-07-11 09:03:31 -07:00
parent adad2a4374
commit dbbe7b597f

View File

@@ -82,7 +82,7 @@
--sidePadding: 3.3%; --sidePadding: 3.3%;
--itemColumnGap: 1em; --itemColumnGap: 1em;
--itemPageNegativeSpace: max(15vh, 8em); --itemPageNegativeSpace: 15vh;
/* Set to 50% to center the play button in the overlay. */ /* Set to 50% to center the play button in the overlay. */
--overlayPlayButtonPosition: 2.8em; --overlayPlayButtonPosition: 2.8em;
@@ -748,7 +748,7 @@ html {
.layout-desktop .detailPageWrapperContainer { .layout-desktop .detailPageWrapperContainer {
background: transparent; background: transparent;
min-height: 28.5em; min-height: 46vh;
background: linear-gradient(0deg, var(--darkerGradientPointAlpha) 70%, 85%, transparent); background: linear-gradient(0deg, var(--darkerGradientPointAlpha) 70%, 85%, transparent);
} }
@@ -931,7 +931,7 @@ html {
@supports (aspect-ratio: 1 / 1) { @supports (aspect-ratio: 1 / 1) {
.detailLogo { .detailLogo {
display: block; display: block;
top: calc(100vh - 20vh - var(--itemPageNegativeSpace)); top: calc(100vh - 9em - var(--itemPageNegativeSpace));
left: 0; left: 0;
width: 40%; width: 40%;
transform: translateY(-100%); transform: translateY(-100%);
@@ -977,7 +977,7 @@ html {
.layout-tv .detailLogo { .layout-tv .detailLogo {
display: block; display: block;
height: 30vh; height: 25vh;
top: 40vh; top: 40vh;
width: 60%; width: 60%;
margin: auto 20%; margin: auto 20%;
@@ -1103,11 +1103,11 @@ html {
font-size: 3.5em; font-size: 3.5em;
} }
@media (max-width: 62.5em) { /* @media (max-width: 62.5em) {
.layout-desktop .detailPageWrapperContainer { .layout-desktop .detailPageWrapperContainer {
min-height: calc(100vh - 7em); min-height: calc(100vh - 7em);
} }
} } */
@media (max-width: 50em) { @media (max-width: 50em) {
.homeLibraryButton { .homeLibraryButton {
@@ -2090,6 +2090,7 @@ div[data-type="PhotoAlbum"] .play_arrow:before {
.mainDetailButtons { .mainDetailButtons {
justify-content: center; justify-content: center;
margin: 0 0 1em 0;
} }
.layout-mobile [dir=ltr] .mainDetailButtons { .layout-mobile [dir=ltr] .mainDetailButtons {