Sass what is different between @include and @extend
For my understanding, extend not allowed customization, and include allowed.
@extend
|
1 2 3 4 5 6 7 8 9 10 11 |
%button background-color: lightgrey &:hover, &:active background-color: white a @extend %button button @extend %button |
@include
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
@mixin my-button($size: 15, $color: red) { @include inline-block; @include border-radius(5px); font-size: $size + px; background-color: $color; } %button { @include my-button; } %alt-button { @include my-button(15, green); } %big-button { @include my-button(25); } |
using underscore to verify if a variable is undefined or null