365DevNet/Nicole
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove all image assets, HTML files, stylesheets, scripts, and documentation from the project.

Browse Source
This commit is contained in:
becarta
2025-05-18 19:18:49 +02:00
parent ed1aab181f
commit 0fe2099c9d
22 changed files with 0 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

274
Old/index.html Normal file
View File

@@ -0,0 +1,274 @@
<!DOCTYPE html>
<html lang="nl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JPM Security & Services - Versie Selectie</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
<style>
:root {
--primary-dark: #1a1f2c;
--primary-light: #ffffff;
--accent-color: #2c3e50;
--accent-hover: #34495e;
--text-light: #f8f9fa;
--text-dark: #2c3e50;
--gradient-start: #2c3e50;
--gradient-end: #3498db;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: #f8f9fa;
color: var(--text-dark);
line-height: 1.6;
}
.header {
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
color: var(--text-light);
padding: 4rem 0;
text-align: center;
margin-bottom: 4rem;
position: relative;
overflow: hidden;
}
.header::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('cytonn-photography-n95VMLxqM2I-unsplash.jpg') center/cover;
opacity: 0.1;
z-index: 0;
}
.header .container {
position: relative;
z-index: 1;
}
.header h1 {
font-weight: 800;
letter-spacing: 8px;
margin-bottom: 0;
font-size: 3.5rem;
text-shadow: 2px 2px 4px rgba(0,0,0,0.2);
}
.header h2 {
font-size: 1.4rem;
letter-spacing: 4px;
font-weight: 400;
margin-bottom: 1.5rem;
text-transform: uppercase;
}
.version-card {
background: var(--primary-light);
border: none;
border-radius: 15px;
overflow: hidden;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
height: 100%;
margin-bottom: 2rem;
box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}
.version-card:hover {
transform: translateY(-10px) scale(1.02);
box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}
.version-img {
height: 250px;
background-size: cover;
background-position: center;
position: relative;
overflow: hidden;
}
.version-img::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 50%;
background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
}
.version-content {
padding: 2rem;
position: relative;
}
.version-content h3 {
margin-bottom: 1.5rem;
font-weight: 700;
color: var(--accent-color);
font-size: 1.8rem;
}
.version-content p {
color: #666;
margin-bottom: 1.5rem;
}
.btn-view {
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
color: var(--text-light);
border: none;
padding: 12px 25px;
border-radius: 30px;
text-transform: uppercase;
font-weight: 600;
letter-spacing: 1px;
transition: all 0.3s ease;
display: inline-block;
margin-top: 1rem;
position: relative;
overflow: hidden;
}
.btn-view::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
transition: 0.5s;
}
.btn-view:hover {
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}
.btn-view:hover::before {
left: 100%;
}
.footer {
background: var(--primary-dark);
color: var(--text-light);
padding: 3rem 0;
text-align: center;
margin-top: 4rem;
}
.footer p {
margin-bottom: 0;
opacity: 0.8;
}
.version-1-img { background-image: url('cytonn-photography-n95VMLxqM2I-unsplash.jpg'); }
.version-2-img { background-image: url('cytonn-photography-n95VMLxqM2I-unsplash.jpg'); }
.version-3-img { background-image: url('cytonn-photography-n95VMLxqM2I-unsplash.jpg'); }
.version-4-img { background-image: url('cytonn-photography-n95VMLxqM2I-unsplash.jpg'); }
.version-5-img { background-image: url('cytonn-photography-n95VMLxqM2I-unsplash.jpg'); }
@media (max-width: 768px) {
.header {
padding: 3rem 0;
}
.header h1 {
font-size: 2.5rem;
}
.version-card {
margin-bottom: 1.5rem;
}
}
</style>
</head>
<body>
<!-- Header -->
<header class="header">
<div class="container">
<h1>JPM</h1>
<h2>SECURITY & SERVICES</h2>
<p>Selecteer een versie van de website om te bekijken</p>
</div>
</header>
<!-- Version Selection -->
<section class="version-selection">
<div class="container">
<div class="row">
<div class="col-md-6 col-lg-4">
<div class="version-card">
<div class="version-img version-1-img"></div>
<div class="version-content">
<h3>Versie 1</h3>
<p>Een moderne, responsieve website met een clean design en een focus op professionaliteit. Deze versie heeft een full-screen hero sectie en een duidelijke presentatie van diensten.</p>
<p><strong>Kenmerken:</strong> Bootstrap framework, full-screen hero sectie, responsief design</p>
<a href="index6.html" class="btn-view" target="_blank">Bekijk Versie 1</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4">
<div class="version-card">
<div class="version-img version-2-img"></div>
<div class="version-content">
<h3>Versie 2</h3>
<p>Een minimalistische website met zijnavigatie voor een unieke gebruikerservaring. Deze versie legt de nadruk op elegantie en eenvoud met een strakke layout.</p>
<p><strong>Kenmerken:</strong> Zijnavigatie, minimalistische stijl, sectienummering</p>
<a href="index2.html" class="btn-view" target="_blank">Bekijk Versie 2</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4">
<div class="version-card">
<div class="version-img version-3-img"></div>
<div class="version-content">
<h3>Versie 3</h3>
<p>Een full-screen website met parallax effecten voor een moderne en dynamische uitstraling. Deze versie biedt een meeslepende gebruikerservaring met visuele diepte.</p>
<p><strong>Kenmerken:</strong> Parallax effecten, preloader, scroll-animaties</p>
<a href="index3.html" class="btn-view" target="_blank">Bekijk Versie 3</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4">
<div class="version-card">
<div class="version-img version-4-img"></div>
<div class="version-content">
<h3>Versie 4</h3>
<p>Een corporate en professionele website met clean lines en een gestructureerde layout. Deze versie is perfect voor een zakelijke uitstraling met duidelijke informatiehiërarchie.</p>
<p><strong>Kenmerken:</strong> Corporate design, feature boxes, top bar met contactinfo</p>
<a href="index4.html" class="btn-view" target="_blank">Bekijk Versie 4</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-4">
<div class="version-card">
<div class="version-img version-5-img"></div>
<div class="version-content">
<h3>Versie 5</h3>
<p>Een creatieve en moderne website met animaties en visuele elementen. Deze versie biedt een unieke gebruikerservaring met interactieve elementen en een stijlvol design.</p>
<p><strong>Kenmerken:</strong> Animaties, custom cursor, fullscreen menu, AOS effecten</p>
<a href="index5.html" class="btn-view" target="_blank">Bekijk Versie 5</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="footer">
<div class="container">
<p>&copy; 2025 JPM Security & Services. Alle rechten voorbehouden.</p>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>