Topic: Correct way to set global body text color
BigMonkey pro asked 1 year ago
What is the correct way to set global body color via scss?
I can do something like
:root { --mdb-body-color: red; }
but it seems strange, is there a scss variable that can be set which will override the text color?
Grzegorz Bujański staff answered 1 year ago
If you want to override the body color, you have few options
- overwrite the scss
$body-color
variable - modify the scss
$body-color
variable in the source files (src/scss/free/_variables.scss
) - override css
--mdb-body-color
variable - modify css
--mdb-body-color
variable in the source files (src/scss/bootstrap-rtl-fix/_root.scss
);
Options 2 and 4 require recompiling the source code of the MDB styles. Option 1 requires using scss and compiling the scss code. Option 3 is the most convenient. Just overwrite the css variable. It doesn't require using sass and recompiling styles.
If you are using scss in your project you can just overwrite the scss variable. But if you only use css code in your project, I suggest overriding the css variable.
BigMonkey pro answered 1 year ago
But this results in --mdb-body-color being declared twice, first its included by the default MDB scss build and then its declared second time with my override.
Is there a way to override the default color thats used for the default --mdb-body-color variable in a way that doesn't duplicate things nor requires editing MDB core source files?
This seems so basic I must be missing something.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Pro
- Premium support: No
- Technology: MDB Standard
- MDB Version: MDB5 6.4.1
- Device: Any
- Browser: Any
- OS: Any
- Provided sample code: No
- Provided link: No