how to use mixins in sass code example
Example 1: sass mixin
@mixin transform($property) {
-webkit-transform: $property;
-ms-transform: $property;
transform: $property;
}
.box { @include transform(rotate(30deg)); }
Example 2: Sass @mixin and @include
@mixin important-text {
color: red;
font-size: 25px;
font-weight: bold;
border: 1px solid blue;
}
Example 3: scss variables mixins
// styles.scss
@use 'base';
.inverse {
background-color: base.$primary-color;
color: white;
}