Skip to content

CSS: stacking

.--stack-topmost — утилиты глубины z-index — .--stack-<level> (deepest, below, above, topmost) — можно использовать отдельно или цепочкой с любым компонентом, чтобы слои накладывались предсказуемо, а не с помощью вручную подобранных чисел.

Source: index.ts

Использование

css
@import "@pantoken/components/utilities.css";

Примеры

html
<div class="--stack-topmost">Always on top.</div>

Модификаторы

МодификаторОписание
.--stack-aboveВыше стандартного потока.
.--stack-belowНиже стандартного потока.
.--stack-deepestНаименьшая глубина наложения.
.--stack-topmostНаибольшая глубина наложения (оверлеи, меню).

Использованные токены

TokenТипЗначение
--instui-component-view-stacking-above<integer>1
--instui-component-view-stacking-below<integer>-1
--instui-component-view-stacking-deepest<integer>-9999
--instui-component-view-stacking-topmost<integer>9999