alvin/Schoolkantine
1
0
Fork 0
mirror of https://github.com/Alvin-Zilverstand/Schoolkantine.git synced 2026-03-07 05:53:00 +01:00
Code Issues Packages Projects Releases Wiki Activity

asdasd

Browse Source
This commit is contained in:
cowboykipnugget
2025-02-12 09:24:46 +01:00
parent ff98abaaf0
commit 4dc1f170e2
3 changed files with 16 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
website/index.html
View File

@@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vista Menu</title> <title>Het hoofdmenu van de Mees</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<link rel="icon" href="media/favicon.ico" type="image/x-icon"> <link rel="icon" href="media/favicon.ico" type="image/x-icon">
</head> </head>
@@ -18,10 +18,16 @@
<div class="menu-item" onclick="showItemDetails('deserts')">ijsjes</div> <div class="menu-item" onclick="showItemDetails('deserts')">ijsjes</div>
</div> </div>
<!-- Rechterkant detailweergave -->
<div id="menu-detail" class="menu-detail"> <div id="menu-detail" class="menu-detail">
<h2 id="item-title">Selecteer een item</h2> <h2 id="item-title">Selecteer een item</h2>
<img id="item-image" src="" alt=""> <img id="item-image" src="" alt="">
<p id="=item discription"></p>
</div>
<!-- Rechterkant detailweergave -->
<div id="menu-detail" class="menu-detail">
<h2 id="item-title">Selecteer een item</h2>
<img id="item-image" src="https://thumbs.dreamstime.com/b/submarine-sandwich-ham-cheese-clipping-path-egg-tomato-cucumber-lettuce-white-48580716.jpg" alt="https://thumbs.dreamstime.com/b/submarine-sandwich-ham-cheese-clipping-path-egg-tomato-cucumber-lettuce-white-48580716.jpg">
<p id="item-description"></p> <p id="item-description"></p>
</div> </div>

6
website/script.js
View File

@@ -1,8 +1,8 @@
// Functie om de details van een geselecteerd item weer te geven // Functie om de details van een geselecteerd item weer te geven
function showItemDetails(item) { function showItemDetails(item) {
var title = ""; let title = '';
var image = ""; let description = '';
var description = ""; let imageSrc = '';
// Afhankelijk van het geselecteerde item, pas de details aan // Afhankelijk van het geselecteerde item, pas de details aan
if (item === 'Broodjes') { if (item === 'Broodjes') {

5
website/style.css
View File

@@ -58,6 +58,11 @@ body {
margin: 20px 0; margin: 20px 0;
} }
#item-image {
max-width: 200px;
margin-bottom: 20px;
}
/* Footer */ /* Footer */
footer { footer {
text-align: center; text-align: center;