擬似要素のテンプレで書くところを省略するためのmixin

before-and-after-mixin.scss

@mixin simple-before {
  &::before {
    content: '';
    @content;
  }
}

@mixin simple-after {
  &::after {
    content: '';
    @content;
  }
}

@mixin solid-before {
  &::before {
    display: block;
    content: '';
    @content;
  }
}

@mixin solid-after {
  &::after {
    display: block;
    content: '';
    @content;
  }
}