CSS Grid Layouts

Instructions

• Find a website layout that inspires you
• Choose a specific colour scheme
  • example scheme template:
  • light color (a variant of white)
  • dark color (a variant of black)
  • primary theme color (brand main color)
  • accent color (complimentary color)
• Use CSS Grid to create the overall site layout
  • Wrapping the whole page in a div is recommended but not necessary
  • Use Grid By Example for layout code
    • If you're feeling spicy, create your own layout
• Use flexbox to stylize the layout of the specific sections (header, main, section...) as we've been doing in class
• When Finished, either send the github link or codepen link to Brightspace
  • Even if you're not happy with your design or it's broken, submit what you've got - This will help me know how to better offer support.