You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 
lee bc58ab2518 fix(dom-subjects): renaming css files to data.css files 2 years ago
..
README.md fix(dom-subjects): renaming css files to data.css files 2 years ago
fifty-shades-of-cold.data.css fix(dom-subjects): renaming css files to data.css files 2 years ago
fifty-shades-of-cold.data.js fifty-shades-of-cold: change file naming 4 years ago
fifty-shades-of-cold.html fix(dom-subjects): renaming css files to data.css files 2 years ago

README.md

Fifty shades of cold

Instructions

You've been asked to freshen up a webpage, by displaying shades of cold colors.

Check the colors array provided in the data file below.

Write the generateClasses function. It creates a <style> tag inside the <head>. It should generate one class for each color in the colors array, which sets the background attribute like so:

.blue {
  background: blue;
}

Write the generateColdShades function which creates a <div> for each color of the colors array, whose name contains aqua, blue, turquoise, green, cyan, navy or purple. Each <div> must have the corresponding generated class and display the name of the color, like following:

<div class="blue">blue</div>

The function choseShade is triggered when clicking on a div. Write the body of this function. It accepts the shade of the clicked element as an argument, and replaces all the classes of all the other elements by the chosen shade.

Files

You only need to create & submit the JS file fifty-shades-of-cold.js, we're providing you the following files to download and test locally:

Expected result

You can see an example of the expected result here

Notions