Add custom colors to the theme-colors map

[xanderjanzen]

Hi Bootscore,

Can you tell me how to add custom colors (not override) to the theme-code map?
I would like to add some colors like this:

...........................................................................
$custom-colors: (
"custom-primary": #003767,
"custom-secondary": #007f2e,
"custom-success": #C00000,
"custom-info": #FF5000,
"custom-warning": #414A51,
"custom-danger": #E3E3E3,
"custom-light": #F0F0F0,
"custom-dark": #00B2CE,
);

$theme-colors: map-merge($theme-colors, $custom-colors);
...............................................................................

I have tried all .scss files like _bscore_custom.scss, _bscore_variables.scss and _colors.scss
But cannot get it to work.
Thanks.

[crftwrk]

Yes, please check here #175

Unfortunately it‘s not possible to create them in child, you have to add custom colors in main-theme /bootstrap/_variables.scss.

[xanderjanzen]

O.k. thank you for the fast reply. (I searched the discussions but did not find this older answer)
I will add them there. But in this way it will be overwritten when I update Bootscore right?

[crftwrk]

But in this way it will be overwritten when I update Bootscore right?

Correct, you have to readd them on each update.

[nathardwick]

Is this still not possible?

[crftwrk]

Luckily it's possible since v6. Bootstrap is now loaded in parts and those things can be created in new _bootscore-utility.scss https://github.com/bootscore/bootscore-child/blob/main/assets/scss/_bootscore-utilities.scss.

See https://bootscore.me/documentation/theme/css-scss-compiler/#bootscore-utilities-scss