لڏپلاڻ ڪرڻ v5

انحصار

• jQuery ڇڏيو.
• پوپر v1.x کان پوپر v2.x تائين اپڊيٽ ڪيو ويو.
• Libsass کي ڊارٽ ساس سان تبديل ڪيو ويو جيئن اسان جي ساس مرتب ڪندڙ Libsass کي رد ڪيو ويو.
• اسان جي دستاويزن جي تعمير لاء Jekyll کان Hugo ڏانهن لڏپلاڻ

برائوزر سپورٽ

• ڪڍي ڇڏيو انٽرنيٽ ايڪسپلورر 10 ۽ 11
• Microsoft Edge <16 (Legacy Edge) ختم ڪيو ويو
• فائر فاکس <60 کي ختم ڪيو ويو
• ڇڏيو ويو سفاري <12
• ختم ٿيل iOS سفاري <12
• ڪروم <60 کي ختم ڪيو ويو

---

دستاويزي تبديليون

• نئين سر ترتيب ڏنل هوم پيج، دستاويزن جي ترتيب، ۽ فوٽر.
• نئون پارسل گائيڊ شامل ڪيو ويو.
• نئون ڪسٽمائيز سيڪشن شامل ڪيو ويو، v4 جي Theming صفحي کي تبديل ڪندي، Sass تي نئين تفصيل سان، عالمي ترتيب جي اختيارن، رنگ اسڪيمون، CSS متغير، ۽ وڌيڪ.
• سڀني فارمن جي دستاويزن کي نئين فارم سيڪشن ۾ ٻيهر منظم ڪيو ، مواد کي ٽوڙي وڌيڪ مرڪوز صفحن ۾.
• ساڳي طرح، تازه ڪاري ڪئي لي آئوٽ سيڪشن ، گرڊ مواد کي وڌيڪ واضح طور تي ٻاهر ڪڍڻ لاء.
• "Navs" جزو واري صفحي جو نالو "Navs ۽ Tabs" رکيو ويو.
• "چيڪس" صفحي جو نالو "چيڪس ۽ ريڊيوز" ۾ تبديل ڪيو ويو.
• نيوبار کي ٻيهر ڊزائين ڪيو ۽ ھڪڙو نئون subnav شامل ڪيو ان کي اسان جي سائيٽن ۽ دستاويزن ورزن جي چوڌاري حاصل ڪرڻ آسان بڻائي.
• ڳولها فيلڊ لاءِ نئون ڪيبورڊ شارٽ ڪٽ شامل ڪيو ويو: Ctrl + /.

ساس

• اسان ڊفالٽ ساس نقشي کي ضم ڪري ڇڏيو آھي ان کي آسان بڻائڻ لاءِ بيڪار قدرن کي ختم ڪرڻ. ذهن ۾ رکو ته توهان کي هاڻي Sass نقشن ۾ سڀني قدرن کي بيان ڪرڻو پوندو جهڙوڪ $theme-colors. چيڪ ڪريو ته ڪيئن ڊيل ڪجي ساس نقشن سان .

• ڀڃڻتبديل ٿيل color-yiq()فنڪشن ۽ لاڳاپيل متغيرن کي color-contrast()جيئن ته اهو هاڻي YIQ رنگ اسپيس سان لاڳاپيل ناهي. ڏسو نمبر 30168

  • $yiq-contrasted-thresholdجو نالو تبديل ڪيو ويو آهي $min-contrast-ratio.
  • $yiq-text-dark۽ $yiq-text-lightترتيب وار نالا تبديل ڪيا ويا آهن $color-contrast-dark۽ $color-contrast-light.

• ڀڃڻميڊيا سوال mixins پيراگراف تبديل ٿي ويا آهن وڌيڪ منطقي انداز ۾.

  • media-breakpoint-down()ايندڙ بريڪ پوائنٽ جي بدران پاڻ بريڪ پوائنٽ استعمال ڪري ٿو (مثال طور، هدفن media-breakpoint-down(lg)جي بدران media-breakpoint-down(md)وييوپورٽس کان ننڍا lg).
  • اهڙي طرح، ٻئي پيرا ميٽر ۾ media-breakpoint-between()پڻ ايندڙ بريڪ پوائنٽ جي بدران بريڪ پوائنٽ پاڻ کي استعمال ڪري ٿو (مثال طور، ۽ جي وچ ۾ وييو پورٽ جي هدفن media-between(sm, lg)جي بدران ).media-breakpoint-between(sm, md)smlg

• ڀڃڻهٽايو پرنٽ انداز ۽ $enable-print-stylesمتغير. پرنٽ ڊسپلي ڪلاس اڃا تائين آهن. ڏسو نمبر 28339 .

