public

History

Marie Malarme 571f6b9585 Updated the instructions for the HTML files which were confusing because the students don't need to use them.		4 years ago
..
README.md	Updated the instructions for the HTML files which were confusing because the students don't need to use them.	4 years ago
data.js	adding dom content	4 years ago
index.html	Updated the `readme` to indicate the files provided + the right path matching the new structure of files.	4 years ago

Fifty shades of cold

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

Check the colors array provided in the data file below.

Write the generateClasses function which creates a <style> tag in the <head> tag and generates, for each color of colors, a class setting the background attribute and taking the color as value, like following:

.indianred {
  background: indianred;
}

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="indianred">indianred</div>

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

Check the HTML file index.html, which includes:
- the JS script running some code, and which will also allow to run yours
- some CSS pre-styled classes: feel free to use those as they are, or modify them
Import colors from the data file data.js

You can see an example of the expected result here