mirror of
https://github.com/lscambo13/ElegantFin.git
synced 2025-09-18 12:40:16 +00:00
New: On phones, faded the backdrop itself rather than overlaying gradients over it
This commit is contained in:
@@ -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 {
|
||||||
|
Reference in New Issue
Block a user