S CSS @extend в @keyframes не работает

Question

Я пытаюсь создать две ключевые анимации, которые заменяют атрибут содержимого псевдоэлемента. К сожалению, похоже, что @extend функция S CSS не работает в @keyframes. Я что-то пропустил?

Код: ( открыть анимация не работает, закрыть не работает).

@keyframes open {
  0% {
    @extend .icon-after-arrow-down;
  }
  50% {
    color: transparent;
  }
  100% {
    @extend .icon-after-arrow-up;
  }
}

@keyframes close {
  0% {
    content: '\e905';
  }
  50% {
    color: transparent;
  }
  100% {
    content: '\e902';
  }
}

Answer 1

Решено комментарием @Arkellys "@ extended - это когда вам нужно объединить классы в цепочку, для этого случая вы должны использовать mixins."