• ڀڃڻcolor()ڇڏيا ويا , theme-color(), and functions gray()in variables. ڏسو نمبر 29083

• ڀڃڻفنڪشن جو نالو تبديل theme-color-level()ڪيو ويو color-level()۽ ھاڻي قبول ڪري ٿو ڪنھن رنگ کي جيڪو توھان چاھيو ٿا صرف $theme-colorرنگن جي بدران. ڏسو #29083 ڏسو ڏسو : color-level() بعد ۾ ختم ڪيو ويو v5.0.0-alpha3.

• ڀڃڻنالو تبديل ڪيو ويو $enable-prefers-reduced-motion-media-query۽ اختصار لاءِ.$enable-pointer-cursor-for-buttons$enable-reduced-motion$enable-button-pointers

• ڀڃڻbg-gradient-variant()ميڪسين کي هٽايو . ڪلاس استعمال ڪريو .bg-gradientگريجوئيٽ شامل ڪرڻ لاءِ عنصرن ۾ پيدا ٿيل .bg-gradient-*طبقن جي بدران.

• ڀڃڻ هٽايو ويو اڳ ختم ٿيل ميڪسينس:

  • hover،،،، ۽ hover-focus_plain-hover-focushover-focus-active
  • float()
  • form-control-mixin()
  • nav-divider()
  • retina-img()
  • text-hide()(پڻ سان لاڳاپيل يوٽيلٽي ڪلاس کي ختم ڪيو، .text-hide)
  • visibility()
  • form-control-focus()

• ڀڃڻساس جي پنهنجي رنگ اسڪيلنگ فنڪشن سان ٽڪراءَ کان بچڻ لاءِ scale-color()فنڪشن جو نالو تبديل ڪيو ويو.shift-color()

• box-shadowmixins ھاڻي nullقدرن کي اجازت ڏين ٿا ۽ noneگھڻن دليلن مان ڇڏي ڏيو. ڏسو #30394

• mixin border-radius()هاڻي هڪ ڊفالٽ قدر آهي.

رنگ سسٽم

• رنگ سسٽم جيڪو ڪم ڪيو color-level()۽ $theme-color-intervalنئين رنگ سسٽم جي حق ۾ هٽايو ويو. اسان جي ڪوڊ بيس ۾ سڀ lighten()۽ darken()افعال تبديل ڪيا ويا آھن tint-color()۽ shade-color(). اهي فنڪشن رنگ کي سفيد يا ڪارو سان ملائي ڇڏيندا آهن بجاءِ ان جي روشنيءَ کي هڪ مقرر مقدار ۾ تبديل ڪرڻ جي. shift-color()رنگ يا ته ڇانو ڪندو يا رنگ ان تي منحصر ڪري ٿو ته ان جو وزن پيٽرولر مثبت آهي يا منفي . وڌيڪ تفصيل لاءِ ڏسو #30622 .

• هر رنگ لاءِ نوان رنگ ۽ رنگ شامل ڪيا ويا آهن، هر بنيادي رنگ لاءِ نو الڳ رنگ مهيا ڪري رهيا آهن، جيئن نئين Sass متغير.

• بهتر رنگ برعڪس. 3:1 کان 4.5:1 تائين رنگن جي برعڪس تناسب کي ٽوڙيو ويو ۽ WCAG 2.1 AA برعڪس کي يقيني بڻائڻ لاءِ نيري، سائي، سائي ۽ گلابي رنگن کي اپڊيٽ ڪيو ويو. اسان جي رنگ جي برعڪس رنگ کي پڻ تبديل $gray-900ڪيو $black.

• اسان جي رنگ سسٽم کي سپورٽ ڪرڻ لاء، اسان اسان جي رنگن کي مناسب طور تي ملائڻ لاء نئين ڪسٽم tint-color()۽ افعال شامل ڪيو آهي.shade-color()

گرڊ اپڊيٽ

• نئون وقفو پوائنٽ! شامل ڪيو ويو نئون xxlوقفو پوائنٽ لاءِ 1400px۽ مٿي. ٻين سڀني وقفي پوائنٽن ۾ ڪابه تبديلي ناهي.

