fix(glass): внешняя обводка через ::after z-index:-1 без isolation
- z-index:0 на не-fixed родителях создаёт стек, -1 виден снаружи, контент не тронут - шапка (fixed) без z-index:0, чтобы не опуститься ниже FAB - убран backdrop-filter на псевдоэлементе (не рендерился с mask)
This commit is contained in:
1 parent
220fb634fc
commit
14b7cd829b
1 file changed
+11
-7
+11
-7
@@ -5198,18 +5198,24 @@ html[data-theme="light"] .glass-neutral {
|
||||
}
|
||||
|
||||
/* Внешняя градиентная обводка (сверху белый засвет -> снизу прозрачно).
|
||||
::after с inset:-1px выходит НАРУЖУ блока, блюрит край как стеклянная кромка.
|
||||
z-index:-1 => не перекрывает контент. Исключаем .fab (::after занят sheen). */
|
||||
::after с inset:-1px выходит НАРУЖУ; z-index:-1 (без isolation) => видна снаружи,
|
||||
внутренняя часть уходит под фон родителя, контент не перекрыт.
|
||||
Исключаем .fab (::after занят sheen). */
|
||||
html[data-theme="dark"] .glass-neutral:not(.fab),
|
||||
html[data-theme="light"] .glass-neutral:not(.fab),
|
||||
html[data-theme="dark"] .header--scrolled .header__inner,
|
||||
html[data-theme="light"] .header--scrolled .header__inner,
|
||||
html[data-theme="dark"] .nav-more__dock,
|
||||
html[data-theme="light"] .nav-more__dock,
|
||||
html[data-theme="dark"] #nav-more-menu-floating,
|
||||
html[data-theme="light"] #nav-more-menu-floating {
|
||||
position: relative;
|
||||
isolation: isolate;
|
||||
z-index: 0;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
/* Шапка уже position:fixed (свой стек-контекст) — z-index:0 не нужен,
|
||||
иначе может опуститься ниже других fixed-элементов. */
|
||||
html[data-theme="dark"] .header--scrolled .header__inner,
|
||||
html[data-theme="light"] .header--scrolled .header__inner {
|
||||
position: relative;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
html[data-theme="dark"] .glass-neutral:not(.fab)::after,
|
||||
@@ -5234,8 +5240,6 @@ html[data-theme="light"] #nav-more-menu-floating::after {
|
||||
linear-gradient(#000 0 0) content-box,
|
||||
linear-gradient(#000 0 0);
|
||||
mask-composite: exclude;
|
||||
backdrop-filter: blur(3px);
|
||||
-webkit-backdrop-filter: blur(3px);
|
||||
pointer-events: none;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user