fdnd-agency · Lmikkers · Jan 22, 2024 · Jan 22, 2024 · Jan 22, 2024 · Jan 22, 2024
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
diff --git a/README.md b/README.md
@@ -1,6 +1,80 @@
-<img width="123" alt="image" src="https://github.com/fdnd-agency/funda/assets/1061632/971b90d8-5c19-46a1-a19c-5414aee155c3">
+# Funda Design Challenge Sprint 6
 
-# Projecten
+<img src="https://github.com/Lmikkers/funda/assets/94455811/60f4b070-09ce-48e2-8338-ccde900e7967">
+https://lmikkers.github.io/funda/
 
-* Jaar 1: [Design Challenge Sprint 6](https://github.com/fdnd-agency/funda/blob/main/design-challenge-sprint-6/README.md) 
-* Jaar 2: [Favourite Houses](https://github.com/fdnd-agency/funda/blob/main/favourite-houses/README.md)  
+
+## Inhoudsopgave
+- [Opdrachtgever](https://github.com/Lmikkers/funda/blob/main/README.md#opdrachtgever)
+- [Gebruik website](https://github.com/Lmikkers/funda/blob/main/README.md#gebruik-van-website)
+- [Kenmerken](https://github.com/Lmikkers/funda/blob/main/README.md#kenmerken)
+- [Checklist](https://github.com/Lmikkers/funda/blob/main/README.md#checklist-pagina)
+
+## Opdrachtgever 
+### Funda
+Funda is een vastgoedplatform voor consumenten en ondernemers. Via Funda kun je huizen kopen, verkopen en huren.
+
+Opdrachtomschrijving
+
+> Het maken (nabouwen) van een detailpagina en verbeteren waar nodig is in hardcode vanille html, css en javascript. En ervoor zorgen dat de code mobile first wordt gebouwd.
+
+## Gebruik van website
+Je kunt de website op Telefoon, Tablet en desktop openen op deze link: https://lmikkers.github.io/funda/
+[https://lmikkers.github.io/funda/](https://lmikkers.github.io/funda/)
+
+## Kenmerken
+- HTML
+- CSS
+- Responsive
+
+### HTML
+Structuur: `<header>` `<main>` `<footer>`
+
+Onderverdeeld in:  `<nav>` `<section>` `<article>` `<div>`
+
+### CSS
+De CSS heb ik gelinkt in de `<head>`
+
+Ik heb de veel voorkomende styles genoteerd in de `root`, zodat ik dit overal makkelijk kan gebruiken
+```css
+:root {
+    --mainFont: 'Proxima Nova', sans-serif;
+    --mainHeaderFontWeight: 600;
+    --mainFontWeight: 400;
+    --secondFontWeight: 350;
+    --thirdFontWeight: 300;
+    --mainFontSize: 20px;
+    --secondFontSize: 16px;
+
+    --mainColor: #F7A100;
+    --mainFontColor: #333333;
+    --secondFontColor: #999999;
+    --thirdFontColor: #0071B3;
+    --hoverOrangeColor: #de9000;
+
+    --borderLight: #ededed;
+    --borderDark: #CCCCCC;
+}
+```
+
+### Responsive
+Om te zorgen dat de website goed functioneert op meerdere devices heb ik gebruikt gemaakt van `@media only screen and (min-width: ...px)`
+
+## Checklist pagina
+
+- [x] Buurt blokje
+- [x] Kaart blokje
+- [x] Reis blokje
+- [x] Responsive nav-bar
+- [x] Responsive footer
+- [x] Responsive sections
+- [x] Responsive main-image
+- [x] Kenmerken tabel
+- [ ] Kenmerken tabel op mobiel in/uit klappen
+- [x] Belangrijkste kenmerken
+- [x] Uitklapbare beschrijving
+- [x] Ing sectie
+- [x] Vergelijkbaar in de buurt sectie
+- [x] Sidebar
+- [ ] Menu subitems
+- [ ] Mobiele dropdown
diff --git a/assets/360Fotos.png b/assets/360Fotos.png
diff --git a/assets/Kaart.png b/assets/Kaart.png
diff --git a/assets/Kaart.svg b/assets/Kaart.svg
diff --git a/assets/Map.svg b/assets/Map.svg
diff --git a/assets/bmScreenshot.png b/assets/bmScreenshot.png
diff --git a/assets/fundawonen-logo.svg b/assets/fundawonen-logo.svg
diff --git a/assets/hoofdImage.jpg b/assets/hoofdImage.jpg
diff --git a/assets/icons/360.svg b/assets/icons/360.svg
diff --git a/assets/icons/Calendar.svg b/assets/icons/Calendar.svg
diff --git a/assets/icons/Clock.svg b/assets/icons/Clock.svg
diff --git a/assets/icons/Energy-label.svg b/assets/icons/Energy-label.svg
diff --git a/assets/icons/ING.svg b/assets/icons/ING.svg
diff --git a/assets/icons/Map-illustration.svg b/assets/icons/Map-illustration.svg
diff --git a/assets/icons/Phone.svg b/assets/icons/Phone.svg
diff --git a/assets/icons/Thumbnail.svg b/assets/icons/Thumbnail.svg
diff --git a/assets/icons/alleMedia.svg b/assets/icons/alleMedia.svg
diff --git a/assets/icons/arrowDown.svg b/assets/icons/arrowDown.svg
diff --git a/assets/icons/arrowRight.svg b/assets/icons/arrowRight.svg
diff --git a/assets/icons/bed.svg b/assets/icons/bed.svg