Skip to content

CSS: mask

.instui-mask — հոսքի մեջ գտնվող օվերթլեյ, որը լցնում է իր դիրքավորված ծնողը և կենտրոնացնում իր բովանդակությունը — օրինակ՝ քարտի վրայի սպիններ։ Մոդալի համար նախընտրելի է բնիկ <dialog> (այն->::backdrop մսկն է)։ Այս բոլոր մոդիֆիկատորները նույնպես հասանելի են գլոբալ մակարդակում (մերկ կամ կապված այլ կոմպոնենտի հետ) — դիտել mask գլոբալ utility։

Source: mask.css

Օգտագործում

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

Օրինակներ

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

Մոդիֆիկատորներ

ՄոդիֆիկատորՆկարագիր
.-blurՄասկի հետեւում գտնվողը աղավաղելու համար օգտագործեք backdrop-filter։
.-fullscreenՖիքսված է viewport‑ի նկատմամբ՝ այն ծածկում է բարձր z‑index‑ով։

Ցուցիչներ սպառված

TokenՏիպԱրժեք
--instui-component-mask-background-color<color>LightDarklight-dark(rgba(255,255,255,0.75), rgba(28,34,43,0.75))