DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Cover image for Bootstrap 5 Alpha Released
Sandeep Balachandran
Sandeep Balachandran

Posted on

Bootstrap 5 Alpha Released

Hey there,
Today lets talk about BS new ground breaking upgrades.

Bootstrap 5’s very first alpha has arrived!

  • Bootstrap no longer depends on jQuery
  • Dropped support for Internet Explorer
Before you jump to updating, please remember v5 is now in alphaβ€”breaking changes will continue to occur until first beta.They haven’t finished adding or removing everything, so check for open issues and pull requests as you have questions or feedback.

Major Changes

  • JQuery and Javascript
  • In addition to dropping jQuery, they have made a handful of other changes and enhancements to JavaScript in v5 that focus on code quality and bridging the gap between v4 and v5. One of the other larger changes was dropping the bulk of Button plugin for an HTML and CSS only approach to toggle states. Now toggle buttons are powered by checkboxes and radio buttons and are much more reliable.

  • CSS custom properties
  • As mentioned,started using CSS custom properties in Bootstrap 5 thanks to dropping support for Internet Explorer. In v4 only included a handful of root variables for color and fonts, and now added them for a handful of components and layout options.

    Take for example our .table component, where we’ve added a handful of local variables to make striped, hoverable, and active table styles easier:

.table {
  --bs-table-bg: #{$table-bg};
  --bs-table-accent-bg: transparent;
  --bs-table-striped-color: #{$table-striped-color};
  --bs-table-striped-bg: #{$table-striped-bg};
  --bs-table-active-color: #{$table-active-color};
  --bs-table-active-bg: #{$table-active-bg};
  --bs-table-hover-color: #{$table-hover-color};
  --bs-table-hover-bg: #{$table-hover-bg};

  // Styles here...
}

  • New look and feel



  • Built on the improvements to docs homepage in v4.5.0 with an updated look and feel for the rest of docs. Docs pages are no longer full-width to improve readability and make site feel less app-like and more content-like. In addition, upgraded sidebar to use expandable sections (powered by Collapse plugin) for faster navigation.

    Logo changed

    For More Deails Check out the official news
    Check it out now

    Top comments (1)

    Timeless DEV post...

    How to write a kickass README

    Arguably the single most important piece of documentation for any open source project is the README. A good README not only informs people what the project does and who it is for but also how they use and contribute to it.

    If you write a README without sufficient explanation of what your project does or how people can use it then it pretty much defeats the purpose of being open source as other developers are less likely to engage with or contribute towards it.