Freecodecamp: Type issue in directions

Created on 3 Jun 2018 · 11Comments · Source: freeCodeCamp/freeCodeCamp

Describe your problem and - if possible - how to reproduce it

penguin class should declar the --penguin-skin variable and assign it to gray.
penguin class should declar the --penguin-skin variable and assign it to white.
penguin class should declar the --penguin-skin variable and assign it to orange.

On all three statements, "declar" should read "declare"
Also notice the "--penguin-skin" variable does not change to reflect "--penguin-belly" or "--penguin-beak"

Add a Link to the page with the problem

https://learn.freecodecamp.org/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once

Tell us about your browser and operating system

Browser Name:
Browser Version:
Operating System:

If possible, add a screenshot here

fcc-penguin

Source

KoniKodes

Most helpful comment

Really? The var name in the style section reads:
/* change code below /
--penguin-skin: black;
--penguin-belly: gray;
--penguin-beak: yellow;
/ change code above */

But in the instructions it has all --penguin-skin. The instructions are usually fairly precise on what var should be changed to which assignment.

Did not know that about penguins and feathers (but it makes sense if we are thinking they are birds)

KoniKodes on 5 Jun 2018

👍2 😄1

All 11 comments

Also notice the "--penguin-skin" variable does not change to reflect "--penguin-belly" or "--penguin-beak"

I'm pretty sure that's intentional, but the variable name is not precise. I would suggest renaming the "--penguin-skin" variable to "--penguin-back" or "--penguin-dorsal-skin" or "--penguin-dorsal-feather", something along the lines. Although I don't think it's necessary.(penguins have feather btw)

absolitudo on 5 Jun 2018

😄1

Really? The var name in the style section reads:
/* change code below /
--penguin-skin: black;
--penguin-belly: gray;
--penguin-beak: yellow;
/ change code above */

But in the instructions it has all --penguin-skin. The instructions are usually fairly precise on what var should be changed to which assignment.

Did not know that about penguins and feathers (but it makes sense if we are thinking they are birds)

KoniKodes on 5 Jun 2018

👍2 😄1

I think it should read:
penguin class should declare the --penguin-skin variable and assign it to gray.
penguin class should declare the --penguin-belly variable and assign it to white.
penguin class should declare the --penguin-beak variable and assign it to orange.

KoniKodes on 5 Jun 2018

Hi @KoniKodes. I decided to check the link you sent above and this is a screenshot of what I see. I am not sure where you are getting this issue.

tutorial

Vimal-Raghubir on 5 Jun 2018

@KoniKodes you are right I misunderstood the problem, however, I think this issue has been fixed, for me it's correctly displayed. Is it still an issue on your part?

absolitudo on 5 Jun 2018

Wonderful! It's been fixed.

Thank you so much!

KoniKodes on 5 Jun 2018

In this lesson, I don't know if I don't understand or there is an error. I just can't pass through!!

Phil12sk on 19 Sep 2018

@Phil12sk
I think you forgot to place "background: " before calling the var, just as it looks in body { }.
So it doesn't know where to place the white...

KoniKodes on 19 Sep 2018

The error continues when I add the "background"

Phil12sk on 19 Sep 2018

This seems to be a problem both in Chrome and Firefox. Now on my page, the background stays the original pink color and does not change to #c6faf1 - and the message says to do what we are supposed to do.
error

KoniKodes on 19 Sep 2018

Perhaps the instructions aren't clear. You are supposed to Change the value of --penguin-belly to white in the penguin class.
like this...

  .penguin {
    /* add code below */
    --penguin-belly: white;
    /* add code above */

Since the original issue here has been fixed, I am going to close this. Feel free to create a new issue if either of you think the instructions need to be reworded. Thanks!