Customizing Bootstrap 4
Please note that this section refers to Angular 2+ with Bootstrap 4. If you are using AngularJS 1.x with Bootstrap 3, please go to the Bootstrap 3 documentation.
Pro tip: don’t forget to run
yarn start to get immediate feedback of your changes!
The simplest way to customize how your JHipster application looks like is by
overriding CSS styles in
src/main/webapp/content/css/global.css, or if you selected the Sass option, the
If you want to use Bootstrap partials in your own
scss files then import it like below in the beginning of your
For example to use the border-radius mixin:
@import "node_modules/bootstrap/scss/variables"; @import "node_modules/bootstrap/scss/mixins/border-radius";
Make sure you import only partials and not main sass files, otherwise you will end up generating duplicate css which might cause issues
Please refer official Bootstrap documentation for more details on customizations