Do intake in README

public/README.md

@@ -0,0 +1,221 @@
+# Procesverslag
+Nb. Door *open* toe te voegen aan een *details* element kun je deze standaard open zetten. Fijn om dat steeds voor de relevante stuk(ken) te doen.
+
+## Jij
+
+<details open>
+  <summary>uitwerken voor kick-off werkgroep</summary>
+
+  ### Auteur:
+  Hans de Zwart
+
+  #### Je startniveau:
+  Tussen rood en zwart in
+
+  #### Je focus:
+  Ik weet niet zo goed wat surface plane is?
+ 
+</details>
+
+## Je website
+
+<details open>
+  <summary>uitwerken voor kick-off werkgroep</summary>
+
+  ### Je opdracht:
+  Ik denk dat ik de artikelpagina van de Groene Amsterdammer wil namaken. Bijvoorbeeld zoiets als deze: [Rijk en vol en vreemd](https://www.groene.nl/artikel/rijk-en-vol-en-vreemd)
+
+  #### Screenshot(s) van de eerste pagina (small screen): 
+  hier de naam van de pagina  
+  <img src="readme-images/groene-1.png" width="375px" alt="omschrijving van de pagina">
+
+  #### Screenshot(s) van de tweede pagina (bigger screen):
+  hier de naam van de pagina  
+  <img src="readme-images/groene-2.png" width="500px" alt="omschrijving van de pagina">
+ 
+</details>
+
+## Toegankelijkheidstest 1/2 (week 1)
+
+<details>
+  <summary>uitwerken na test in 2<sup>e</sup> werkgroep</summary>
+
+  ### Bevindingen
+  Lijst met je bevindingen die in de test naar voren kwamen:
+
+</details>
+
+
+
+## Breakdownschets (week 1)
+
+<details>
+  <summary>uitwerken na afloop 3<sup>e</sup> werkgroep</summary>
+
+  ### de hele pagina: 
+  <img src="readme-images/dummy-plaatje.jpg" width="375px" alt="breakdown van de hele pagina">
+
+  ### dynamisch deel (bijv menu): 
+  <img src="readme-images/dummy-plaatje.jpg" width="375px" alt="breakdown van een dynamisch deel">
+
+  ### wellicht nog een dynamisch deel (bijv filter): 
+  <img src="readme-images/dummy-plaatje.jpg" width="375px" alt="breakdown van nog een dynamisch deel">
+
+</details>
+
+
+
+
+
+## Voortgang 1 (week 2)
+
+<details>
+  <summary>uitwerken voor 1<sup>e</sup> voortgang</summary>
+
+  ### Stand van zaken
+  hier dit ging goed & dit was lastig (neem ook screenshots op van delen van je website en code)
+
+
+  ### Agenda voor meeting
+  samen met je groepje opstellen
+
+  | student 1      | student 2          | student 3    | student 4        |
+  | ---            | ---                | ---          | ---              |
+  | dit bespreken  | en dit             | en ik dit    | en dan ik dat    |
+  | en dat ook nog | dit als er tijd is | nog een punt | dit wil ik zeker |
+  | ...            | ...                | ...          | ...              |
+
+
+  ### Verslag van meeting
+  hier na afloop snel de uitkomsten van de meeting vastleggen
+
+  - punt 1
+  - punt 2
+  - nog een punt
+  - ...
+
+</details>
+
+
+
+
+
+## Voortgang 2 (week 3)
+
+<details>
+  <summary>uitwerken voor 2<sup>e</sup> voortgang</summary>
+
+  ### Stand van zaken
+  hier dit ging goed & dit was lastig (neem ook screenshots op van delen van je website en code)
+
+
+  ### Agenda voor meeting
+  samen met je groepje opstellen
+
+  | student 1      | student 2          | student 3    | student 4        |
+  | ---            | ---                | ---          | ---              |
+  | dit bespreken  | en dit             | en ik dit    | en dan ik dat    |
+  | en dat ook nog | dit als er tijd is | nog een punt | dit wil ik zeker |
+  | ...            | ...                | ...          | ...              |
+
+
+  ### Verslag van meeting
+  hier na afloop snel de uitkomsten van de meeting vastleggen
+
+  - punt 1
+  - punt 2
+  - nog een punt
+- ...
+
+</details>
+
+
+
+
+
+## Toegankelijkheidstest 2/2 (week 4)
+
+<details>
+  <summary>uitwerken na test in 9<sup>e</sup> werkgroep</summary>
+
+  ### Bevindingen
+  Lijst met je bevindingen die in de test naar voren kwamen (geef ook aan wat er verbeterd is):
+
+</details>
+
+
+
+
+
+## Voortgang 3 (week 4)
+
+<details>
+  <summary>uitwerken voor 3<sup>e</sup> voortgang</summary>
+
+  ### Stand van zaken
+  hier dit ging goed & dit was lastig (neem ook screenshots op van delen van je website en code)
+
+
+  ### Agenda voor meeting
+  samen met je groepje opstellen
+
+  | student 1      | student 2          | student 3    | student 4        |
+  | ---            | ---                | ---          | ---              |
+  | dit bespreken  | en dit             | en ik dit    | en dan ik dat    |
+  | en dat ook nog | dit als er tijd is | nog een punt | dit wil ik zeker |
+  | ...            | ...                | ...          | ...              |
+
+
+  ### Verslag van meeting
+  hier na afloop snel de uitkomsten van de meeting vastleggen
+
+  - punt 1
+  - punt 2
+  - nog een punt
+  - ...
+
+</details>
+
+
+
+
+
+## Eindgesprek (week 5)
+
+<details>
+  <summary>uitwerken voor eindgesprek</summary>
+
+  ### Je uitkomst - karakteristiek screenshots:
+  <img src="readme-images/dummy-plaatje.jpg" width="375px" alt="uitomst opdracht 1">
+
+
+  ### Dit ging goed/Heb ik geleerd: 
+  Korte omschrijving met plaatjes
+
+  <img src="readme-images/dummy-plaatje.jpg" width="375px" alt="top">
+
+
+  ### Dit was lastig/Is niet gelukt:
+  Korte omschrijving met plaatjes
+
+  <img src="readme-images/dummy-plaatje.jpg" width="375px" alt="bummer">
+</details>
+
+
+
+
+
+## Bronnenlijst
+
+<details open>
+  <summary>continu bijhouden terwijl je werkt</summary>
+
+  Nb. Wees specifiek ('css-tricks' als bron is bijv. niet specifiek genoeg). 
+  Nb. ChatGpT en andere AI horen er ook bij.
+  Nb. Vermeld de bronnen ook in je code.
+
+  1. bron 1
+  2. bron 2
+  3. ...
+
+</details>

public/images/favicon.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200">
+  <defs>
+    <style>
+      .dark { fill: #570706; }
+      .light { fill: #F39019; }
+    </style>
+  </defs>
+
+  <rect class="dark" x="0" y="0" width="200" height="200"/>
+  <polygon class="light" points="200 0 200 200 0 200 200 0"/>
+
+</svg>

public/index.html

@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="nl">
+	
+<head>
+	<meta charset="UTF-8">
+	<meta name="author" content="jouw naam">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	
+	<title>Howdy FED2526</title>
+
+	<link href="styles/style.css" rel="stylesheet">
+
+	<link rel="icon" type="image/svg+xml" href="images/favicon.svg">
+</head>
+
+<body>
+	<h1>Howdy FED2526</h1>
+
+	<script defer src="scripts/script.js"></script>
+</body>
+	
+</html>

public/scripts/script.js

@@ -0,0 +1,2 @@
+// JavaScript Document
+console.log("hi");

public/styles/style.css

@@ -0,0 +1,31 @@
+/**************/
+/* CSS REMEDY */
+/**************/
+*, *::after, *::before {
+  box-sizing:border-box;  
+}
+
+
+
+
+
+
+/*********************/
+/* CUSTOM PROPERTIES */
+/*********************/
+:root {
+	/* startje */
+	--color-text:#111;
+	--color-background:#eee;
+}
+
+
+
+
+
+/****************/
+/* JOUW STYLING */
+/****************/
+
+/* jouw code */
+