Skip to content

CSS: maskglobal

.--mask-overlay — Una copia globale e doppia dei modificatori di overlay del componente mask--mask-overlay, --mask-fullscreen, --mask-blur — utilizzabile nudo o concatenato a qualsiasi componente, senza racchiuderlo in un elemento .instui-mask.

Source: index.ts

Uso

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

Esempi

html
<button class="instui-button --mask-overlay">…</button>

Modificatori

ModificatoreDescrizione
.--mask-blurSfoca ciò che sta dietro la maschera con un backdrop-filter.
.--mask-fullscreenFissato alla viewport, la copre con un z-index elevato.
.--mask-overlayOverlay della maschera completa (posizione, centratura, sfondo).

Token consumati

TokenTipoValore
--instui-component-mask-background-color<color>LightDarklight-dark(rgba(255,255,255,0.75), rgba(28,34,43,0.75))