From d142e78db6e6608e1fea0ca6ff39f7985b2b327c Mon Sep 17 00:00:00 2001
From: vista-man <524715@vistacollege.nl>
Date: Tue, 11 Feb 2025 13:24:28 +0100
Subject: [PATCH] Move CSS styles to a separate stylesheet for better
organization
---
website/index.html | 72 +---------------------------------------------
website/style.css | 69 ++++++++++++++++++++++++++++++++++++++++++++
2 files changed, 70 insertions(+), 71 deletions(-)
create mode 100644 website/style.css
diff --git a/website/index.html b/website/index.html
index 5ca330f..b92a8b5 100644
--- a/website/index.html
+++ b/website/index.html
@@ -4,77 +4,7 @@
McDonald's Menu
-
+
diff --git a/website/style.css b/website/style.css
new file mode 100644
index 0000000..bd9f179
--- /dev/null
+++ b/website/style.css
@@ -0,0 +1,69 @@
+body {
+ font-family: Arial, sans-serif;
+ margin: 0;
+ display: flex;
+}
+
+/* Linkerkant: Het menu */
+.menu-list {
+ width: 30%;
+ background-color: #f2c14e;
+ padding: 20px;
+ height: 100vh;
+ overflow-y: auto;
+}
+
+.menu-list h2 {
+ color: #d32f2f;
+ font-size: 2em;
+ margin-bottom: 20px;
+}
+
+.menu-item {
+ background-color: #fff;
+ padding: 15px;
+ margin: 10px 0;
+ border-radius: 8px;
+ cursor: pointer;
+ font-size: 1.2em;
+}
+
+.menu-item:hover {
+ background-color: #f59e42;
+}
+
+/* Rechterkant: Detail weergave */
+.menu-detail {
+ width: 70%;
+ background-color: white;
+ padding: 20px;
+ display: none; /* Start verborgen */
+}
+
+.menu-detail img {
+ width: 100%;
+ max-width: 400px;
+ height: auto;
+ margin-bottom: 20px;
+}
+
+.menu-detail h2 {
+ color: #d32f2f;
+ font-size: 2em;
+}
+
+.menu-detail p {
+ font-size: 1.2em;
+ color: #555;
+ margin: 20px 0;
+}
+
+/* Footer */
+footer {
+ text-align: center;
+ padding: 20px;
+ background-color: #f2c14e;
+ position: fixed;
+ bottom: 0;
+ width: 100%;
+}
\ No newline at end of file