Convert base theme from Bootstrap to Bootstrap5
.contextual-region {
position: inherit;
}
.btn {
margin: 0;
}
.path-frontpage h1,
.page-node-type-landing-page h1 .field--name-title,
.page-node-type-news-story h1 .field--name-title {
display: none;
}
.region-sidebar-first,
.region-sidebar-second,
.region-footer,
.region-content {
padding: 0;
}
.img-fluid {
width: 100%;
}
.node--type-landing-page .carousel {
height: auto;
overflow: hidden;
max-height: 550px;
}
div.bux-container--menu
nav.disclosure-nav.disclosure-nav-orientation-horizontal
> ul
> li {
margin: 0;
}
div.bux-container--menu nav.disclosure-nav button.disclosure-nav-button:after {
top: 5px;
left: -5px;
}
.disclosure-nav-responsive li {
width: 100%;
}
.nav > li > a {
padding: 10px;
}Comments:
- https://bootstrap5-d8-example.pantheonsite.io/admin/reports/dblog/event/343514 - Error found when going to a basic page on a multidev (Michael Lee - Aug 13, 2024)
- .contextual-region class needs position to be set from relative to inherit. Otherwise we will be unable to interact with buttons within the region of the div. (Michael Lee - Aug 13, 2024)
-
- set the margins for the .btn class to 0
- set the landing page h1 display to none
- remove padding for region-content
- add width: 100% to .img-fluid class
- update landing-page class to node--type-landing-page
- adjust menu item padding/margins to reflect live site (Michael Lee - Aug 13, 2024)
- To do: investigate if the responsive image module is still needed with Bootstrap5 (Michael Lee - Aug 13, 2024)
- In the Menu Breadcrumb module configuration we need to check the box to append the current page to the breadcrumbs. (/admin/config/user-interface/menu-breadcrumb) (Michael Lee - Aug 21, 2024)