web-dev-qa-db-fra.com

Syntaxe SASS (non SCSS) pour l'animation d'images clés css3

Est-il possible d'écrire des images clés dans SASS?

Chaque exemple que j'ai trouvé est en réalité SCSS, même lorsqu'il est dit que c'est SASS. Pour être clair, je veux dire celui sans accolades.

css3sasskeyframe
60
daviestar

Voici comment vous implémentez les images clés css dans la syntaxe Sass:

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

Voici un mix Sass pour ajouter des préfixes de vendeurs:

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

Voici comment utiliser le mixin dans la syntaxe Sass:

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