CSS: mask ​

.instui-mask — Egy beágyazott átfedés, amely kitölti a pozícionált szülőelemet és középre igazítja a tartalmát — pl. egy pörgető egy kártya felett. Modális ablak esetén részesítsd előnyben a natív <dialog> elemet (ennek ::backdrop pszeudoeleme a maszk). Ezek a módosítók mind globálisan is elérhetők (egyedül, vagy bármely más komponensre láncolva) — lásd a mask globális utilt.

Source: mask.css

Használat ​

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

Példák ​

html
<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
.-blurHomályosítsd el a maszk mögött lévő tartalmat a backdrop-filter segítségével.
.-fullscreenA nézetablakhoz rögzítve, magas z-indexen fedi le.

Fogyasztott tokenek ​

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