• بهتر ٿيل گٽر. گٽر هاڻي ريمز ۾ مقرر ڪيا ويا آهن، ۽ v4 ( 1.5rem، يا اٽڪل 24px، هيٺان کان 30px) کان تنگ آهن. هي اسان جي گرڊ سسٽم جي گٽرن کي اسان جي فاصلي جي افاديت سان ترتيب ڏئي ٿو.

  • افقي/عمودي گٽر، افقي گٽر، ۽ عمودي گٽرز کي ڪنٽرول ڪرڻ لاءِ نئون گٽر ڪلاس ( .g-*, .gx-*, and ) شامل ڪيو ويو..gy-*
  • ڀڃڻنئين گٽر يوٽيلٽيز سان ملائڻ لاءِ نالو تبديل .no-guttersڪيو ويو..g-0

• ڪالمن هاڻي position: relativeلاڳو نه ڪيا آهن، تنهنڪري توهان کي شايد .position-relativeڪجهه عناصر شامل ڪرڻو پوندو انهي رويي کي بحال ڪرڻ لاء.

• ڀڃڻڪيترن ئي .order-*طبقن کي ڇڏي ڏنو جيڪي اڪثر غير استعمال ٿيل هئا. .order-1اسان هاڻي صرف دٻي کان .order-5ٻاهر مهيا ڪندا آهيون .

• ڀڃڻجزو .mediaکي ڇڏيو ويو جيئن ان کي آساني سان استعمال ڪري سگهجي ٿو. ڏسو #28265 ۽ فلڪس يوٽيلٽيز پيج مثال لاءِ .

• ڀڃڻ bootstrap-grid.cssھاڻي صرف box-sizing: border-boxگلوبل باڪس-سائيزنگ کي ري سيٽ ڪرڻ بدران ڪالمن تي لاڳو ٿئي ٿو. اهو طريقو، اسان جي گرڊ جي اندازن کي مداخلت کان سواء وڌيڪ هنڌن تي استعمال ڪري سگهجي ٿو.

• $enable-grid-classesهاڻي ڪنٽينر ڪلاس جي نسل کي وڌيڪ بند نٿو ڪري. ڏسو نمبر 29146.

• ميڪسين کي اپڊيٽ ڪيو make-colويو ڊفالٽ ۾ برابر ڪالمن ۾ بغير ڪنهن مخصوص سائيز جي.

مواد، ريبوٽ، وغيره

• RFS ھاڻي ڊفالٽ طور فعال آھي. مڪسين استعمال ڪنديfont-size()هيڊنگس پاڻمرادو ترتيب ڏين ٿيون انهنfont-sizeجي ماپ ۾ ويو پورٽ سان. هي خصوصيت اڳ ۾ v4 سان آپٽ-ان هئي.

• ڀڃڻاسان جي ڊسپلي ٽائپوگرافي کي تبديل ڪيو اسان جي $display-*متغيرن کي تبديل ڪرڻ ۽ $display-font-sizesساس نقشي سان. هڪ واحد ۽ ترتيب ڏنل ايس $display-*-weightلاء انفرادي متغير پڻ هٽايو .$display-font-weightfont-size

• شامل ڪيو ويو ٻه نوان .display-*هيڊنگ سائيز، .display-5۽ .display-6.

• لنڪس ڊفالٽ طور هيٺ ڏنل آهن (صرف هور تي نه)، جيستائين اهي مخصوص حصن جو حصو نه هجن.

• انهن جي اسٽائل کي ريفريش ڪرڻ لاءِ جدولن کي ٻيهر ڊزائين ڪيو ويو ۽ اسٽائل تي وڌيڪ ڪنٽرول لاءِ CSS متغيرن سان ٻيهر ٺاهيو.

• ڀڃڻNested Tables هاڻي وراثت واري انداز ۾ نه آهن.

• ڀڃڻ .thead-light۽ variant طبقن .thead-darkجي حق ۾ ڇڏيا ويا آهن جيڪي سڀني ٽيبل عناصر ( , , , , and ) .table-*لاءِ استعمال ڪري سگھجن ٿيون .theadtbodytfoottrthtd

• ڀڃڻtable-row-variant()ميڪسين جو نالو تبديل ڪيو ويو آهي ۽ table-variant()صرف 2 پيٽرولر قبول ڪري ٿو: $color(رنگ جو نالو) ۽ $value(رنگ ڪوڊ). سرحد جو رنگ ۽ تلفظ رنگ خودڪار طريقي سان حساب ڪيو ويندو آهي ٽيبل فيڪٽر متغير جي بنياد تي.

• ٽيبل سيل پيڊنگ متغيرن ۾ ورهايو -y۽ -x.

• ڀڃڻ.pre-scrollableڪلاس ختم . ڏسو نمبر 29135

• ڀڃڻ .text-*افاديت شامل نه ڪندا آهن هور ۽ فوڪس رياستن کي هاڻي لنڪ ڏانهن. .link-*مددگار طبقن بدران استعمال ڪري سگھجن ٿيون. ڏسو نمبر 29267

