0

Tengo un mixin pero al aplicarlo a un elemento no se aplica correctamente.

Mixin SCSS

@mixin keyframes($property) {

    @-webkit-keyframes $property {
        @content;
    }

    @-moz-keyframes $property {
        @content;
    }

    @-o-keyframes $property {
        @content;
    }

    @keyframes $property {
        @content;
    }
}

Añadiendo mixin a elemento

li:hover > ul {

            @include keyframes(animation) {
                0% {
                    color: #f8d2c0;
                }

                100% {
                    display: inherit;
                }
            }

Y el resultado me lo da así

@-moz-keyframes $property

1 respuesta 1

1

Debes usar Interpolación: #{$var}

Ejemplo:

@mixin keyframes($property) {

  @-webkit-keyframes #{$property} {
    @content;
  }

  @-moz-keyframes #{$property} {
    @content;
  }

  @-o-keyframes #{$property} {
    @content;
  }

  @keyframes #{$property} {
    @content;
  }
}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.