$brand-primary in laravel bootstrap variables not global

Question

I have laravel v5.4. In my _variables.scss i defined the primary color:

$brand-primary: red;

This changes everything bootstrap related to red which is nice. But then i have also added my own scss in app.scss:

@import "variables";
@import "custom/custom";

And in custom i have the following row:

color: $brand-primary;

... but for some reason this turns the color to original bootstrap brand primary, not my red. How can i get my red color everywhere i use $brand-primary?

Have you checked in inspect element? There could be an imported override? Reset the cache - try in a different browser? — Santosh Achari

Faran Ali Faran Ali · Accepted Answer · 2018-01-30T20:23:41

The bootstrap variable is overriding your variable definition. Make sure you are importing your file AFTER importing bootstrap variables' file.

Also, are you importing your '_variables.scss' file?

$brand-primary in laravel bootstrap variables not global

1 Answers