The second beta version of Bootstrap 5.0.0 has been released. Bootstrap is a popular framework to create responsive websites.
Release v5.0.0-beta2 · twbs/bootstrap
Highlights
- Dropdowns:
- Updated dropdown plugin to add data-bs-popper="static" via JS to the .dropdown-menu when the trigger has add data-bs-display="static" and data-bs-popper="none" when in navbars.
- Modified several selectors to separate our positioning styles from the Popper.js styles.
- Navbars:
- Added a new .navbar-nav-scroll class to enable vertical scrolling when a collapsed navbar is opened. It's customizable via Sass and a CSS variable. Read more in the docs.
- We've re-added flex-grow to the .navbar-collapse to restore the flexbox behaviors from v4 and prevent some content from being inadvertently squished.
- Forms:
- Removed vertical-align from .form-select
- Form validation mixin updated with additional parameters
- Fixed validation icon placement in .form-select
- Checkboxes and radio buttons are aligned better in input groups
- Buttons:
- Added variables for tinting and shading button state colors
- Suppressed the default focus outline for buttons in Chromium
- Toasts:
- Added word-break to .toast-body
- Added a live example to the docs to trigger a real toast
- Carousels:
- Updated docs examples to use s wherever possible instead of elements.
- CSS selectors changed for using as indicators (from .carousel-indicators li to .carousel-indicators [data-bs-target]).
- Bundles:
- Added our helpers to the utilities CSS bundle
- JavaScript:
- Dropdown now emits events on the .dropdown-toggle instead of the .dropdown.
- Restored the offset option for dropdowns.
- Fixed modal toggling when clicking on data-bs-toggle="modal".
- We now build our base component as a separate .js file.
- We now prevent getSelector from returning URLs as selector which caused errors in dropdown and scrollspy plugins.
- Refactored components to use a utility function to define jQuery plugins
Features
- #32037: Add .navbar-nav-scroll for vertical scrolling of navbar content
- #32317: Add variables for modifying button state colours.
- #32376: Support Popper virtual elements
Performance Improvements
- #32348: Use box shadows instead of linear gradients to colorize tables
CSS
- #31757: Extended Form validation states capabilities
- #32037: Add .navbar-nav-scroll for vertical scrolling of navbar content
- #32317: Add variables for modifying button state colours.
- #32318: Remove vertical-align from .form-select
- #32324: Add helpers to utilities bundle
- #32348: Use box shadows instead of linear gradients to colorize tables
- #32397: Utility API, RFS option: Only generate responsive classes when needed
- #32415: Reset Popper position in RTL
- #32419: Tweak .form-select padding
- #32423: Add two new variables for pagination border-radius values
- #32436: RTL improvements
- #32440: Expand visually-hidden-focusable so it can be used on a container, …
- #32492: Fix: variables collide with globals
- #32501: .ratio missing variable prefix
- #32524: Remove the initial margin from dropdown/popover in favor of Popper
- #32575: docs(sidebar): invalid CSS value
- #32627: Carousel: use buttons, not links, for prev/next controls
- #32630: Dynamic tabs: use buttons rather than links
- #32631: Remove old/unnecessary reboot bug fix
- #32661: Make carousel indicators actual buttons
- #32670: Add word-break to .toast-body
- #32689: Suppress focus outline for buttons when it shouldn't be visible in Chromium
- #32751: Consistently use outline:0 rather than outline:none
- #32754: Darken dropdown item hover style
- #32761: Mention stretched-link constraints with table elements
- #32785: Lighten disabled dropdown text to $gray-500
- #32787: Remove popover-arrow margin to fix alignment of the arrow
- #32793: Change .form-check background to $input-bg and change transitions
- #32819: Color utils docs
- #32899: Re-add flex-grow to .navbar-collapse
- #32912: Update checks and radios in input groups
- #32930: Fix hardcoded custom prop. in .navbar-nav-scroll
- #32951: fix(accordion): ensure .accordion-button stays left-aligned
- #32986: Dropdown menu alignment fixes
- #33003: Dropdown - Change the selector to check the use of Popper
- #33022: Ensure .navbar-collapse behaves as intended
JavaScript
- #32285: Refactor components to use a utility function to define jQuery plugins
- #32303: Use the ternary operator in a few more places
- #32309: tests: replace deprecated jQuery method
- #32313: build-plugins: build Base component too
- #32339: Remove SelectorEngine.matches().
- #32376: Support Popper virtual elements
- #32391: SelectorEngine: drop variable used once
- #32392: alert: rename variables for consistency
- #32393: carousel: switch to string constants
- #32394: Remove TRANSITION_END from utils
- #32395: carousel: switch to if/else
- #32405: Add Popper fallback behaviour
- #32420: Tooltip - check if tip and its parent node exist in dispose method
- #32436: RTL improvements
- #32437: Tooltip/popover - change the default value for fallbackPlacements
- #32438: collapse: prevent url change if A nested tag is clicked
- #32443: Restore offset option for dropdown component
- #32465: Tooltip - Add missing callback in async spec
- #32511: modal: move common code to reusable functions
- #32523: Tooltip refactoring
- #32524: Remove the initial margin from dropdown/popover in favor of Popper
- #32585: Throw a TypeError instead of the generic Error
- #32586: Prevent getSelector from returning URLs as selector
- #32603: Scrollspy - Remove unnecessary event argument
- #32625: Dropdown - Emit events on the .dropdown-toggle button
- #32661: Make carousel indicators actual buttons
- #32691: Fix toggling modal when clicking on data-bs-toggle="modal"
- #32750: Fix dropdown keys to open menu
- #32843: Remove custom fallbackPlacements from the dropdown
- #32845: Fix Popper preventOverflow boundary config
- #32882: Add function type for popperConfig option
- #32986: Dropdown menu alignment fixes
Docs
- #32246: Replace Lorem Ipsum placeholder text with more representative (or at least english language) text
- #32259: docs: SVG consistency changes
- #32272: Add a callout for the sanitizer in popovers and tooltips
- #32284: docs: Add Korean translation
- #32287: Typo: show on xxl, if only xl should be hidden.
- #32316: carousel.md: fix $carousel-transition-duration reference
- #32332: Move migration sidebar entry to sidebar.yml
- #32390: docs: Fix Popper-related docs
- #32398: Fix missed occurrencies of "Popper.js"
- #32399: Remove duplicated 'follow Bootstrap on Twitter' link in Getting Started
- #32401: cheatsheet: Drop redundant (current) text
- #32437: Tooltip/popover - change the default value for fallbackPlacements
- #32449: examples: Update font utility classes to new v5 versions
- #32455: docs: Add system-ui to the native font stack documentation
- #32461: Docs: style clipboard button on :focus, not just :hover
- #32463: Straggler lorem ipsum text
- #32464: Add missing has-validation in checkout examples
- #32478: Remove redundant pointer-events: none override for tooltip and popover disabled buttons
- #32479: Clean up lorem ipsum text in popover examples
- #32483: docs: Remove unneeded .form-group class
- #32489: Fix popover docs example
- #32490: Add keyboard-focusable elements for popover on disabled button
- #32512: Docs v5: Fix Sass rounding precision and state Sass implementation
- #32529: Tooltips: add missing space
- #32534: Documentation: added class selector "." to "dropend"
- #32543: API docs: add missing comma
- #32575: docs(sidebar): invalid CSS value
- #32589: Fix navbar docs - active nav-link
- #32620: docs: work around Toast CSS conflict with utils
- #32627: Carousel: use buttons, not links, for prev/next controls
- #32630: Dynamic tabs: use buttons rather than links
- #32632: Docs: Tweak the wording for collapse to indicate button is preferred/more semantic
- #32634: Docs: Remove incorrect mention of dropdowns for dynamic tab behavior
- #32638: Add an actual data-bs-touch="false" example in the carousel docs
- #32661: Make carousel indicators actual buttons
- #32684: Add functions and variables to the utilities API docs imports
- #32685: Clarify the $enable-shadows option in our docs
- #32688: Tweak wording for no-touch carousel
- #32740: Fix typo
- #32744: Document size and multiple aren't supported on floating label selects
- #32745: Add a link to v4.x from the v5 homepage
- #32758: Migration: mention the removal of .rounded-sm/lg utilities
- #32759: Add mention of CSPs and SVGs
- #32760: Add a live toast example to the docs
- #32761: Mention stretched-link constraints with table elements
- #32771: Improve docs regarding RTL migration
- #32778: Document some basic code conventions for us
- #32782: [docs] Update toasts.md
- #32788: Remove role="button" from CTA links in carousel examples
- #32795: Clarifies Sass variable defaults, adds bootstrap-npm-starter callout
- #32819: Color utils docs
- #32842: Docs: add v4.6.0
- #32846: docs: Fix navbar-nav-scroll description
- #32911: migration: mention .form-text changes
- #32912: Update checks and radios in input groups
- #32940: Fix default value for $enable-deprecation-messages
- #32979: Fix boundary config description for dropdown and popover
- #32995: Add a note to change the case type of option name
- #33017: Docs on enforcing HTTPS and avoiding mixed content
- #33027: Revamp sticky header offset to improve a11y
Accessibility
- #32401: cheatsheet: Drop redundant (current) text
- #32661: Make carousel indicators actual buttons
- #33027: Revamp sticky header offset to improve a11y
Tests
- #32309: tests: replace deprecated jQuery method
- #32465: Tooltip - Add missing callback in async spec
- #32486: BrowserStack: test on macOS Catalina instead of High Sierra
- #32730: Move "active" class from .nav-item to .nav-link
- #32769: JS: update karma config
- #32904: Minor ESLint rules cleanup
Misc
- #32185: terser: use 2 passes instead of the default 1.
- #32238: CI: add a 30-min timeout for BrowserStack
- #32312: build-plugins: switch to "bundled" for babel helpers
- #32313: build-plugins: build Base component too
- #32314: CONTRIBUTING: mention dist files
- #32417: Update Release Drafter configuration
- #32452: Update CodeQL Action
- #32453: Few updates for v5.0.0-beta1 NuGet support
- #32469: Improve zip-examples.js
- #32635: CI: update to actions/setup-node@v2
- #32737: package.json: move version_short variable under the config object
- #32755: GitHub Actions cleanup
- #32756: Stylelint: disallow some property values
- #32770: .gitignore: remove Ruby/Jekyll entries
- #32796: CI: change Node.js to 14
- #32799: Update zip-examples.js
- #32917: change-version: remove vendor, add resources
- #32919: CI: switch to the coverallsapp/github-action tag
- #33012: CI: remove the cache fallback and shorten cache key
- #33016: vnu-jar.js: quote vnu path
Dependencies
- Updated numerous devDependencies https://github.com/twbs/bootstrap/pulls?q=is%3Apr+is%3Aclosed+label%3Adependencies+project%3Atwbs%2Fbootstrap%2F33
Release v5.0.0-beta2 · twbs/bootstrap
