alvin/Challenge_15_Magazijn_App_Maken
1
0
Fork 0
mirror of https://github.com/Alvin-Zilverstand/Challenge_15_Magazijn_App_Maken.git synced 2026-03-06 21:29:20 +01:00
Code Issues Packages Projects Releases Wiki Activity

Implement multilingual support with Dutch and English translations across various pages and functionalities

Browse Source
This commit is contained in:
Alvin
2025-11-05 09:37:04 +01:00
parent 1d5b007577
commit febdcf8217
10 changed files with 304 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
public/add-item.html
View File

@@ -12,25 +12,35 @@
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container">
<a class="navbar-brand" href="#">School Warehouse - Admin</a>
<a class="navbar-brand" href="#" data-translate="school-warehouse">School Magazijn - Admin</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="admin.html">Inventory</a>
<a class="nav-link" href="admin.html" data-translate="inventory">Voorraad</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="add-item.html">Add New Item</a>
<a class="nav-link active" href="add-item.html" data-translate="add-new-item">Nieuw Artikel Toevoegen</a>
</li>
<li class="nav-item">
<a class="nav-link" href="admin-reservations.html">Reservations</a>
<a class="nav-link" href="admin-reservations.html" data-translate="reservations">Reserveringen</a>
</li>
</ul>
<div class="navbar-nav ms-auto">
<div class="language-toggle nav-item">
<div class="language-switcher">
<button class="language-btn active" id="nlBtn" data-lang="nl">
<i class="fas fa-flag me-1"></i>Nederlands
</button>
<button class="language-btn" id="enBtn" data-lang="en">
<i class="fas fa-flag me-1"></i>English
</button>
</div>
</div>
<span class="nav-item nav-link text-light" id="userInfo"></span>
<a class="nav-link" href="#" id="logoutBtn">Logout</a>
<a class="nav-link" href="#" id="logoutBtn" data-translate="logout">Logout</a>
</div>
</div>
</div>
@@ -41,13 +51,22 @@
<div class="col-md-8">
<div class="card">
<div class="card-header">
<h3>Add New Item</h3>
<h3 data-translate="add-new-item">Nieuw Artikel Toevoegen</h3>
</div>
<div class="card-body">
<form id="addItemForm">
<div class="mb-3">
<label for="itemName" class="form-label">Item Name</label>
<input type="text" class="form-control" id="itemName" required>
<label class="form-label">Item Name</label>
<div class="row">
<div class="col-md-6">
<label for="itemNameNl" class="form-label text-muted small">Dutch</label>
<input type="text" class="form-control" id="itemNameNl" placeholder="Nederlandse naam" required>
</div>
<div class="col-md-6">
<label for="itemNameEn" class="form-label text-muted small">English</label>
<input type="text" class="form-control" id="itemNameEn" placeholder="English name" required>
</div>
</div>
</div>
<div class="mb-3">
<label for="itemLocation" class="form-label">Location</label>
@@ -58,8 +77,17 @@
</select>
</div>
<div class="mb-3">
<label for="itemDescription" class="form-label">Description</label>
<textarea class="form-control" id="itemDescription" rows="3"></textarea>
<label class="form-label">Description</label>
<div class="row">
<div class="col-md-6">
<label for="itemDescriptionNl" class="form-label text-muted small">Dutch</label>
<textarea class="form-control" id="itemDescriptionNl" rows="3" placeholder="Nederlandse beschrijving"></textarea>
</div>
<div class="col-md-6">
<label for="itemDescriptionEn" class="form-label text-muted small">English</label>
<textarea class="form-control" id="itemDescriptionEn" rows="3" placeholder="English description"></textarea>
</div>
</div>
</div>
<div class="mb-3">
<label for="itemQuantity" class="form-label">Quantity</label>
@@ -87,6 +115,7 @@
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
<script src="js/translations.js"></script>
<script src="js/add-item.js"></script>
</body>
</html>