Current directory: /home/klas4s23/domains/585455.klas4s23.mid-ica.nl/public_html/Gastenboek/uploads
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta author="Rick Deurloo">
<meta name="description" content="Website description">
<meta name="keywords" content="Website keywords">
<link rel="stylesheet" href="https://site-assets.fontawesome.com/releases/v6.7.2/css/all.css">
<link rel="stylesheet" href="https://site-assets.fontawesome.com/releases/v6.7.2/css/sharp-thin.css">
<link rel="stylesheet" href="https://site-assets.fontawesome.com/releases/v6.7.2/css/sharp-solid.css">
<link rel="stylesheet" href="https://site-assets.fontawesome.com/releases/v6.7.2/css/sharp-regular.css">
<link rel="stylesheet" href="https://site-assets.fontawesome.com/releases/v6.7.2/css/sharp-light.css">
<link rel="stylesheet" href="./styles/dist/css/style.css">
<link rel="icon" href="./assets/favicon-black.ico" type="image/x-icon" media="(prefers-color-scheme: light)">
<link rel="icon" href="./assets/favicon-white.ico" type="image/x-icon" media="(prefers-color-scheme: dark)">
<script>
let lang = localStorage.getItem('selectedLanguage') || 'en';
const preload = document.createElement('link');
preload.rel = 'preload';
preload.href = `./js/translations/${lang}.json`;
preload.as = 'fetch';
preload.crossOrigin = 'anonymous';
document.head.appendChild(preload);
</script>
<link rel="preload" href="./js/translation.js" as="script">
<link rel="preload" href="./js/projects.json" as="fetch" crossorigin="anonymous">
<title data-translate-title="projectsNav">Portfolio | Projects</title>
</head>
<body>
<div class="floating-dots-container"></div>
<header>
<div class="language-toggle">
<div class="lang-option selected" data-lang="en" data-translate="englishOption">English</div>
<div class="lang-option" data-lang="nl" data-translate="dutchOption">Dutch</div>
<div class="lang-option selected responsive" data-lang="en">EN</div>
<div class="lang-option responsive" data-lang="nl">NL</div>
</div>
<nav>
<a href="index.html" class="home" data-translate="homeNav">Home</a>
<a href="index.html" class="home">
<i class="fa-solid fa-house"></i>
</a>
<a href="about-me.html" class="about-me" data-translate="aboutMeNav">About me</a>
<a href="about-me.html" class="about-me">
<i class="fa-solid fa-user"></i>
</a>
<a href="projects.html" class="projects active" data-translate="projectsNav">Projects</a>
<a href="projects.html" class="projects active">
<i class="fa-solid fa-sharp fa-briefcase"></i>
</a>
<div class="filter">
<div class="filter-btn" id="filterBtn">
<i class="fa-solid fa-filter"></i>
</div>
<div class="filter-content" id="filterContent">
<div class="radios">
<div class="input-wrapper">
<input type="radio" name="filter" id="oldest">
<label for="oldest" data-translate="oldestFilter">Oldest</label>
</div>
<div class="input-wrapper">
<input type="radio" name="filter" id="newest" checked>
<label for="newest" data-translate="newestFilter">Newest</label>
</div>
</div>
<div class="checkboxes">
<div class="input-wrapper">
<input type="checkbox" name="filter" id="school-individual">
<label for="school-individual" data-translate="schoolIndividualFilter">School individual</label>
</div>
<div class="input-wrapper">
<input type="checkbox" name="filter" id="school-group">
<label for="school-group" data-translate="schoolGroupFilter">School Group</label>
</div>
<div class="input-wrapper">
<input type="checkbox" name="filter" id="personal">
<label for="personal" data-translate="personalFilter">Personal</label>
</div>
</div>
</div>
</div>
</nav>
<a href="contact-me.html" class="contact-me">
<span data-translate="contactMeNav">Contact me</span>
<span class="responsive">
<i class="fa-solid fa-envelope"></i>
</span>
</a>
</header>
<div class="loader">
<div class="spinner"></div>
</div>
<main class="projects-main">
<div class="projects-container">
<!-- Projects will be loaded here via json -->
</div>
</main>
<script src="./js/load-projects.js"></script>
<script src="./js/dots.js" defer></script>
<script src="./js/filter.js" defer></script>
<script src="./js/translation.js"></script>
</body>
</html>