Keyframes in SCSS

Question

Keyframes in SCSS

Navigation

#1 by (1 votes)

0

I have a mixin but applying it to an element does not apply correctly.

MixS SCSS

@mixin keyframes($property) {

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

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

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

    @keyframes $property {
        @content;
    }
}

Adding mixin to element

li:hover > ul {

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

                100% {
                    display: inherit;
                }
            }

And the result gives it to me like this

@-moz-keyframes $property

css sass

asked by qwerty 30.12.2018 в 17:01

source

1 answer

Error Intentun Savechanges () Entity Framework 6 ASP.Net MVC5? Undefined in React method

score 1 · Accepted Answer

You must use Interpolación: #{$var}

Example:

@mixin keyframes($property) {

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

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

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

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