• ڀڃڻ.text-justifyڪلاس ختم . ڏسو نمبر 29793

• ڀڃڻ <hr>عناصر ھاڻي استعمال ڪن ٿا heightبجاءِ borderبھتر مدد ڪرڻ جي sizeوصف کي. اهو پڻ ٿلهي ورهائيندڙ ٺاهڻ لاءِ پيڊنگ افاديت جي استعمال کي قابل بڻائي ٿو (مثال طور، <hr class="py-1">).

• ڊفالٽ افقي padding-leftآن <ul>۽ <ol>عناصر کي برائوزر ڊفالٽ کان 40pxري سيٽ ڪريو 2rem.

• شامل ڪيو ويو $enable-smooth-scroll، جيڪو عالمي سطح تي لاڳو ٿئي scroll-behavior: smoothٿو- سواءِ صارفين جي جيڪي prefers-reduced-motionميڊيا جي سوال ذريعي گھٽ حرڪت لاءِ پڇن ٿا. ڏسو نمبر 31877

RTL

• افقي طرف مخصوص متغير، افاديت، ۽ ميڪسينس سڀني کي منطقي ملڪيت استعمال ڪرڻ لاء تبديل ڪيو ويو آهي جهڙوڪ جيڪي flexbox layouts ۾ مليا آهن- مثال طور، start۽ endجي بدلي left۾ right.

فارم

• نئون سچل فارم شامل ڪيو ويو! اسان فلوٽنگ ليبلز جي مثال کي مڪمل طور تي سپورٽ ٿيل فارم اجزاء ڏانهن وڌايو آهي. ڏسو نئون فلوٽنگ ليبل صفحو.

• ڀڃڻ گڏيل اصلي ۽ ڪسٽم فارم عناصر. چيڪ بڪس، ريڊيوز، چونڊون، ۽ ٻيون انپٽس جيڪي وي 4 ۾ ڏيهي ۽ ڪسٽم ڪلاس هئا انهن کي گڏ ڪيو ويو آهي. ھاڻي تقريبن اسان جا سڀئي فارم عنصر مڪمل طور تي ڪسٽم آھن، اڪثر ڪري ڪسٽم HTML جي ضرورت کان سواء.

  • .custom-checkهاڻي آهي .form-check.
  • .custom-check.custom-switchهاڻي آهي .form-check.form-switch.
  • .custom-selectهاڻي آهي .form-select.
  • .custom-file۽ .form-fileمٿي تي حسب ضرورت انداز سان تبديل ڪيو ويو آهي .form-control.
  • .custom-rangeهاڻي آهي .form-range.
  • ديسي .form-control-file۽ .form-control-range.

• ڀڃڻڇڏيو ويو .input-group-append۽ .input-group-prepend. توھان ھاڻي صرف بٽڻ شامل ڪري سگھو ٿا ۽ .input-group-textان پٽ گروپن جي سڌي ٻارن وانگر.

• ان پٽ گروپ تي ڊگھي گم ٿيل بارڊر ريڊيس کي تصديق جي راءِ جي بگ سان آخرڪار .has-validationان پٽ گروپن ۾ هڪ اضافي ڪلاس شامل ڪندي درست ڪيو ويو آهي.

• ڀڃڻ اسان جي گرڊ سسٽم لاءِ فارم-مخصوص لي آئوٽ ڪلاس ختم ڪيا ويا. اسان جي گرڊ ۽ يوٽيلٽيز استعمال ڪريو بدران .form-group, .form-row, or .form-inline.

• ڀڃڻفارم ليبل هاڻي گهربل آهي .form-label.

• ڀڃڻ .form-textهاڻي سيٽ نٿو ڪري display، توهان کي ان لائن ٺاهڻ جي اجازت ڏئي ٿي يا مدد جي متن کي بلاڪ ڪرڻ جي اجازت ڏئي ٿي جيئن توهان چاهيو صرف HTML عنصر کي تبديل ڪندي.

• <select>تصديقي آئڪن هاڻي s سان لاڳو نه آهن multiple.

• وري ترتيب ڏنل ماخذ Sass فائلن جي تحت scss/forms/، بشمول ان پٽ گروپ اسٽائل.

---

اجزاء

• اسان جي متغير paddingجي بنياد تي الارٽس، بريڊ ڪرمبس، ڪارڊ، ڊراپ ڊائونز، لسٽ گروپس، ماڊلز، پاپ اوور ۽ ٽول ٽِپس لاءِ متحد قدر. ڏسو نمبر 30564 .$spacer

