CSS: mask ​

.instui-mask — एक इन-फ्लो ओवरले जो अपने स्थित पेरेंट को भरता है और इसके कंटेंट को केंद्रित करता है — उदाहरण के लिए, कार्ड के ऊपर एक स्पिनर। एक मोडल के लिए, एक नेटिव <dialog> को प्राथमिकता दें (उसका ::backdrop मास्क है)। इन सभी मॉडिफायरों में से हर एक ग्लोबली भी उपलब्ध है (सादा, या किसी अन्य कंपोनेंट पर चेन करके) — mask ग्लोबल यूटिलिटी देखें।

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>

मॉडिफायर ​

मॉडिफायरविवरण
.-blurbackdrop-filter के साथ मास्क के पीछे जो है उसे धुंधला करें।
.-fullscreenव्यूपोर्ट के साथ फ़िक्स्ड, उच्च z-index पर इसे कवर करता है।

उपयोग किये गए टोकन ​

Tokenप्रकारमान
--instui-component-mask-background-color<color>LightDarklight-dark(rgba(255,255,255,0.75), rgba(28,34,43,0.75))