CODEWITHSUNDEEP
csssass
MatterGoal
MatterGoal

Reputation: 16430

Get variable name from variable value in SASS/SCSS

I'd like to access variable within an @each loop using defined value like in the following example:

$car:true;
$people:false;
$job:false;

    @mixin options($someval){
        @each $prefix in car,people,job{ 
            @if $#{$prefix} == true{
                    //some CSS...
            }       
        }
    }

Variable would be a sort of "semaphores" that define whether print or not Css rules.

My big doubt is how can I check over dynamically defined variables name ?

I've tried with $#{$prefix} but it doesn't work.

EDIT --------------------------- I'd like to obtain this CSS

car-something: 34px;

Where the word "car" is taken from $prefix and in the first round of @each loop $#{$prefix} becomes $car

The problem is on $#{$prefix} ... it doesn't work :P i get an error

Upvotes: 3

Views: 2686

Answers (2)

Tofandel
Tofandel

Reputation: 3585

This is an old question but since it has no valid answer, here it is

You need to pass a map to @each

$car:true;
$people:false;
$job:false;

@mixin options($someval){
    @each $key, $val in (car: $car, people: $people, job: $job) { 
        @if $val == true{
            #{$key}-something: $someval
        }       
    }
}

test {
    @include options(34px)
}

Upvotes: 1

bookcasey
bookcasey

Reputation: 40503

Instead of trying to interpolate a variable name, pass a list to the mixin.

$car: true;
$people: false;
$job: false;

$thing-list: $car, $people, $job;

@mixin thingamajig($thing-list) {
  @each $thing in $thing-list {
    @if $thing {
      // Some CSS
    }
  }
}

Upvotes: 1

Related Questions