The standard CSS we build for the theme is optimized for the current need, and doesn't include all possible Bootstrap parts. Including all by default slows down the page and of course gets punished by Google PageSpeed.
- Ensure you have the pre-requisites and that webpack is running
- Open the theme.scss file and uncomment the imports you need
For example
If you want to use the modal and the collapse, your theme.scss should look like:
...
// The following bootstrap parts are not used by the default setup
// But in case you need them, just uncommented the lines
//@import "../../node_modules/bootstrap/scss/jumbotron";
//@import "../../node_modules/bootstrap/scss/progress";
//@import "../../node_modules/bootstrap/scss/toasts";
@import "../../node_modules/bootstrap/scss/modal"; // Needed by the modal
//@import "../../node_modules/bootstrap/scss/tooltip";
//@import "../../node_modules/bootstrap/scss/popover";
//@import "../../node_modules/bootstrap/scss/carousel";
//@import "../../node_modules/bootstrap/scss/spinners";
@import "../../node_modules/bootstrap/scss/transitions"; // Needed by the collapse
//@import "../../node_modules/bootstrap/scss/dropdown";
//@import "../../node_modules/bootstrap/scss/custom-forms";
...