EveryCSS-mixin

Add mixin, include and extend support

@include

@mixin demo {
  border: 1px solid red;
  color: red;
  font-weight: bold;
}

.demo1 {
  @include demo;
}
.demo2 {
  background: black;
  @include demo;
}
.demo3 {
  background: white;
  @include demo;
}

output:

.demo1 {
  border: 1px solid red;
  color: red;
  font-weight: bold;
}
.demo2 {
  background: black;
  border: 1px solid red;
  color: red;
  font-weight: bold;
}
.demo3 {
  background: white;
  border: 1px solid red;
  color: red;
  font-weight: bold;
}

@extend

@mixin demo {
  border: 1px solid red;
  color: red;
  font-weight: bold;
}

.demo1 {
  @include demo;
}
.demo2 {
  background: black;
  @extend demo;
}
.demo3 {
  background: white;
  @extend demo;
}

output:

.demo2, .demo3 {
  border: 1px solid red;
  color: red;
  font-weight: bold;
}
.demo1 {
  border: 1px solid red;
  color: red;
  font-weight: bold;
}
.demo2 {
  background: black;
}
.demo3 {
  background: white;
}