New: On phones, faded the backdrop itself rather than overlaying gradients over it

This commit is contained in:
lscambo13
2025-05-11 18:14:15 +05:30
parent e54feb79e8
commit 6a157db8e5

View File

@@ -427,12 +427,12 @@ html {
margin-top: unset; margin-top: unset;
} }
/* This adds a light tint on the backdrop on phones */
.layout-mobile .detailPageWrapperContainer { .layout-mobile .detailPageWrapperContainer {
background: var(--darkerGradientPointAlpha); background: rgb(17 24 39 / 40%);
} }
.layout-desktop .detailPageWrapperContainer { .layout-desktop .detailPageWrapperContainer {
/* background: linear-gradient(0deg, var(--darkerGradientPoint) 80%, transparent); */
background: transparent; background: transparent;
min-height: calc(100vh - 13em); min-height: calc(100vh - 13em);
} }
@@ -448,18 +448,10 @@ html {
padding-right: 0; padding-right: 0;
} }
.layout-mobile .detailPagePrimaryContainer {
background: linear-gradient(0deg, var(--darkerGradientPoint) 70%, transparent);
}
.layout-desktop .detailPagePrimaryContainer { .layout-desktop .detailPagePrimaryContainer {
background: transparent; background: transparent;
} }
.layout-mobile .detailPageSecondaryContainer {
background-color: var(--darkerGradientPoint);
}
.layout-desktop .detailPageSecondaryContainer { .layout-desktop .detailPageSecondaryContainer {
background-color: transparent; background-color: transparent;
} }
@@ -656,7 +648,8 @@ html {
.layout-mobile .itemBackdrop { .layout-mobile .itemBackdrop {
margin-top: 0; margin-top: 0;
position: sticky; position: sticky;
top: -10%; top: -30%;
mask: linear-gradient(180deg, black 50%, transparent);
} }
.layout-tv .itemBackdrop { .layout-tv .itemBackdrop {