Topic: Bootstrap theme map not overwritten
informaticafwo-be free asked 3 years ago
We overwrite default theme colors of MDB to customize to our needs. Since MDB uses another way of defining the colors we adapted to this standard. We only implement three colors at this moment:
$primary-color: #00b1b0; $primary-color-dark: #10677C; $secondary-color: #717976; $secondary-color-dark: #3F4A46; $default-color: #337ab7; $default-color-dark: #165387;
We expect this to effect all MDB and Bootstrap components to use these colors as primary, secondary and so on.
Bootstrap component are build using the $theme-colors sass map. The problem is that MDB doesn't seem to overwrite these colors by default. This results in some bootstrap components (those who MDB doesn't implement) like alert's to not use our configured primary color.
At this moment we overwrite the bootstrap $theme-colors map in our custom variables file. We think this shout already be done in your _colors.scss.
$theme-colors: ( "primary": $primary-color, "secondary": $secondary-color);
We mentioned about customizing styles for your needs here: https://mdbootstrap.com/docs/jquery/getting-started/styles-customization/#scss-styles
The way you did it is 100% properly. You can use
_custom-styles.scss to overwrite default styles.
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
- User: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.18.0
- Device: Web
- Browser: Chrome, Firefox
- OS: Windows
- Provided sample code: No
- Provided link: No