اڪارڊون

• نئون accordion جزو شامل ڪيو ويو.

خبرداري

• خبردارين ۾ ھاڻي مثالن سان گڏ آھن .

• <hr>هر الرٽ ۾ s لاءِ ڪسٽم اسلوب کي هٽايو ويو آهي ڇاڪاڻ ته اهي اڳ ۾ ئي استعمال ڪندا آهن currentColor.

بيج

• ڀڃڻپس منظر جي افاديت لاءِ سڀ .badge-*رنگ جا طبقا ڇڏيا ويا (مثال طور، .bg-primaryجي بدران استعمال ڪريو .badge-primary).

• ڀڃڻڇڏيو ويو .badge-pill- .rounded-pillان جي بدران يوٽيلٽي استعمال ڪريو.

• ڀڃڻهٽايو ويو هور ۽ فوڪس اسٽائلز لاء <a>۽ <button>عناصر.

• / کان .25em/ .5emتائين بيجز لاءِ ڊفالٽ پيڊنگ کي وڌايو ويو ..35em.65em

Breadcrumbs

• , padding, background-color۽ border-radius.

• شامل ڪيو ويو نئون CSS ڪسٽم پراپرٽي --bs-breadcrumb-dividerآسان ڪسٽمائيزيشن لاءِ بغير CSS کي ٻيهر گڏ ڪرڻ جي.

بٽڻ

• ڀڃڻ ٽوگل بٽڻ ، چيڪ بڪسس يا ريڊيوز سان، ھاڻي JavaScript جي ضرورت نه آھي ۽ نئون مارڪ اپ آھي. اسان کي هاڻي ريپنگ عنصر جي ضرورت نه آهي، شامل ڪريو.btn-check،ڪلاس<input>سان جوڙيو. ڏسو #30650 ھن لاءِ دستاويز اسان جي بٽڻ واري صفحي کان نئين فارم سيڪشن ڏانھن منتقل ڪيا ويا آھن..btn<label>

• ڀڃڻ افاديت .btn-blockلاءِ ڇڏيو ويو. .btn-blockتي استعمال ڪرڻ بدران .btn، پنهنجا بٽڻ لپي ڪريو .d-grid۽ .gap-*ضرورت مطابق انھن کي جاءِ ڏيڻ لاءِ يوٽيلٽي. انهن تي اڃا به وڌيڪ ڪنٽرول لاءِ جوابي طبقن کي تبديل ڪريو. ڪجهه مثالن لاءِ دستاويز پڙهو.

• اسان جي button-variant()۽ button-outline-variant()mixins کي اپڊيٽ ڪيو اضافي پيٽرولن کي سپورٽ ڪرڻ لاءِ.

• هور ۽ فعال رياستن تي وڌندڙ تضاد کي يقيني بڻائڻ لاءِ اپڊيٽ ٿيل بٽڻ.

• بند ٿيل بٽڻ ھاڻي آھن pointer-events: none;.

ڪارڊ

• ڀڃڻاسان جي گرڊ .card-deckجي حق ۾ ڇڏيو. پنھنجا ڪارڊ لفاف ڪريو ڪالمن ڪلاسن ۾ ۽ ھڪڙو والدين .row-cols-*ڪنٽينر شامل ڪريو ڪارڊ ڊيڪ کي ٻيهر بڻائڻ لاءِ (پر جوابي ترتيب تي وڌيڪ ڪنٽرول سان).

• ڀڃڻمعمار .card-columnsجي حق ۾ ڇڏي ويو. ڏسو نمبر 28922

• ڀڃڻهڪ نئين Accordion جزو.card سان ٻڌل accordion کي تبديل ڪيو .

ڪارونجهر

• اونداهي متن، ڪنٽرول، ۽ اشارن لاءِ نئون .carousel-darkقسم شامل ڪيو ويو (هلڪي پس منظر لاءِ وڏو).

• بوٽ اسٽريپ آئڪن مان نئين SVGs سان carousel ڪنٽرول لاءِ شيورون آئڪن کي تبديل ڪيو ويو .

بند ڪريو بٽڻ

• ڀڃڻهڪ گهٽ عام نالو لاءِ تبديل .closeڪيو ويو ..btn-close

• بند ڪريو بٽڻ ھاڻي HTML ۾ background-imagea جي بدران ھڪڙو (Embedded SVG) استعمال ڪريو ×، توھان جي مارڪ اپ کي ڇھڻ جي ضرورت کان سواءِ آسان ڪسٽمائيزيشن جي اجازت ڏيو.

