Stuck on creating an if/else statement in the code challenge

Question

I am very new to Sass and programming so I am kinda lost. The question is "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 have done my best and am lost as to what I am missing now. Here is the code I have created that is not working (says it has a compilation error)

@mixin cars ($make, $color){
  .#{$make}{
    border: 1px solid black;
    background-image:url("#{$color}.png");
    }
}
//below refers to the current question
$time:morning;
@mixin time_of_day($time){
  @if $time == morning {
    a {
      color:red;
    }
}
    @else if $time == afternoon {
      a {
       color:blue;
     }
    }
    @else {
      a {
        color:grey;
      }
    }
  }

Answer 1 · 2014-08-08T17:06:46Z

August 8, 2014 5:06pm

Hi Kevin,

I don't get a compilation error with your code. I get a message indicating the color wasn't set to red.

This part of the challenge isn't asking for a mixin but if you do include the mixin then your code will pass.

@include time_of_day($time);

As mentioned though, it doesn't want a mixin for this part and you also have some duplication in your code that you should try to remove. Imagine at some point you need to change the a selector to something else. You have 3 places where you need to change that.

The if/else directive can be nested inside the a rule to remove this duplication.

$time:morning;

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

Answer 2 · 2017-04-07T15:54:30Z

April 7, 2017 3:54pm

Where am I going wrong, please?

$time:morning; a { @if $time == morning{ color:red; }

@else if $time == afternoon{
    color:blue;
} 

@else {
    color:grey;
}

}

Answer 3 · 2017-04-07T16:01:32Z

April 7, 2017 4:01pm

Hi Jason,

I missed that small bit of detail, so thank you.

Welcome to the Treehouse Community

Looking to learn something new?

Kevin Enloe

Kevin Enloe

Stuck on creating an if/else statement in the code challenge

3 Answers

Jason Anello

Jason Anello

Kevin Enloe

Kevin Enloe

Gavin Eyquem

Gavin Eyquem

Jason Anello

Jason Anello

Gavin Eyquem

Gavin Eyquem