I am responsible for SharePoint internet site in my company and this site was built using bootstrap V3.2.0 they want to upgrade this old site to latest version of Bootstrap V5.1.2
my problem is that when I updated the file (bootstrab.min.js) to latest version the menu button in mobile view does not work. In older ver of bootstrap the (.in) class is added to the collapse div While in latest ver it added (.show).
so how do I upgrade the bootstrap to latest version while keeping my site design same? I know that the css file and js file of bootstrap have to be upgraded together and I know there are new api and classes removed from older ver but the problem how to migrate these changes to my site? is there a migration document I can follow ? or a way to solve the collapse of the button because it is the only thing that does not work when I updated the file!
Welcome, Kazushia! Wow, first question in 5 years of being a user :) Big milestone.
so how do I upgrade the bootstrap to latest version while keeping my site design same
Bootstrap's major versions include some major design changes – alongside major, breaking code changes. I guarantee that "the collapse div" issue you've noted is not the only issue.
That being said, there are migration documents:
...unfortunately, the v5 migration path is a really long one.
Ultimately, you might be better off accepting the design differences. As @isherwood noted in a comment, there is no miracle cure here.