mirror of
https://github.com/Alvin-Zilverstand/school.git
synced 2026-03-06 13:26:22 +01:00
add challenge 13
This commit is contained in:
Alvin
2
projects/year_02/challenge_13/Messy-coder-Verbeterd/.gitattributes
vendored
Normal file
2
projects/year_02/challenge_13/Messy-coder-Verbeterd/.gitattributes
vendored
Normal file
@@ -0,0 +1,2 @@
|
||||
# Auto detect text files and perform LF normalization
|
||||
* text=auto
|
||||
@@ -0,0 +1,4 @@
|
||||
# Lorenzo von Matterhorn
|
||||
|
||||
Hello, my name is Lorenzo and this is my portfolio site!
|
||||
|
||||
@@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo van Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="style.css" >
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo van Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<?php require_once("mainmenu.php"); ?>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>Welkom op mijn portofolio!</h1>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,38 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo van Matterhorn - Portofolio</title>
|
||||
<link rel ="stylesheet" href="style.css">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo van Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<?php require_once("mainmenu.php"); ?>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<nav> </nav>
|
||||
<main></main>
|
||||
<main>
|
||||
<h1>Hoe kom je in contact met mij?</h1>
|
||||
<p>Hoi! Ik ben Lorenzo van Matterhorn,</p>
|
||||
<p>Mail me via: <a href="mailto:l.v.m@gmeel.com">Mail mij</a></p>
|
||||
<p>Of bel me op: 06-12345678</p>
|
||||
<p>Je kunt me ook vinden op LinkedIn: <a href="https://www.linkedin.com/in/lorenzovanmatterhorn" target="_blank">Mijn LinkedIn</a></p>
|
||||
<p>Of volg me op GitHub: <a href="https ://github.com/lorenzovanmatterhorn" target="_blank">Mijn GitHub</a></p>
|
||||
<p>Ik kijk ernaar uit om van je te horen!</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,19 @@
|
||||
<?php
|
||||
// =======================
|
||||
// Database configuratie
|
||||
// =======================
|
||||
$host = "localhost";
|
||||
$username = "root";
|
||||
$password = ""; // XAMPP default on Windows is empty password
|
||||
$database = "db_awfulportfolio"; // Use the database name, not the .sql file name
|
||||
|
||||
// Maak verbinding
|
||||
$conn = new mysqli($host, $username, $password, $database);
|
||||
|
||||
// Check verbinding
|
||||
if ($conn->connect_error) {
|
||||
die("Verbinding mislukt: " . $conn->connect_error);
|
||||
}
|
||||
|
||||
// Zorg voor juiste charset
|
||||
$conn->set_charset("utf8mb4");
|
||||
@@ -0,0 +1,157 @@
|
||||
-- phpMyAdmin SQL Dump
|
||||
-- version 5.2.1
|
||||
-- https://www.phpmyadmin.net/
|
||||
--
|
||||
-- Host: localhost:8889
|
||||
-- Generation Time: Sep 10, 2025 at 07:55 AM
|
||||
-- Server version: 8.0.40
|
||||
-- PHP Version: 8.3.14
|
||||
|
||||
SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
|
||||
START TRANSACTION;
|
||||
SET time_zone = "+00:00";
|
||||
|
||||
|
||||
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
|
||||
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
|
||||
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
|
||||
/*!40101 SET NAMES utf8mb4 */;
|
||||
|
||||
--
|
||||
-- Database: `db_awfulportfolio`
|
||||
--
|
||||
CREATE DATABASE IF NOT EXISTS `db_awfulportfolio`
|
||||
DEFAULT CHARACTER SET utf8mb4
|
||||
COLLATE utf8mb4_general_ci;
|
||||
USE `db_awfulportfolio`;
|
||||
|
||||
-- --------------------------------------------------------
|
||||
|
||||
--
|
||||
-- Table structure for table `tb_coretasks`
|
||||
--
|
||||
|
||||
CREATE TABLE `tb_coretasks` (
|
||||
`id` int NOT NULL,
|
||||
`coretask` varchar(10) NOT NULL,
|
||||
`workproces` varchar(10) NOT NULL,
|
||||
`name` varchar(150) NOT NULL,
|
||||
`summary` text NOT NULL,
|
||||
`mytext` text NOT NULL,
|
||||
`document` varchar(150) NOT NULL,
|
||||
`image` varchar(150) NOT NULL,
|
||||
`status` int NOT NULL DEFAULT '1',
|
||||
`timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci;
|
||||
|
||||
-- --------------------------------------------------------
|
||||
|
||||
--
|
||||
-- Table structure for table `tb_projectimages`
|
||||
--
|
||||
|
||||
CREATE TABLE `tb_projectimages` (
|
||||
`uuid` varchar(45) NOT NULL,
|
||||
`project_uuid` varchar(45) NOT NULL,
|
||||
`displayname` varchar(150) NOT NULL,
|
||||
`map` varchar(50) NOT NULL DEFAULT 'images/projects',
|
||||
`name` varchar(150) NOT NULL,
|
||||
`indexnummer` int NOT NULL DEFAULT '0',
|
||||
`status` int NOT NULL DEFAULT '1',
|
||||
`timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci;
|
||||
|
||||
--
|
||||
-- Dumping data for table `tb_projectimages`
|
||||
--
|
||||
|
||||
INSERT INTO `tb_projectimages` (`uuid`, `project_uuid`, `displayname`, `map`, `name`, `indexnummer`, `status`, `timestamp`) VALUES
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d479', '550e8400-e29b-41d4-a716-446655440001', 'Homepage', 'images/projects', 'ecommerce-home.jpg', 1, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d480', '550e8400-e29b-41d4-a716-446655440001', 'Productpagina', 'images/projects', 'ecommerce-product.jpg', 2, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d481', '550e8400-e29b-41d4-a716-446655440001', 'Winkelwagen', 'images/projects', 'ecommerce-cart.jpg', 3, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d482', '550e8400-e29b-41d4-a716-446655440002', 'App Dashboard', 'images/projects', 'portfolio-dashboard.jpg', 1, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d483', '550e8400-e29b-41d4-a716-446655440002', 'Projectweergave', 'images/projects', 'portfolio-project.jpg', 2, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d484', '550e8400-e29b-41d4-a716-446655440003', 'Klantoverzicht', 'images/projects', 'crm-clients.jpg', 1, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d485', '550e8400-e29b-41d4-a716-446655440003', 'Sales Pipeline', 'images/projects', 'crm-pipeline.jpg', 2, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d486', '550e8400-e29b-41d4-a716-446655440004', 'Reservatieformulier', 'images/projects', 'restaurant-booking.jpg', 1, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d487', '550e8400-e29b-41d4-a716-446655440004', 'Admin Dashboard', 'images/projects', 'restaurant-admin.jpg', 2, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d488', '550e8400-e29b-41d4-a716-446655440005', 'Trainingsschema', 'images/projects', 'fitness-workout.jpg', 1, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d489', '550e8400-e29b-41d4-a716-446655440005', 'Voortgangsgrafiek', 'images/projects', 'fitness-progress.jpg', 2, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d490', '550e8400-e29b-41d4-a716-446655440006', 'Projectoverzicht', 'images/projects', 'pm-projects.jpg', 1, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d491', '550e8400-e29b-41d4-a716-446655440006', 'Teamdashboard', 'images/projects', 'pm-team.jpg', 2, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d492', '550e8400-e29b-41d4-a716-446655440007', 'Weeroverzicht', 'images/projects', 'weather-dashboard.jpg', 1, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d493', '550e8400-e29b-41d4-a716-446655440007', 'Voorspellingskaart', 'images/projects', 'weather-forecast.jpg', 2, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d494', '550e8400-e29b-41d4-a716-446655440008', 'Social Analytics', 'images/projects', 'social-analytics.jpg', 1, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d495', '550e8400-e29b-41d4-a716-446655440008', 'Rapportage', 'images/projects', 'social-reports.jpg', 2, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d496', '550e8400-e29b-41d4-a716-446655440009', 'Cursusoverzicht', 'images/projects', 'elearning-courses.jpg', 1, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d497', '550e8400-e29b-41d4-a716-446655440009', 'Quiz Module', 'images/projects', 'elearning-quiz.jpg', 2, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d498', '550e8400-e29b-41d4-a716-446655440010', 'Home Dashboard', 'images/projects', 'smarthome-dashboard.jpg', 1, 1, '2025-08-30 10:14:24'),
|
||||
('f47ac10b-58cc-4372-a567-0e02b2c3d499', '550e8400-e29b-41d4-a716-446655440010', 'Energiemonitor', 'images/projects', 'smarthome-energy.jpg', 2, 1, '2025-08-30 10:14:24');
|
||||
|
||||
-- --------------------------------------------------------
|
||||
|
||||
--
|
||||
-- Table structure for table `tb_projects`
|
||||
--
|
||||
|
||||
CREATE TABLE `tb_projects` (
|
||||
`uuid` varchar(45) NOT NULL,
|
||||
`name` varchar(150) NOT NULL,
|
||||
`description` text NOT NULL,
|
||||
`url` varchar(250) NOT NULL,
|
||||
`status` int NOT NULL DEFAULT '1',
|
||||
`timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci;
|
||||
|
||||
--
|
||||
-- Dumping data for table `tb_projects`
|
||||
--
|
||||
|
||||
INSERT INTO `tb_projects` (`uuid`, `name`, `description`, `url`, `status`, `timestamp`) VALUES
|
||||
('550e8400-e29b-41d4-a716-446655440001', 'E-commerce Website', 'Een volledige e-commerce oplossing ontwikkeld met React, Node.js en MySQL. Bevat een productcatalogus, winkelwagen, betalingsintegratie en beheerpaneel.', '', 1, '2025-08-30 10:14:24'),
|
||||
('550e8400-e29b-41d4-a716-446655440002', 'Portfolio App', 'Mobile applicatie ontwikkeld met React Native voor het tonen van professionele portfolio\'s. Bevat offline mogelijkheden en een CMS.', '', 1, '2025-08-30 10:14:24'),
|
||||
('550e8400-e29b-41d4-a716-446655440003', 'CRM Systeem', 'Customer Relationship Management systeem voor een middelgroot bedrijf met klantprofielen, sales pipeline en rapportagemodule.', '', 1, '2025-08-30 10:14:24'),
|
||||
('550e8400-e29b-41d4-a716-446655440004', 'Restaurant Booking Platform', 'Reservatiesysteem voor restaurants met real-time beschikbaarheid, betalingsverwerking en e-mailbevestigingen.', '', 1, '2025-08-30 10:14:24'),
|
||||
('550e8400-e29b-41d4-a716-446655440005', 'Fitness App', 'Personal trainer app met trainingsschema\'s, voortgangsmonitoring en voedingsadvies op maat.', '', 1, '2025-08-30 10:14:24'),
|
||||
('550e8400-e29b-41d4-a716-446655440006', 'Project Management Tool', 'Collaboratief projectmanagement platform met taakverdeling, tijdsregistratie en teamcommunicatie.', '', 1, '2025-08-30 10:14:24'),
|
||||
('550e8400-e29b-41d4-a716-446655440007', 'Weather Dashboard', 'Real-time weerdashboard met voorspellingen, historische data en persoonlijke locatievoorkeuren.', '', 1, '2025-08-30 10:14:24'),
|
||||
('550e8400-e29b-41d4-a716-446655440008', 'Social Media Analytics', 'Analyseplatform voor social media prestaties met automatische rapportage en adviesmodule.', '', 1, '2025-08-30 10:14:24'),
|
||||
('550e8400-e29b-41d4-a716-446655440009', 'E-learning Platform', 'Online leeromgeving met cursusbeheer, voortgangsmonitoring en interactieve quizzen.', '', 1, '2025-08-30 10:14:24'),
|
||||
('550e8400-e29b-41d4-a716-446655440010', 'Smart Home Controller', 'Dashboard voor het beheren van slimme huisapparaten met automatisering en energie monitoring.', '', 1, '2025-08-30 10:14:24');
|
||||
|
||||
--
|
||||
-- Indexes for dumped tables
|
||||
--
|
||||
|
||||
--
|
||||
-- Indexes for table `tb_coretasks`
|
||||
--
|
||||
ALTER TABLE `tb_coretasks`
|
||||
ADD PRIMARY KEY (`id`);
|
||||
|
||||
--
|
||||
-- Indexes for table `tb_projectimages`
|
||||
--
|
||||
ALTER TABLE `tb_projectimages`
|
||||
ADD PRIMARY KEY (`uuid`);
|
||||
|
||||
--
|
||||
-- Indexes for table `tb_projects`
|
||||
--
|
||||
ALTER TABLE `tb_projects`
|
||||
ADD PRIMARY KEY (`uuid`);
|
||||
|
||||
--
|
||||
-- AUTO_INCREMENT for dumped tables
|
||||
--
|
||||
|
||||
--
|
||||
-- AUTO_INCREMENT for table `tb_coretasks`
|
||||
--
|
||||
ALTER TABLE `tb_coretasks`
|
||||
MODIFY `id` int NOT NULL AUTO_INCREMENT;
|
||||
COMMIT;
|
||||
|
||||
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
|
||||
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
|
||||
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
|
||||
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo van Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="style.css" >
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo van Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<?php require_once("mainmenu.php"); ?>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<nav> </nav>
|
||||
<main></main>
|
||||
<main>
|
||||
<h1>Wie ben ik?</h1>
|
||||
<p>Hoi! Ik ben Lorenzo van Matterhorn, een enthousiaste en leergierige student software developer op het Vista College. Met een passie voor technologie en programmeren werk ik hard om mijn vaardigheden te verbeterd en coole software te maken die mensen echt kunnen gebruiken.</p>
|
||||
<p>Op deze site deel ik mijn projecten, wat ik geleerdt heb en hoe ik steeds beter word als developer. Ik probeer altijd nieuwe dingen uit en leer elke dag bij, zodat ik straks echt goei ben in wat ik doe. Of je nou een werkgever bent, een medeprogrammeur of gewoon niewsgierig, neem vooral een kijkje en zie wat ik allemaal kan.</p>
|
||||
<p>Tijdens mijn studtie ben ik bezig geweest met verschillende projecten, van kleine apps tot grotere websites. Door deze ervaringen heb ik veel geleerd over het ontwerpen en bouwen van software, en hoe je samen met anderen het beste resultaat behaaldt.</p>
|
||||
<p>Ik ben altijd op zoek naar nieuwe uitdagingen en samenwerkingen, dus stuur gerust een berichtje als je interese hebt om samen te werken of gewoon vragen hebt!</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,56 @@
|
||||
<?php
|
||||
// Defineer het pad naar de root van het project
|
||||
$rootPath = $_SERVER['DOCUMENT_ROOT'] . "/messy-coder-verbeterd"; // pas aan als je projectmap anders heet
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo van Matterhorn - Portfolio</title>
|
||||
<!-- CSS pad relatief aan de huidige map -->
|
||||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
|
||||
<header>
|
||||
<h1><a href="/">Lorenzo van Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<?php
|
||||
// Inclusie van het hoofdmenu met absoluut pad
|
||||
require_once($rootPath . "/mainmenu.php");
|
||||
?>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>Kerntaken</h1>
|
||||
|
||||
<h2>Realiseert Software</h2>
|
||||
<ul>
|
||||
<li><a href="kerntaken/b1k1w1.php">B1-K1-W1 - Stemt opdracht af, plant werkzaamheden en bewaakt de voortgang</a></li>
|
||||
<li><a href="kerntaken/b1k1w2.php">B1-K1-W2 - Maakt een technisch ontwerp voor software</a></li>
|
||||
<li><a href="kerntaken/b1k1w3.php">B1-K1-W3 - Realiseert (onderdelen van) software</a></li>
|
||||
<li><a href="kerntaken/b1k1w4.php">B1-K1-W4 - Test software</a></li>
|
||||
<li><a href="kerntaken/b1k1w5.php">B1-K1-W5 - Doet verbetervoorstellen voor de software</a></li>
|
||||
</ul>
|
||||
|
||||
<h2>Voert ICT-projecten uit</h2>
|
||||
<ul>
|
||||
<li><a href="kerntaken/b1k2w1.php">B1-K2-W1 - Werkt samen in een projectteam</a></li>
|
||||
<li><a href="kerntaken/b1k2w2.php">B1-K2-W2 - Presenteert het opgeleverde werk</a></li>
|
||||
<li><a href="kerntaken/b1k2w3.php">B1-K2-W3 - Evalueert de samenwerking</a></li>
|
||||
</ul>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo von Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="kerntaken.css" >
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo von Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="about.php">Over Mij</a></li>
|
||||
<li><a href="projet.php">Projecten</a></li>
|
||||
<li><a href="kerntaken.php">Kerntaken</a></li>
|
||||
<li><a href="contact.php">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>B1-K1-W1</h1>
|
||||
<p>VUL MET DATABASE</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="../script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo von Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="kerntaken.css" >
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo von Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="about.php">Over Mij</a></li>
|
||||
<li><a href="projet.php">Projecten</a></li>
|
||||
<li><a href="kerntaken.php">Kerntaken</a></li>
|
||||
<li><a href="contact.php">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>B1-K1-W2</h1>
|
||||
<p>VUL MET DATABASE</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="../script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo von Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="kerntaken.css" >
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo von Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="about.php">Over Mij</a></li>
|
||||
<li><a href="projet.php">Projecten</a></li>
|
||||
<li><a href="kerntaken.php">Kerntaken</a></li>
|
||||
<li><a href="contact.php">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>B1-K1-W3</h1>
|
||||
<p>VUL MET DATABASE</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="../script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo von Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="kerntaken.css" >
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo von Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="about.php">Over Mij</a></li>
|
||||
<li><a href="projet.php">Projecten</a></li>
|
||||
<li><a href="kerntaken.php">Kerntaken</a></li>
|
||||
<li><a href="contact.php">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>B1-K1-W4</h1>
|
||||
<p>VUL MET DATABASE</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="../script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo von Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="kerntaken.css" >
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo von Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="about.php">Over Mij</a></li>
|
||||
<li><a href="projet.php">Projecten</a></li>
|
||||
<li><a href="kerntaken.php">Kerntaken</a></li>
|
||||
<li><a href="contact.php">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>B1-K1-W5</h1>
|
||||
<p>VUL MET DATABASE</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="../script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo von Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="kerntaken.css" >
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo von Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="about.php">Over Mij</a></li>
|
||||
<li><a href="projet.php">Projecten</a></li>
|
||||
<li><a href="kerntaken.php">Kerntaken</a></li>
|
||||
<li><a href="contact.php">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>B1-K2-W1</h1>
|
||||
<p>VUL MET DATABASE</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="../script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,38 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo von Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="kerntaken.css" >
|
||||
</style>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo von Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="about.php">Over Mij</a></li>
|
||||
<li><a href="projet.php">Projecten</a></li>
|
||||
<li><a href="kerntaken.php">Kerntaken</a></li>
|
||||
<li><a href="contact.php">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>B1-K2-W2</h1>
|
||||
<p>VUL MET DATABASE</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="../script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo von Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="kerntaken.css" >
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo von Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="about.php">Over Mij</a></li>
|
||||
<li><a href="projet.php">Projecten</a></li>
|
||||
<li><a href="kerntaken.php">Kerntaken</a></li>
|
||||
<li><a href="contact.php">Contact</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>B1-K2-W3</h1>
|
||||
<p>VUL MET DATABASE</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="../script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,136 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Segoe UI', Arial, sans-serif;
|
||||
background-color: #FEFCE8;
|
||||
color: #1F2937;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 945px;
|
||||
transition: background-color 0.5s, color 0.5s;
|
||||
}
|
||||
|
||||
body.dark-mode {
|
||||
background-color: #0F172A;
|
||||
color: #F8FAFC;
|
||||
}
|
||||
|
||||
header {
|
||||
position: relative;
|
||||
background: linear-gradient(to top, #FFB347, #FF7E5F);
|
||||
color: white;
|
||||
padding: 90px 15px 150px 15px;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
transition: background-color 0.5s;
|
||||
}
|
||||
|
||||
body.dark-mode header {
|
||||
background: linear-gradient(to top, #1E3A8A, #0F172A);
|
||||
}
|
||||
|
||||
.mountains {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 1920px;
|
||||
height: 150px;
|
||||
background: linear-gradient(to top, #1E3A8A 0%, transparent 100%);
|
||||
clip-path: polygon(
|
||||
0% 100%, 10% 60%, 20% 85%, 30% 50%, 40% 80%,
|
||||
50% 40%, 60% 75%, 70% 45%, 80% 70%, 90% 50%, 100% 100%
|
||||
);
|
||||
}
|
||||
|
||||
.dark-mode .mountains {
|
||||
background: linear-gradient(to top, #1E0A4A 0%, transparent 100%);
|
||||
}
|
||||
|
||||
header h1,
|
||||
header p,
|
||||
header nav {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
header h1 a {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
header h1 a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
nav ul {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
nav li {
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
nav a {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.dark-toggle {
|
||||
position: fixed;
|
||||
top: 15px;
|
||||
right: 15px;
|
||||
color: #1E3A8A;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
z-index: 999;
|
||||
background: transparent;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.dark-toggle::before {
|
||||
content: "🌕";
|
||||
}
|
||||
|
||||
.dark-mode .dark-toggle {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.dark-mode .dark-toggle::before {
|
||||
content: "";
|
||||
}
|
||||
|
||||
main {
|
||||
flex: 1;
|
||||
max-width: 960px;
|
||||
margin: 30px auto;
|
||||
padding: 23px;
|
||||
background-color: white;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 0 10px rgba(0,0,0,0.05);
|
||||
width: 1000px;
|
||||
transition: background-color 0.5s;
|
||||
}
|
||||
|
||||
body.dark-mode main {
|
||||
background-color: #1E293B;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: #1E3A8A;
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
<ul>
|
||||
<li><a href="about.php">Over Mij</a></li>
|
||||
<li><a href="projects.php">Projecten</a></li>
|
||||
<li><a href="kerntaken.php">Kerntaken</a></li>
|
||||
<li><a href="contact.php">Contact</a></li>
|
||||
</ul>
|
||||
@@ -0,0 +1,77 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="nl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lorenzo van Matterhorn - Portofolio</title>
|
||||
<link rel="stylesheet" href="style.css" >
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<button class="dark-toggle" onclick="toggleDarkMode()"></button>
|
||||
<header>
|
||||
<h1><a href=".">Lorenzo van Matterhorn</a></h1>
|
||||
<p>Student Software Developer op het Vista College</p>
|
||||
<nav>
|
||||
<?php require_once("mainmenu.php"); ?>
|
||||
</nav>
|
||||
<div class="mountains"></div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>Projecten</h1>
|
||||
|
||||
<?php
|
||||
include 'database.inc.php';
|
||||
|
||||
$sql = "SELECT * FROM tb_projects";
|
||||
$result = $conn->query($sql);
|
||||
|
||||
if ($result->num_rows > 0) {
|
||||
// Output data of each row
|
||||
while($row = $result->fetch_assoc()) {
|
||||
$uuid = $row["uuid"];
|
||||
$image = getPhoto($uuid);
|
||||
|
||||
echo "<h2>" . htmlspecialchars($row["name"]) . "</h2>";
|
||||
echo "<p>" . htmlspecialchars($row["description"]) . "</p>";
|
||||
echo "<p><a href='" . htmlspecialchars($row["url"]) . "' target='_blank'>Bekijk Project</a></p>";
|
||||
echo "<hr>";
|
||||
}
|
||||
} else {
|
||||
echo "<p>Geen projecten gevonden.</p>";
|
||||
}
|
||||
|
||||
$conn->close();
|
||||
|
||||
function getPhoto($uuid) {
|
||||
$sql = "SELECT * FROM tb_projectimages WHERE project_uuid = ?";
|
||||
// Prepared statement om SQL-injectie te voorkomen
|
||||
global $conn;
|
||||
$stmt = $conn->prepare($sql);
|
||||
$stmt->bind_param("s", $uuid);
|
||||
$stmt->execute();
|
||||
$result = $stmt->get_result();
|
||||
if ($result->num_rows === 0) {
|
||||
return "<img src='images/projects/default.png' alt='Default Project Image' style='max-width:200px; height:auto;'>";
|
||||
}
|
||||
$stmt->close();
|
||||
|
||||
$imagePath = "images/projects/" . $uuid . ".png";
|
||||
if (file_exists($imagePath)) {
|
||||
return "<img src='" . htmlspecialchars($imagePath) . "' alt='Project Image' style='max-width:200px; height:auto;'>";
|
||||
} else {
|
||||
return "<img src='images/projects/default.png' alt='Default Project Image' style='max-width:200px; height:auto;'>";
|
||||
}
|
||||
}
|
||||
?>
|
||||
|
||||
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
© <?php echo date("Y"); ?> Swarley
|
||||
</footer>
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,3 @@
|
||||
function toggleDarkMode() {
|
||||
document.body.classList.toggle('dark-mode');
|
||||
}
|
||||
137
projects/year_02/challenge_13/Messy-coder-Verbeterd/style.css
Normal file
137
projects/year_02/challenge_13/Messy-coder-Verbeterd/style.css
Normal file
@@ -0,0 +1,137 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Segoe UI', Arial, sans-serif;
|
||||
background-color: #FEFCE8;
|
||||
color: #1F2937;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 945px;
|
||||
transition: background-color 0.5s, color 0.5s;
|
||||
}
|
||||
|
||||
body.dark-mode {
|
||||
background-color: #0F172A;
|
||||
color: #F8FAFC;
|
||||
}
|
||||
|
||||
header {
|
||||
position: relative;
|
||||
background: linear-gradient(to top, #FFB347, #FF7E5F);
|
||||
color: white;
|
||||
padding: 90px 15px 150px 15px;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
transition: background-color 0.5s;
|
||||
}
|
||||
|
||||
body.dark-mode header {
|
||||
background: linear-gradient(to top, #1E3A8A, #0F172A);
|
||||
}
|
||||
|
||||
.mountains {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 1920px;
|
||||
height: 150px;
|
||||
background: linear-gradient(to top, #223C89 0%, transparent 100%);
|
||||
clip-path: polygon(
|
||||
0% 100%, 10% 60%, 20% 85%, 30% 50%, 40% 80%,
|
||||
50% 40%, 60% 75%, 70% 45%, 80% 70%, 90% 50%, 100% 100%
|
||||
);
|
||||
}
|
||||
|
||||
.dark-mode .mountains {
|
||||
background: linear-gradient(to top, #1E0A4A 0%, transparent 100%);
|
||||
}
|
||||
|
||||
header h1,
|
||||
header p,
|
||||
header nav {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
header h1 a {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
header h1 a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
nav ul {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
nav li {
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
nav a {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.dark-toggle {
|
||||
position: fixed;
|
||||
top: 15px;
|
||||
right: 15px;
|
||||
color: #1E3A8A;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
z-index: 999;
|
||||
background: transparent;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.dark-toggle::before {
|
||||
content: "🌙";
|
||||
}
|
||||
|
||||
.dark-mode .dark-toggle::before {
|
||||
content: "☀️";
|
||||
}
|
||||
.dark-mode .dark-toggle {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
|
||||
main {
|
||||
flex: 1;
|
||||
max-width: 960px;
|
||||
margin: 30px auto;
|
||||
padding: 23px;
|
||||
background-color: white;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 0 10px rgba(0,0,0,0.05);
|
||||
width: 1000px;
|
||||
transition: background-color 0.5s;
|
||||
}
|
||||
|
||||
body.dark-mode main {
|
||||
background-color: #1E293B;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: #1E3A8A;
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
}
|
||||
Reference in New Issue
Block a user