Tim Liberty
Tim Liberty

Reputation: 2129

How to refer SASS variable

I have this in my SASS:

$colors: (
  primary:    #f6861f,
  secondary:  #32db64,
  danger:     #f53d3d,
  light:      #f4f4f4,
  dark:       #222
);

If I use

.menu-inner .scroll-content{
    background: $colors['primary'];
}

it doesn't work. How do I refer to primary inside my $colors array?

Upvotes: 1

Views: 56

Answers (1)

Chris
Chris

Reputation: 435

Your syntax isn't quite right - you can't use C-style associative arrays with SASS; you need to use the map-get function instead.

In your example, to access the primary colour you would do this:

.menu-inner .scroll-content {
    background: map-get($colors, primary);
}

There's some more info on SASS maps in these articles.

Upvotes: 3

Related Questions