• شامل ڪيو ويو نئون .btn-close-whiteقسم جيڪو filter: invert(1)اونداھي پس منظر جي خلاف اعلي برعڪس برطرف آئڪن کي فعال ڪرڻ لاء استعمال ڪندو آھي.

ٽٽڻ

• accordions لاء اسڪالر لنگر هٽايو.

ڊراپ ڊائونز

• شامل ڪيو ويو نئون .dropdown-menu-darkقسم ۽ لاڳاپيل متغيرن لاءِ آن ڊيمانڊ ڊارڪ ڊراپ ڊائونز.

• لاء نئون متغير شامل ڪيو ويو $dropdown-padding-x.

• بهتر برعڪس لاءِ ڊراپ ڊائون ڊويزن کي اونداهو ڪيو.

• ڀڃڻڊراپ ڊائون لاءِ سڀئي واقعا ھاڻي ڊراپ ڊائون ٽوگل بٽڻ تي شروع ڪيا ويا آھن ۽ پوءِ بلبل ٿي ويا آھن والدين عنصر تائين.

• ڊراپ ڊائون مينيو ۾ ھاڻي ھڪ خصوصيت data-bs-popper="static"سيٽ آھي جڏھن ڊراپ ڊائون جي پوزيشن مستحڪم آھي ۽ data-bs-popper="none"جڏھن ڊراپ ڊائون نيوبار ۾ آھي. اهو اسان جي جاوا اسڪرپٽ طرفان شامل ڪيو ويو آهي ۽ پوپر جي پوزيشن سان مداخلت ڪرڻ کان سواءِ اسان کي ڪسٽم پوزيشن اسلوب استعمال ڪرڻ ۾ مدد ڪري ٿي.

• ڀڃڻاصلي پوپر flipجي ترتيب جي حق ۾ ڊراپ ڊائون پلگ ان لاءِ اختيار ڪيو ويو. توھان ھاڻي فلپنگ رويي کي غير فعال ڪري سگھوٿا فلپfallbackPlacements موڊيفائر ۾ آپشن لاءِ خالي صف پاس ڪندي .

• ڊراپ ڊائون مينيو ھاڻي ڪلڪ ڪري سگھجن ٿا نئين autoCloseآپشن سان آٽو بند رويي کي سنڀالڻ لاءِ . توھان ھي اختيار استعمال ڪري سگھو ٿا ڪلڪ کي قبول ڪرڻ لاءِ اندر يا ٻاهران ڊراپ ڊائون مينيو کي ان کي انٽرويو ڪرڻ لاءِ.

• Dropdowns ھاڻي .dropdown-items ۾ ويڙھيل s کي سپورٽ ڪري <li>ٿو.

جمبوترون

• ڀڃڻجمبوٽرون جزو کي ڇڏي ڏنو جيئن ان کي استعمال ڪري سگهجي ٿو. ڏسو اسان جو نئون جمبوٽرون مثال هڪ ڊيم لاءِ.

فهرست گروپ

• گروپن جي لسٽ ۾ نئون .list-group-numberedترميمي شامل ڪيو ويو.

نيو ۽ ٽيب

• , , , ۽ طبقي لاءِ نوان nullمتغير شامل ڪيا ويا .font-sizefont-weightcolor:hover color.nav-link

نيوبارز

• ڀڃڻNavbars کي ھاڻي ھڪڙي ڪنٽينر جي اندر جي ضرورت آھي (خاص طور تي فاصلي جي ضرورتن کي آسان ڪرڻ ۽ CSS گھربل).

آفڪينوس

• نئون آفڪينوس جزو شامل ڪيو ويو .

صفحو

• صفحو جوڙيندڙ لنڪس هاڻي حسب ضرورت margin-leftآهن جيڪي متحرڪ طور تي سڀني ڪنڊن تي گول ٿين ٿيون جڏهن هڪ ٻئي کان جدا ٿي وڃن.

• transitionصفحو جي لنڪ ۾ شامل ڪيو ويو.

پاپورز

• ڀڃڻاسان جي ڊفالٽ پاپ اوور ٽيمپليٽ ۾ تبديل .arrowڪيو ويو..popover-arrow

• نالو تبديل whiteListڪيو اختيار allowList.

اسپنر

• اسپنرز ھاڻي عزت prefers-reduced-motion: reduceڪندا آھن متحرڪن کي سست ڪندي. ڏسو نمبر 31882

• بهتر اسپنر عمودي ترتيب.

ٽوسٽ

• ٽوسٽ هاڻي پوزيشننگ يوٽيلٽيز .toast-containerجي مدد سان هڪ ۾ رکي سگهجي ٿو .

