Det här projektet går ut på att skapa en responsiv hemsida med enkelt funktionalitet. Sidan ska utvecklas enligt mobile first. Välj upplösning för en telefon ni kan simulera i chrome's inspector. Använd flex-box för att bygga upp strukturen.

Följ instruktionerna i rubrikerna i ordning nedan.

Forka detta projekt till ditt eget konto och klona ner det på datorn. Lägg in din template i mappen och gör en första commit. Commita varje gång ni lagt till något och fått det att fungera. Synca minst i slutet på varje lektion (helst flera gånger varje lektion).

Innan du börjar koda sidan skall du ha gjort två skisser över hur din flex ska fungera, en för mobil och en för desktop.

Själva sidan skall innehålla

• En huvudsida som innehåller
  • Header
  • Navigation
  • Aside (endast synlig på desktop)
  • Main
  • Footer
• En sida med bilder på bananpajer
• En about sida med information om bananpajer
• Ett DOMScript som manipulerar någon del av sidan
  • T.ex visar/döljer något
  • Ändrar storlek/färg/bild på något
  • Animerar något med transition

Gör en version av sidan som är anpassad efter någon surfplatta.

• [CSS Media Queries] https://css-tricks.com/css-media-queries/
• [Javascript querySelector] https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector
• [Egenskaper hos DOMElement i javascript] https://developer.mozilla.org/en-US/docs/Web/API/element
• [<script>-taggen] https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script