CSS: mask

.instui-mask — Egy dokumentumfolyambeli rátét (in-flow overlay), amely kitölti a pozicionált szülőjét, és középre zárja annak tartalmát — pl. egy spinner egy kártya felett. Modális ablakhoz inkább a natív <dialog> használata javasolt (ennek ::backdrop eleme a maszk). Ezen módosítók mindegyike globálisan is elérhető (önállóan vagy bármely más komponensre láncolva) — lásd a(z) mask globális segédprogramot.

Forrás: mask.css

Használat

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

Példák

<div style="position: relative">
  <div class="instui-mask">
    <span class="instui-spinner"></span>
  </div>
</div>

Módosítók

Módosító	Leírás
.-blur	Homályosítsa el a maszk mögötti dolgokat egy háttérszűrővel.
.-fullscreen	Rögzített a nézőablakhoz, nagy z-index értékkel.

Felhasznált tokenek

Token	Típus	Érték
--instui-component-mask-background-color	<color>	LightDarklight-dark(rgba(255,255,255,0.75), rgba(28,34,43,0.75))