Topic: More theme color options other than Primary and Secondary
Expected behavior
With SCSS theming, we should be able to set all color themes that appear here:
https://mdbootstrap.com/docs/b5/angular/content-styles/colors/
Meaning, we should be able to set the colors for primary, secondary, success, danger, warning, info, light, and dark to suit our brand's color palate.
Actual behavior
The theming mixins for light and dark (mdb-light-theme and mdb-dark-theme) and the subsequent creation of those themes using mdb-theme only allow for setting the primary and secondary colors, and none others.
Resources (screenshots, code snippets etc.)
In /assets/scss/pro/theme/components/_functions.scss there functions only take primary and secondary as colors for a theme:
@function mdb-light-theme($primary, $secondary) {
@function mdb-dark-theme($primary, $secondary) {
We need the ability to pass more theme colors into the theme creation and also for the resulting mixins that are used to use that theme to use the additional theme colors.
@atrain0789 We only modify colors that are directly used in our components to adjust the components appearance to the primary/secondary values used in the theme function.
In this case, you can override $light, $dark, $info and other variables in your styles.scss file, before MDB styles import.
atrain0789 priority commented 2 years ago
I guess this should be a feature request then. Your solution would require that that we override and import ALL MDB styles for every theme that I want to create which will create a very large compiled CSS file. The best solution would be a mixin that you can pass all the core theme colors ($primary, $secondary,$light,$dark,$success,$warning,$danger,$info) and have them all be created as a part of that theming process.
Arkadiusz Idzikowski staff commented 2 years ago
@atrain0789 We agree that this solution may not be sufficient in such a use case. I added this feature to our to-do list.
atrain0789 priority commented 2 years ago
Great, thank you! How will we know if this is released in a new version? Just in the release notes or will this thread be closed when it is addd?
Arkadiusz Idzikowski staff commented 2 years ago
We don't know when this feature will be added to the library because we already have some plans for the upcoming releases, but the easiest way to learn about new changes is to follow our changelog: https://mdbootstrap.com/docs/b5/angular/getting-started/changelog/
Of course we always try to update the forum as well when the release is ready.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Priority
- Premium support: Yes
- Technology: MDB Angular
- MDB Version: MDB5 1.5.0
- Device: Computer
- Browser: Chrome
- OS: MacOS
- Provided sample code: Yes
- Provided link: Yes