mirror of
https://github.com/lscambo13/ElegantFin.git
synced 2025-09-18 12:40:16 +00:00
Fix: Tweaked the app bar frosted effect on mobile and padding on TV
This commit is contained in:
@@ -55,7 +55,7 @@
|
|||||||
--backgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint) 35%, var(--lighterGradientPoint));
|
--backgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint) 35%, var(--lighterGradientPoint));
|
||||||
--cardBackgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint), 25%, var(--lighterGradientPoint));
|
--cardBackgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint), 25%, var(--lighterGradientPoint));
|
||||||
--headerColorGradient: linear-gradient(180deg, rgba(30, 40, 54, .95) 30%, 55%, transparent 90%);
|
--headerColorGradient: linear-gradient(180deg, rgba(30, 40, 54, .95) 30%, 55%, transparent 90%);
|
||||||
--headerColorGradientAlt: linear-gradient(180deg, rgba(30, 40, 54, .95), 70%, transparent);
|
--headerColorGradientAlt: linear-gradient(180deg, rgba(30, 40, 54, 1), 70%, transparent);
|
||||||
--headerBlurMask: linear-gradient(180deg, white 50%, 85%, transparent);
|
--headerBlurMask: linear-gradient(180deg, white 50%, 85%, transparent);
|
||||||
|
|
||||||
--cardFooterGradient: linear-gradient(0deg, rgb(0 0 0 / 90%), 40%, transparent);
|
--cardFooterGradient: linear-gradient(0deg, rgb(0 0 0 / 90%), 40%, transparent);
|
||||||
@@ -123,7 +123,7 @@
|
|||||||
|
|
||||||
/* use 5em to enable the fading app bar (seamless);
|
/* use 5em to enable the fading app bar (seamless);
|
||||||
use 4.6em to get the solid app bar (cleaner with border) */
|
use 4.6em to get the solid app bar (cleaner with border) */
|
||||||
--appBarHeight: 4.6em;
|
--appBarHeight: 5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
html {
|
html {
|
||||||
@@ -137,6 +137,9 @@ html {
|
|||||||
.layout-mobile {
|
.layout-mobile {
|
||||||
--itemColumnGap: 0;
|
--itemColumnGap: 0;
|
||||||
--sidePadding: 5%;
|
--sidePadding: 5%;
|
||||||
|
--headerColorGradient: var(--headerColorGradientAlt);
|
||||||
|
--blurLargest: blur(12px);
|
||||||
|
--headerBlurMask: linear-gradient(180deg, white 60%, 90%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Material Icons Round */
|
/* Material Icons Round */
|
||||||
@@ -3529,10 +3532,18 @@ ul.MuiList-root.MuiMenu-list.MuiList-dense>div:first-child {
|
|||||||
height: var(--appBarHeight);
|
height: var(--appBarHeight);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.osdHeader .headerTop {
|
||||||
|
max-height: var(--appBarHeight);
|
||||||
|
}
|
||||||
|
|
||||||
.layout-desktop .headerTop {
|
.layout-desktop .headerTop {
|
||||||
padding: 0 1em;
|
padding: 0 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.layout-tv .headerTop {
|
||||||
|
padding: 0 .5em;
|
||||||
|
}
|
||||||
|
|
||||||
/* this prevents the section tabs from hiding all the way up */
|
/* this prevents the section tabs from hiding all the way up */
|
||||||
.headroom--unpinned {
|
.headroom--unpinned {
|
||||||
-webkit-transform: translateY(calc(-1 * var(--appBarHeight) - var(--borderWidth)));
|
-webkit-transform: translateY(calc(-1 * var(--appBarHeight) - var(--borderWidth)));
|
||||||
|
Reference in New Issue
Block a user