• ڊفالٽ ٽوسٽ جو مدو 5 سيڪنڊن ۾ تبديل ڪيو ويو.

• ٽوسٽ مان هٽايو ويو overflow: hidden۽ مناسب border-radiuss سان calc()ڪم سان تبديل ڪيو ويو.

ٽول ٽِپ

• ڀڃڻاسان جي ڊفالٽ ٽول ٽائپ ٽيمپليٽ ۾ تبديل .arrowڪيو ويو..tooltip-arrow

• ڀڃڻجي ڊفالٽ قيمت کي fallbackPlacementsتبديل ڪيو ويو ['top', 'right', 'bottom', 'left']آهي پاپر عناصر جي بهتر جڳهه لاءِ.

• ڀڃڻنالو تبديل whiteListڪيو اختيار allowList.

افاديت

• ڀڃڻRTL سپورٽ جي اضافي سان هدايتي نالن جي بدران منطقي ملڪيت جا نالا استعمال ڪرڻ لاءِ ڪيترن ئي يوٽيلٽيز جو نالو تبديل ڪيو:

  • نالو تبديل ڪيو ويو .left-*۽ .right-*ڏانهن .start-*۽ .end-*.
  • نالو تبديل ڪيو ويو .float-left۽ .float-rightڏانهن .float-start۽ .float-end.
  • نالو تبديل ڪيو ويو .border-left۽ .border-rightڏانهن .border-start۽ .border-end.
  • نالو تبديل ڪيو ويو .rounded-left۽ .rounded-rightڏانهن .rounded-start۽ .rounded-end.
  • نالو تبديل ڪيو ويو .ml-*۽ .mr-*ڏانهن .ms-*۽ .me-*.
  • نالو تبديل ڪيو ويو .pl-*۽ .pr-*ڏانهن .ps-*۽ .pe-*.
  • نالو تبديل ڪيو ويو .text-left۽ .text-rightڏانهن .text-start۽ .text-end.

• ڀڃڻناڪاري مارجن کي ڊفالٽ طور بند ڪيو ويو.

• شامل ڪيو ويو نئون .bg-bodyطبقو جلدي سيٽنگ ڪرڻ لاءِ <body>پس منظر کي اضافي عناصر ڏانهن.

• , , , and . _ _ قيمتون شامل آهن ، , ۽ هر ملڪيت لاء.toprightbottomleft050%100%

• افقي يا عمودي مرڪز مطلق / مقرر ٿيل پوزيشن عناصر ڏانهن نئين .translate-middle-x۽ افاديت شامل ڪئي وئي..translate-middle-y

• شامل ڪيل نئين border-widthافاديت .

• ڀڃڻجو نالو تبديل .text-monospaceڪيو ويو .font-monospace.

• ڀڃڻهٽايو ويو .text-hideجيئن ته متن لڪائڻ لاءِ اهو هڪ قديم طريقو آهي جيڪو هاڻي استعمال نه ٿيڻ گهرجي.

• يوٽيلٽيز .fs-*لاءِ شامل ڪيل font-sizeيوٽيلٽيز (RFS فعال ٿيل سان). اهي ساڳيا پيمانا استعمال ڪن ٿا جيئن HTML جي ڊفالٽ عنوانن (1-6، وڏي کان ننڍو)، ۽ ساس نقشي ذريعي تبديل ڪري سگهجي ٿو.

• ڀڃڻاختصار ۽ مستقل مزاجي لاءِ يوٽيلٽيز جو نالو تبديل .font-weight-*ڪيو ويو..fw-*

• ڀڃڻاختصار ۽ مستقل مزاجي لاءِ يوٽيلٽيز جو نالو تبديل .font-style-*ڪيو ويو..fst-*

• CSS گرڊ ۽ flexbox layouts لاءِ يوٽيلٽيز ۽ نئين يوٽيلٽيز ( ) .d-gridکي ڊسپلي ڪرڻ ۾ شامل ڪيو ويو.gap.gap

• ڀڃڻهٽايو ويو ، .rounded-sm۽ rounded-lgڪلاسن جو هڪ نئون اسڪيل متعارف ڪرايو، .rounded-0ڏانهن .rounded-3. ڏسو نمبر 31687 .

• شامل ڪيل نئين line-heightافاديت: .lh-1, .lh-sm, .lh-baseand .lh-lg. هتي ڏسو .

• اسان جي CSS ۾ يوٽيلٽي کي منتقل ڪيو .d-noneان کي ٻين ڊسپلي يوٽيلٽيز تي وڌيڪ وزن ڏيڻ لاءِ.

