#StackBounty: #sass #materializecss #vuejs2 #vuejs How to override materializecss sass variables in vue?

Bounty: 50

I’d like to change variables in materialize _variables.scss e.g.

$primary-color: color("materialize-red", "lighten-2") !default;
$primary-color-light: lighten($primary-color, 15%) !default;
$primary-color-dark: darken($primary-color, 15%) !default;
/*...*/

In my Vue 2 main.js I include materialize style like this

require('materialize-css/sass/materialize.scss');

Because of !default I guess I need to include my _variables.scss before including materialize, but I don’t know how.

So what’s the proper way to set my own variables e.g. $primary-color: color("blue", "lighten-2") (I want to use predefined palette from materialize _colors.scss)?


Get this bounty!!!

Leave a Reply