CODEWITHSUNDEEP
sassangular-materialangular-material2
Boo Yan Jiong
Boo Yan Jiong

Reputation: 2741

Access Angular-Material SCSS Variables (Angular4)

How to access certain SCSS variables in Angular-Material (Angular4)?

For example, the default toolbar has a CSS class as follow:

.mat-toolbar {
    display: flex;
    box-sizing: border-box;
    width: 100%;
    padding: 0 16px;
    flex-direction: column;
}

I want to get the padding value, i.e. 16px, store it as $fatty-padding and then use it in my custom class, for example:

.custom-toolbar {
    padding: $fatty-padding $fatty-padding;
    margin: 0 $fatty-padding;
}

Is it possible?

Upvotes: 4

Views: 529

Answers (1)

P.S.
P.S.

Reputation: 16402

Angular Material styles are written without variables:

enter image description here

So there is no easy way to get this styles and store to the variable in SCSS.

Upvotes: 1

Related Questions