From 07e03c7f09226361188f560abeb504b55005b410 Mon Sep 17 00:00:00 2001
From: femke-1851 <femkeklijnvelderman1851@gmail.com>
Date: Thu, 3 Oct 2024 15:32:45 +0200
Subject: [PATCH] navigatiebalk gemaakt

---
 .vscode/launch.json | 15 +++++++++++++++
 index.html          | 10 ++++++++++
 style.css           | 10 ++++++++++
 3 files changed, 35 insertions(+)
 create mode 100644 .vscode/launch.json
diff --git a/.vscode/launch.json b/.vscode/launch.json
new file mode 100644
index 0000000..2ba986f
--- /dev/null
+++ b/.vscode/launch.json
@@ -0,0 +1,15 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "chrome",
+            "request": "launch",
+            "name": "Launch Chrome against localhost",
+            "url": "http://localhost:8080",
+            "webRoot": "${workspaceFolder}"
+        }
+    ]
+}
\ No newline at end of file
diff --git a/index.html b/index.html
index 5be5e9b..33d39c3 100644
--- a/index.html
+++ b/index.html
@@ -1,11 +1,21 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+    
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>GitHub Classroom Opdracht</title>
     <link rel="stylesheet" href="style.css">
 </head>
+<body>
+    <body>
+        <div class="topnav">
+           <a href="index.html">home</a>
+           <a href=".html">about</a>
+           <a href=".html">contact</a>
+         </div>
+   <div> 
+   </body>
 <body>
     <h1>Welkom bij de GitHub Classroom Opdracht!</h1>
 	<!-- Voeg hier een paragraaf toe. -->
diff --git a/style.css b/style.css
index 5aa01dd..c5dcc41 100644
--- a/style.css
+++ b/style.css
@@ -30,3 +30,13 @@ th, td {
 }
 
 /* Student B zal hier extra stijlen toevoegen voor de ongeordende lijst */
+
+div.topnav {
+    background-color: #ff0000;
+    overflow: hidden;
+    display: flex;
+    justify-content: space-between;
+    height: 50px;
+    width: 100%;
+    ;
+}
