V
V
Vyacheslav Lebedev2015-04-16 00:21:35
Sass
Vyacheslav Lebedev, 2015-04-16 00:21:35

How to use a function in the preprocessor to expand the property and value?

Good evening!
Help implement reuse.
For example, how to pass the name of the property (or part of the name, so that you can glue it later):

// функция
add-cart($margin, $prop)
  .animated-add-cart
    animation-duration 1.5s

  @keyframes add-cart
    0%
      $margin -($prop / 1.1)
    50%
      $margin -($prop / 1.2)
    100%
      $margin -($prop / 1.1)

  .add-cart
    animation-name add-cart

$px = 5px
add-cart('margin-bottom', $px)

Value is substituted without problems. But with the name of the property, it did not work out that way.
I did not find a solution to the problem in the documentation.
Is it possible to use these functions like this?
Thank you!

Answer the question

In order to leave comments, you need to log in

1 answer(s)
S
Sergey delphinpro, 2015-04-16
@slavikse

Interpolation won't work, will it?
#{$margin}

add-cart($margin, $prop)
  .animated-add-cart
    animation-duration 1.5s

  @keyframes add-cart
    0%
      #{$margin}:  -($prop / 1.1)
    50%
      #{$margin}:  -($prop / 1.2)
    100%
      #{$margin}:  -($prop / 1.1)

  .add-cart
    animation-name add-cart

$px = 5px
add-cart('margin-bottom', $px)

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question