in English
बटन बंद कर दिहल जाव
मोडल आ अलर्ट नियर सामग्री के खारिज करे खातिर एगो जेनेरिक बंद बटन।
एह पन्ना पर दिहल गइल बा
उदाहरण
के साथ कवनो घटक के खारिज करे भा बंद करे के विकल्प दीं .btn-close. डिफ़ॉल्ट स्टाइलिंग सीमित बा, लेकिन बहुत अनुकूलन योग्य बा। डिफ़ॉल्ट के बदले खातिर Sass चर के संशोधित करीं background-image. स्क्रीन रीडर खातिर पाठ जरूर शामिल करीं , जइसे कि हमनी के aria-label.
<button type="button" class="btn-close" aria-label="Close"></button>अक्षम अवस्था में बा
अक्षम बंद बटन आपन बदल देला opacity. हमनी के भी लागू कइले बानी जा pointer-events: noneआ user-select: noneहोवर आ सक्रिय राज्यन के ट्रिगर होखे से रोके खातिर।
<button type="button" class="btn-close" disabled aria-label="Close"></button>सफेद रंग के रूपांतर बा
क्लास .btn-closeके साथ डिफ़ॉल्ट के सफेद होखे खातिर बदलीं । .btn-close-whiteएह क्लास में filterप्रॉपर्टी के इस्तेमाल background-image.
<button type="button" class="btn-close btn-close-white" aria-label="Close"></button>
<button type="button" class="btn-close btn-close-white" disabled aria-label="Close"></button>ससस के बा
चर के बारे में बतावल गइल बा
$btn-close-width: 1em;
$btn-close-height: $btn-close-width;
$btn-close-padding-x: .25em;
$btn-close-padding-y: $btn-close-padding-x;
$btn-close-color: $black;
$btn-close-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$btn-close-color}'><path d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/></svg>");
$btn-close-focus-shadow: $input-btn-focus-box-shadow;
$btn-close-opacity: .5;
$btn-close-hover-opacity: .75;
$btn-close-focus-opacity: 1;
$btn-close-disabled-opacity: .25;
$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%);