• .visually-hidden-focusableاستعمال ڪندي ڪنٽينرز تي ڪم ڪرڻ لاءِ مددگار کي وڌايو :focus-within.

مددگار

• ڀڃڻ جوابي ايمبيڊ مددگار جو نالو تبديل ڪيو ويو تناسب مددگارن سان نون ڪلاس جي نالن ۽ بهتر رويي سان، انهي سان گڏ هڪ مددگار CSS متغير.

  • ڪلاسن جو نالو تبديل ڪيو ويو آھي تبديل byڪرڻ لاءِ xاسپيڪٽ ريشو ۾. مثال طور، .ratio-16by9هاڻي آهي .ratio-16x9.
  • اسان .embed-responsive-itemهڪ آسان چونڊيندڙ جي حق ۾ ۽ عنصر گروپ چونڊيندڙ کي ڇڏي ڏنو آهي .ratio > *. وڌيڪ طبقي جي ضرورت ناهي، ۽ تناسب مددگار هاڻي ڪنهن به HTML عنصر سان ڪم ڪري ٿو.
  • $embed-responsive-aspect-ratiosساس نقشي جو نالو تبديل ڪيو ويو آھي ۽ $aspect-ratiosان جي قدرن کي آسان ڪيو ويو آھي شامل ڪرڻ لاءِ ڪلاس جو نالو ۽ فيصد کي key: valueجوڙي جي طور تي.
  • CSS متغير هاڻي ٺاهيا ويا آهن ۽ Sass نقشي ۾ هر قيمت لاء شامل آهن. ڪنهن به حسب ضرورت تناسب ٺاهڻ لاءِ --bs-aspect-ratioتي متغير کي تبديل ڪريو ..ratio

• ڀڃڻ ”اسڪرين ريڊر“ جا ڪلاس ھاڻي ”ضعيف لڪيل“ ڪلاس آھن.

  • کان Sass فائل کي تبديل scss/helpers/_screenreaders.scssڪيوscss/helpers/_visually-hidden.scss
  • نالو تبديل ڪيو ويو .sr-only۽ .sr-only-focusableڏانهن .visually-hidden۽.visually-hidden-focusable
  • نالو تبديل ڪيو ويو sr-only()۽ sr-only-focusable()ملايو ويو visually-hidden()۽ visually-hidden-focusable().

• bootstrap-utilities.cssھاڻي اسان جا مددگار پڻ شامل آھن. هيلپرز کي هاڻي ڪسٽم بلڊنگز ۾ درآمد ڪرڻ جي ضرورت ناهي.

جاوا اسڪرپٽ

• jQuery جي انحصار کي ختم ڪيو ويو ۽ پلگ ان کي ٻيهر لکڻ لاءِ باقاعده جاوا اسڪرپٽ ۾.

• ڀڃڻسڀ جاوا اسڪرپٽ پلگ ان لاءِ ڊيٽا جون خاصيتون هاڻي نالي جي جاءِ تي رکيل آهن بوٽ اسٽراپ ڪارڪردگي کي ٽئين پارٽين ۽ توهان جي پنهنجي ڪوڊ کان ڌار ڪرڻ ۾ مدد لاءِ. مثال طور، اسان data-bs-toggleبدران استعمال ڪندا آهيون data-toggle.

• سڀ پلگ ان هاڻي قبول ڪري سگھن ٿا CSS چونڊيندڙ کي پهرين دليل طور. توهان يا ته پلگ ان جو نئون مثال ٺاهڻ لاءِ هڪ DOM عنصر يا ڪنهن صحيح CSS چونڊيندڙ کي پاس ڪري سگهو ٿا:

  ڪاپي

  var modal = new bootstrap.Modal('#myModal')
  var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')
  

• popperConfigهڪ فنڪشن جي طور تي منظور ڪري سگهجي ٿو جيڪو بوٽ اسٽريپ جي ڊفالٽ پوپر ترتيب کي دليل طور قبول ڪري ٿو، انهي ڪري ته توهان هن ڊفالٽ ترتيب کي پنهنجي طريقي سان ملائي سگهو ٿا. ڊراپ ڊائونز، پاپ اوور، ۽ ٽول ٽائپس تي لاڳو ٿئي ٿو.

• جي ڊفالٽ قيمت کي fallbackPlacementsتبديل ڪيو ويو ['top', 'right', 'bottom', 'left']آهي پوپر عناصر جي بهتر جڳهه لاءِ. ڊراپ ڊائونز، پاپ اوور، ۽ ٽول ٽائپس تي لاڳو ٿئي ٿو.

• عوامي جامد طريقن جهڙوڪ _getInstance()→ getInstance().