Lab 7 - Dark Grid

I am the terror that flaps in the night! - Responsive mode: Dark 🦆

Dark Grid

  1. Continue from where you left off last lab.
  2. Create a new file called dark.css
  3. edit your index.html to include a link to dark.css in the head of the document just before it links to debug.css
  4. edit dark.css such that if the user has a “dark” preference, the page will be styled with a dark theme.
  5. add a javascript file called script.js and a script tag to the bottom of the body of the html file that loads script.js.
  6. in script.js, add an event listener such that when the user clicks any of the 3 nav items, the page will render with the selected color scheme.
    1. most often, dynamic styling is best implemented via (a) defining style rules for corresponding classes in css and (b) adding/removing classes to the necessary elements dynamically