Bootstrap 4.5.0 Released, What’s New

Posted on

Bootstrap v4.5.0 has landed with dozens of bug fixes, some small new features, and some changes to the development process. This version was originally planned as a v4.4.2 patch release, but the Bootstrap team bumped this to a minor release on account of the new features that help bridge the gap between v4 and our upcoming v5.

What’s New – Highlights

Here are the highlights and what’s new in Bootstrap 4.5.0.

  • New interaction utilities. Quickly set user-select with the new utilities and Sass map.
  • New Reboot style for pointer cursors. The team now include a role="button" selector in Reboot to set cursor: pointer on non-<button> element buttons.
  • Examples are now downloadable. The team now added a script to zip up and offer all our Examples as their own download from the docs.
  • Saved ~5% from the compressed minified JS builds.
  • Added guidance to the Bootstrap docs for how to workaround longstanding input group rounded corner bug.
  • Redesigned docs homepage and navbar to increment Bootstrap towards v5’s new docs design.
  • Deprecated bg-gradient-variant mixin as it’s being removed in v5.
  • Updated to jQuery v3.5.1, Jekyll v4, and dropped Node.js < 10.

Minor Fixes in CSS

  • Prevent vertical offset on progress bar in IE11
  • Add display: flex on .breadcrumb-item
  • Allow percentages in container widths
  • Escape brackets
  • Add missing Noto Sans font to font stack
  • Added new variable for padding on dropdown header
  • Fixes disabled .btn cursor
  • Added focus state to .btn-link
  • Fix IE auto-size input-group to column
  • Prevent grid with default cols from breaking when large pre is present by setting min-width: 0
  • Use word-wrap in .text-break for IE and Edge compatibility
  • Avoid border-radius functions returning negative values
  • Remove unnecessary reduce motion when $enable-transition: false
  • Fix centered modal scrolling issue
  • Prevent link underline change from affecting some components
  • Remove appearance from date inputs
  • Prevent redundant transition: none in transition()` mixin
  • Fix card list group borders & radii
  • Fix spinner-grow animation in Safari
  • Add .card-footer color
  • Use box-shadow mixin for .form-select, .btn, and other form controls
  • Added new interaction utilities for user-select and a new – role="button" in Reboot to set cursor: pointer.
  • Delete unncecessary appearance: none from button.close
  • Deprecate bg-gradient-variant mixin
  • Grid now checks for for $grid-columns > 0
  • Checks for an empty $grid-breakpoints map list to remove all breakpoints
  • Prevent list group style leaks
  • Disable auto-hiding scrollbar in IE and legacy Edge

Minor Fixes in Javascript

  • Close modal with keyboard=true & backdrop=static
  • sanitizer.js: Add srcset in the allowed attributes
  • Updated tab.js to address accessibility issue when using ul/li semantic
  • Ensure totype always return stringified null when null passed
  • Enable button toggle on label when checkbox is inside
  • Switch to string constants to save ~5% on compressed file size
  • Fix event propagation from inactive and disabled dropdowns
  • Ensure build plugins can exit in error
  • Prevent scrollbar replacement on non-integer width
  • scrollspy: only accept valid Elements as input for target

Changes in Docs

  • Redesigned docs homepage
  • Improved tap target sizing in our navigation
  • Added examples for our input group border-radius workaround
  • Added warning to browser bugs page that it’s no longer maintained
  • Added loading="lazy" for images
  • Improve wrapping and hit area of accordion example titles
  • Move width after make-container() mixin
  • Add Microsoft Edge for macOS to supported browsers
  • Added ability to zip and download our Examples
  • Add version number in page title
  • Changed input group validation examples to reflect issues with input group
  • Headings hierarchy in theming.md
  • Updated modal docs to simplify data-target usage and more
  • Clarify card group behavior
  • Remove holder.js leftovers
  • Use existing position utility in navbar example
  • Make the check for URL stricter in our docs search
  • Removed role=”document” from the modal dialog

Changes in Examples

  • Fix checkout page forms
  • Improve the responsiveness of our Dashboard example

To see the latest version in action, you can check Bootstrap 4.5.0 Documentation.

Categories: Tags: , ,

Leave a Reply