Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Dylan George
Dylan George
1,293 Points

Advanced Sass Concepts

I am stuck on the final part of this challenge, can anyone help me out?

Underneath the previous code, store the value "morning" in a variable named $time. Then write an if/else directive that will color all <a> tags. If the variable $time is equal to "morning", the color should be red. Otherwise, if the variable is "afternoon", the color should be blue. Finally, if the variable is set to anything else, the color should be gray.

I am getting the error "Bummer! You need to define a $time variable and set its value to: morning"

@mixin cars($make, $color) {
        .#{$make} {
            border: 1px solid black;
        background-image: url("#{$color}.png");
    }
}

@mixin morning($time){
    @if $time == morning {
  color: red;
  } @else {
    color: grey;
  }
}

6 Answers

Toni Laukka
Toni Laukka
2,643 Points
Toni Laukka
Toni Laukka
2,643 Points

You're not storing a value morning, you're creating a mixin called morning. Try it like this: 

$time: morning;
a {
  @if $time == morning {
    color: red;
  } @else if $time == afternoon {
    color: blue;
  } @else {
    color: grey;
  }
}
Dylan George
Dylan George
1,293 Points

Thank you very much Toni.

Toni Laukka
Toni Laukka
2,643 Points
Toni Laukka
Toni Laukka
2,643 Points

Else statement can't have condition, so either remove the $time == evening or add if after to else to make else if. Also the color is misspelled it's grey, not gray. Try with the code I gave above or do a side by side comparison of your code and mine.

Dylan George
Dylan George
1,293 Points
Dylan George
Dylan George
1,293 Points

Thank you very much Toni.

Mark Long
Mark Long
15,763 Points
Mark Long
Mark Long
15,763 Points

This is what I have but it doesn't work. Totally frustrated!

@mixin cars($make, $color) { .#{$make} { border: 1px solid black; background-image: url("images/#{$color}.png") } }

$time: morning;

a { @if $time == morning { color: red; } @else if $time == afternoon { color: blue; } @else $time == evening { color: gray; }

}

Courtney Adams
Courtney Adams
10,428 Points

Instead of @else $time == evening, try omitting the $time == evening and see if that works. So it'd look like this:

...(keep your code the same here)... @else { color: gray; } ...(end with your } as you have above)...