fix(report): sticky-сайдбар — overflow-x: clip вместо hidden (#958)
«Навигация не едет за скролом» + не видно подсветки активной секции: панель
(position: sticky; top: 72) уезжала вверх при скролле (на scrollY 6769 её top
был −6589). Корень: html, body { overflow-x: hidden } (#66 — гасит гориз.скролл)
заставляет браузер вычислить overflow-y: auto → body становится scroll-
контейнером для sticky, но реально скроллит window/html, а не body → sticky
никогда не залипает. Подсветка scrollspy не видна по той же причине — уезжает
с панелью.
overflow-x: CLIP так же режет горизонтальный overflow, но НЕ создаёт scroll-
контейнер (overflow-y остаётся visible) → sticky работает. Подтверждено на
проде: с clip body overflow-y=visible, aside залипает на top:72 при скролле.
Чинит sticky-сайдбары на всех страницах с этим паттерном (был сломан исходно).
This commit is contained in:
parent
806428abc9
commit
27b27d9f5d
1 changed files with 7 additions and 2 deletions
|
|
@ -97,11 +97,16 @@ a {
|
||||||
* подключаются через className; инлайн-стили остаются desktop-видом по умолчанию.
|
* подключаются через className; инлайн-стили остаются desktop-видом по умолчанию.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* Никакого горизонтального скролла на узких экранах (acceptance #66). */
|
/* Никакого горизонтального скролла на узких экранах (acceptance #66).
|
||||||
|
* overflow-x: CLIP, не hidden: `hidden` заставляет браузер вычислить
|
||||||
|
* overflow-y: auto → body/html становятся scroll-контейнером и ЛОМАЮТ
|
||||||
|
* `position: sticky` у сайдбара отчёта (панель уезжала вверх вместо залипания).
|
||||||
|
* `clip` так же режет горизонтальный overflow, но НЕ создаёт scroll-контейнер
|
||||||
|
* и оставляет overflow-y: visible → sticky-сайдбар работает. */
|
||||||
html,
|
html,
|
||||||
body {
|
body {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
overflow-x: hidden;
|
overflow-x: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Sidebar-grid (напр. "240px 1fr" / "minmax(300px,360px) 1fr"): на планшете
|
/* Sidebar-grid (напр. "240px 1fr" / "minmax(300px,360px) 1fr"): на планшете
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue