Синтаксис SASS (не SCSS) для анимации ключевого кадра css3

Question

Есть ли способ писать ключевые кадры в SASS?

Каждый пример, который я нашел, является фактически SCSS, даже когда он говорит, что это SASS. Чтобы быть ясным, я имею в виду тот, у которого нет фигурных скобок.

Answer 1

Вот как вы реализуете CSS ключевые кадры в синтаксисе Сасс:

@keyframes name-of-animation 
    0% 
    transform: rotate(0deg) 
    100% 
    transform: rotate(360deg) 

Вот Sass Mixin добавить префиксы:

=keyframes($name) 
    @-webkit-keyframes #{$name} 
    @content 
    @-moz-keyframes #{$name} 
    @content 
    @-ms-keyframes #{$name} 
    @content 
    @keyframes #{$name} 
    @content 

Вот как использовать подмешать в синтаксисе Сасс:

+keyframes(name-of-animation) 
    0% 
    transform: rotate(0deg) 
    100% 
    transform: rotate(360deg)