v5.3.0
Bootstrap v5.3.0
Boosted v5.3.0
As usual, you may want to refer to Bootstrap v5.3.0 changelog for an exhaustive list of features and changes in Boosted/Bootstrap, and to the GitHub Release Discussion acting as a blog post.
🚀 Features
- Forms: update color form control based on UI Kit v5 (#1794)
- Carousel: pause/play button is now integrated within the carousel (#1763)
- Range: new variant that displays dynamically the current value on the top-right corner as a label (#1714)
- Popovers/Tooltips: update rendering according to Orange Design System UI Kit v5 (#1803 / #1936 / #2031)
- Range: fine-tuned the hover and active colors (#1605)
- Forms: changed rendering of help texts based on UI Kit v5 (#1779)
- Utilities: changed the values of
.lh-sm
,.lh-base
and.lh-lg
to retrieve a line-height logic based on a multiplication of the base font size (#1952) - Footer: new
.active
class and use ofaria-current="page"
for links for a better a11y. This is explained in a new section of the Footer's documentation. (#1859) - Buttons: new outline secondary button (
.btn-outline-secondary
) with transparent background (#2004) - Close button: add a "Closed" tooltip to close button component, but also to wherever it's used in other components: modals, offcanvases, toasts (#1823)
- Forms: 1px increase of spacing between form messages (
.form-text
and valid/invalid form messages) and form controls (#1948) - Buttons: add TikTok (#1778)
- Utilities: add
.border-4
and.border-5
(#2127) - Close button: add eco-design variant (#1489)
- CSS: deprecated
$boosted-prefix
in favor of$prefix
(#2129) - Utilities: reintroduce all text color utilities from Bootstrap (#2030
- Examples: new download app page (#2146)
🐛 Fixes
- Docs: remove extra break line in table shortcode (#1758)
- Forms: add some extra-padding between form switches and their label (#1796)
- Dropdowns: remove the cut border on split dropdowns when shown and remove border on
.nav-link
(#1793) - Quantity selector: avoid using .input-group selector to match only quantity selector in JS (#1825)
- Modals: increased margin between modal content and footer (#1658)
- Docs: modal with image variant wasn't rendered in the documentation (#1884)
- Orange navbar: add missing
.supra
in some examples with small viewports (#1885) - Forms: vertical alignment of invalid feedback icon on multiple lines (#1719)
- CSS: removed Stylelint multi-line comments from built CSS Boosted files (#1935)
- Tables: preserve table row heights with icons and thumbnails (#1674)
- Form example: add
data-focus-visible-added
attribute with JavaScript on the focused element on first error validation (#1953) - Examples: in cards examples, semantics have been changed for the row containing icons and the actions footer containing secondary buttons in order to be more accessible (#1904)
- Docs: add missing
<caption>
in captions' HTML examples (#2033) - Examples: some 5G icon ids were the wrong ones and weren't rendered in Stickers example (#2066)
- Docs: fix search box alignment in navbar HTML snippet (#2078)
- Docs: fix headings architecture of Tooltips page (#2021)
- Typography: changed
<h3>
,<h4>
and<h5
> font sizes at some breakpoints (#2053) - Stickers: due to the changes of
<h3>
,<h4>
and<h5>
font sizes, stickers are now presented as examples in the documentation based on fixed font sizes integrated via CSS not included into the framework (#2053) - Docs: Solaris icons URL (#2112)
- Footer: changed coverage icon to use
ic_Mobile_Network_Coverage
(#2022) - Docs: update broken DSM links (#2126)
📖 Docs
- Placeholders: display generic icons (#1857)
- Orange Design System: added new info callout to display ODS recommendations (#1709)
- Placeholder: use SVG instead of text inside the image in the placeholder shortcode (#1886)
- Stepped process: add precisions when one would like to display more that 5 items (#1908)
- Docs footer: Documentation footer uses the new
.active
+aria-current="page"
rendering of Boosted for better a11y (#2017) - Tooltips: add a11y callout about tooltips hiding important content (#2021)
- Forms: enhance 'Terms and Conditions' checkboxes accessibility and wording (#2002)
- Tables: add PNG thumbnail example in some tables (#2034)
- Release: add hidden new release banner (#2150
- Dark mode: hide unimplemented Orange dark mode (#2044)