CODEWITHSUNDEEP
sassmixins
Keith
Keith

Reputation: 4137

Use an array of variables in an each mixin

I'm having a hard time trying to figure out how to write an array for a variable to be used in an "each" statement.

        $array: (("1", "../../Media/Images/FirstImage.png"), ("2", "../../Media/Images/SecondImage.png"));

        @each $i in $array {
          &:nth-child( #{$i} ) {
            a {
              &:before {
                content: "";
                background: url({This is the 2nd part of each variable}) no-repeat;
              }
            }
          }
        }

Upvotes: 0

Views: 500

Answers (1)

Sean
Sean

Reputation: 8061

You currently have an array of arrays, not a single-dimensional array of variables or values. It seems like you could change your array to be 1-dimensional, and just use the index for the :nth-child().

$urls: ("../../Media/Images/FirstImage.png", "../../Media/Images/SecondImage.png");


@each $url in $urls {
  $i: index($urls, $url);
  &:nth-child(#{$i}) {
    a {
      &:before {
        content: "";
        background: url($url) no-repeat;
      }
    }
  }
}

Upvotes: 1

Related Questions