DEV Community

Cover image for Bootstrap v5.2.0 – What are The New Features You’ll See?
Pxdraft
Pxdraft

Posted on

Bootstrap v5.2.0 – What are The New Features You’ll See?

Today website development has become easy with the help of themes available. There are many options, but you should pick bootstrap themes. The themes made with bootstrap are feature-packed, mobile-friendly, and make your website easy to navigate for users.

However, do you know there is a new release in bootstrap v5 known as Bootstrap v5.2.0-beta1? Today, in this blog we are going to read about the features of bootstrap 5.2 and how it has enhanced the working and will help you in your project.

What’s new in Bootstrap 5.2?

Bootstrap 5.2 is the new version of Bootstrap v5 having all the new features to make things easier for open-source developers. This is one of the longest releases among all the bootstrap releases. So, without any delay, let’s move ahead and look at the features it holds!

What are the new features of Bootstrap 5.2?

The Bootstrap 5.2 is a longing release and is updating a new beta version, the latest bootstrap is v5.2, and even the stable is also released. So, what are the new features that will help developers make the website design an easy task? Here are the most decorated features of v 5.2:

  • Redesigned docs

The Bootstrap docs are redesigned and made more navigable. Confused? Now, you can see the navbar and subnav bar on the page side of the page, it will show the every page link. In short, you can discover everything right there. They have also updated and refreshed the quick start guide to using Bootstrap via CDN.

If you see the navbar, now you can also choose versions from the new version picker in the upper right corner. The new doc is powered with the latest version of Algolia’s DocSearch. So, you can see the most recent searches there as well.

  • Design tweaks

With the change in docs, the design tweaks in the buttons and inputs were necessary. There’s not much of a change but the button radius and box size have been adjusted and made aligned with the new version of the doc theme. They are more pleasing to look at!

  • Component CSS variables

In this new bootstrap 5.2.0 release, they have added CSS variables to all the Components. It will only ease up things for the developers, whether experienced or newbies. Each component page now includes a reference guide to the relevant CSS variables.

Also, the values of each CSS variable are assigned via the Sass variable. So, now customization is also available in both types of variables be it CSS or Sass. Even some of the components of CSS variables are also customizable.

  • New _maps.scss

The new bootstrap v5.2.0 has also fixed the issue of original map updates not being applied to the secondary map. This is not the ideal solution but will help developers while working with customized maps. The new version has added a new Sass file _maps.scss.

Sass variable and CSS variable have the same shortcoming, if the default variable or map has been used, it cannot be updated. To solve the error you have to override the defaults before they get used. Therefore, variable customization must follow @import “functions”; but before @import “variables”; and the rest of the import stack.

  • New helpers and utilities

Apart from the new map Sass file, there’s been an addition of new helpers and utilities in the new version of Bootstrap 5.2. These new additions will help in quick customization and building of components. Which are those new helpers and utilities?

  • With the new .text-bg-{color}, you can now update the new background color in contrast with the foreground color.
  • You can now have semibold fonts in font-weight utilities with .fw-semibold.
  • There’s an extension in border-radius utilities of .rounded-4 and .rounded-5.

  • Responsive offcanvas

The Offcanvas component of Bootstrap now has responsive variations. It hides content across all viewports with the original .offcanvas class. The .offcanvas class can be changed to any .offcanvas-[sm|md|lg|xl|xxl] class to make it more responsive.

Dark Mode – An Upcoming Feature

We‘ve all seen the update and are working on the dark mode in Bootstrap v5.2.0-beta 1. It is soon going to be rolled out in Bootstrap’s next minor release. Apart from that, many changes have been worked upon to make the website theme designing easier and quicker for developers.

What can you expect in Bootstrap v5.3.0?

Yes, there’s going to be a new version update soon in Bootstrap. There’s no specific date given but all we know are about the few features that the team is working on and might be rolled out in the next release. So, which are they?

  • Dark mode
  • Attribute toggle plugin to toggle classes and attributes by writing HTML only.
  • CSS Variables for forms
  • Sticky headers for tables
  • Mixins and functions for modifying the utility API
  • An option for “always floating” floating forms. To know more about the release of Bootstrap v5.3.0, stay tuned to https://getbootstrap.com/.

Wrapping Up:

So, overall Bootstrap 5.2.0 has new features that will help developers in building the theme quickly and effortlessly. Don’t worry you won’t have to do it still. Opt for pxdraft’s Bootstrap templates and themes for your website for quick setup. All our themes and templates are developed with the latest version of bootstrap to get you the website with ultimate speed and mobile-friendliness.

Source : pxdraft.com

Oldest comments (0)