mirror of
https://github.com/Dvorinka/sportcreative.git
synced 2026-06-03 19:32:56 +00:00
Tomas Dvorak
174 lines
7.8 KiB
HTML
174 lines
7.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="cs">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Stránka nenalezena | 404 | SportCreative</title>
|
|
<meta name="robots" content="noindex, follow">
|
|
<link rel="canonical" href="https://sportcreative.cz/404.html" />
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<script src="script.js" defer></script>
|
|
<link rel="preconnect" href="https://cdnjs.cloudflare.com">
|
|
<link rel="icon" type="image/png" href="assets/images/favicon.ico">
|
|
<script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script>
|
|
<script nomodule src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.js"></script>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
|
|
|
|
body {
|
|
font-family: 'Poppins', sans-serif;
|
|
background-color: #f9fafb;
|
|
color: #1f2937;
|
|
}
|
|
|
|
.error-container {
|
|
min-height: 80vh;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 2rem;
|
|
}
|
|
|
|
.error-content {
|
|
text-align: center;
|
|
max-width: 600px;
|
|
padding: 3rem;
|
|
background: white;
|
|
border-radius: 1rem;
|
|
box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
|
|
}
|
|
|
|
.error-code {
|
|
font-size: 8rem;
|
|
font-weight: 800;
|
|
background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
margin-bottom: 1rem;
|
|
line-height: 1;
|
|
}
|
|
|
|
.error-title {
|
|
font-size: 2rem;
|
|
font-weight: 700;
|
|
margin-bottom: 1rem;
|
|
color: #111827;
|
|
}
|
|
|
|
.error-message {
|
|
color: #6b7280;
|
|
margin-bottom: 2rem;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
.btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 0.75rem 1.5rem;
|
|
border-radius: 9999px;
|
|
font-weight: 500;
|
|
transition: all 0.3s ease;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.btn-primary {
|
|
background-color: #8b5cf6;
|
|
color: white;
|
|
border: 2px solid #8b5cf6;
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
background-color: #7c3aed;
|
|
border-color: #7c3aed;
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.btn-outline {
|
|
background-color: transparent;
|
|
color: #8b5cf6;
|
|
border: 2px solid #8b5cf6;
|
|
margin-left: 1rem;
|
|
}
|
|
|
|
.btn-outline:hover {
|
|
background-color: #f5f3ff;
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
|
|
}
|
|
|
|
.error-illustration {
|
|
max-width: 300px;
|
|
margin: 0 auto 2rem;
|
|
}
|
|
|
|
@media (max-width: 640px) {
|
|
.error-content {
|
|
padding: 2rem 1.5rem;
|
|
}
|
|
|
|
.error-code {
|
|
font-size: 6rem;
|
|
}
|
|
|
|
.error-title {
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
.btn {
|
|
width: 100%;
|
|
margin-bottom: 1rem;
|
|
margin-left: 0;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- 404 Content -->
|
|
<div class="error-container">
|
|
<div class="error-content">
|
|
<div class="error-illustration">
|
|
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
|
<path fill="#F3F4F6" d="M45.7,-45.7C59.9,-33.2,72.9,-19.6,76.9,-2.8C80.9,14,75.9,34,61.8,46.3C47.7,58.5,24.5,63.1,6.5,56.5C-11.4,50,-22.8,32.4,-34.2,18.3C-45.6,4.2,-57.1,-6.3,-60.8,-20.6C-64.5,-34.9,-60.5,-52.9,-47.1,-64.8C-33.7,-76.7,-10.9,-82.4,4.9,-88.4C20.7,-94.4,41.4,-100.7,56.2,-91.1C71.1,-81.5,80.1,-56.1,87.2,-31.1C94.4,-6.1,99.7,18.5,92.8,37.1C85.9,55.7,66.9,68.4,48.3,75.1C29.7,81.8,11.6,82.6,-3.3,87.6C-18.2,92.6,-36.4,101.8,-50.4,95.1C-64.5,88.4,-74.4,65.8,-79.3,44.5C-84.1,23.1,-84,3,-80.2,-17.1C-76.4,-37.2,-68.9,-57.3,-53.6,-69.6C-38.2,-81.8,-15.1,-86.2,1.5,-88.4C18.1,-90.6,36.2,-90.5,50.2,-80.9C64.2,-71.3,74,-52.2,76.4,-33.6C78.8,-15,73.8,3.1,69.2,20.3C64.6,37.5,60.4,53.8,48.8,61.7C37.3,69.6,18.6,69.1,1.9,65.8C-14.8,62.5,-29.6,56.4,-39.3,45.9C-49,35.3,-53.6,20.3,-56.8,4.2C-60,-11.9,-61.9,-29.1,-54.9,-42.1C-47.8,-55.1,-31.8,-63.9,-15.5,-64.2C0.8,-64.5,1.6,-56.4,15.3,-47.9C29,-39.4,55.5,-30.5,62.9,-16.6C70.2,-2.7,58.4,16.2,45.9,30.4C33.4,44.5,20.2,53.9,5.1,56.9C-10,60,-25.9,56.7,-33.9,45.7C-41.9,34.7,-41.9,16,-45.3,-4.2C-48.7,-24.4,-55.4,-50.8,-47.4,-65.3C-39.5,-79.8,-16.9,-82.5,1.4,-84.8C19.7,-87.1,39.4,-89.1,53.7,-79.3C68,-69.6,77,-48.2,81.7,-27.7C86.4,-7.1,86.8,12.7,80.8,28.3C74.8,43.9,62.4,55.3,48.3,65.3C34.2,75.3,18.5,83.9,2.7,79.2C-13.2,74.5,-26.5,56.5,-39.4,40.5C-52.3,24.5,-64.9,10.5,-67.7,-5.6C-70.5,-21.7,-63.5,-43.4,-49.2,-55.9C-34.9,-68.5,-13.2,-71.9,3.8,-78.2C20.8,-84.6,41.5,-93.8,54.1,-85.5C66.7,-77.1,71.1,-51.1,75.1,-28.5C79.1,-5.9,82.7,13.3,77.7,29.2C72.7,45.1,59.1,57.6,44.7,67.3C30.3,77,15.2,83.9,-1.2,86.1C-17.7,88.3,-35.5,85.8,-48.1,75.4C-60.7,65,-68.1,46.7,-73.9,28.1C-79.7,9.5,-83.8,-9.4,-79.3,-25.3C-74.8,-41.2,-61.6,-54.1,-47.2,-65.3C-32.9,-76.5,-17.4,-86,0.3,-86.4C18,-86.8,36,-78,45.7,-66.9C55.4,-55.8,56.8,-42.4,62.9,-29.8C69,-17.3,79.8,-5.6,84.3,8.7C88.9,23,87.2,40.9,76.8,52.3C66.5,63.7,47.5,68.6,32.3,71.3C17.1,74,5.7,74.5,-7.1,68.9C-19.9,63.3,-33.3,51.6,-45.9,38.9C-58.5,26.2,-70.2,12.5,-72.5,-3.2C-74.8,-18.9,-67.7,-37.8,-54.5,-49.4C-41.3,-61.1,-21.8,-65.6,-1.8,-63.1C18.1,-60.6,36.2,-51.1,45.7,-45.7Z" transform="translate(100 100)" />
|
|
<circle cx="70" cy="50" r="10" fill="#EC4899" />
|
|
<circle cx="130" cy="50" r="10" fill="#8B5CF6" />
|
|
<path d="M60 120 Q100 140 140 120" stroke="#1F2937" stroke-width="4" fill="none" />
|
|
</svg>
|
|
</div>
|
|
<div class="error-code">404</div>
|
|
<h1 class="error-title">Stránka nenalezena</h1>
|
|
<p class="error-message">Omlouváme se, ale stránka, kterou hledáte, neexistuje nebo byla přesunuta. Zkontrolujte prosím adresu URL nebo se vraťte na hlavní stránku.</p>
|
|
<div class="flex flex-col sm:flex-row justify-center">
|
|
<a href="/" class="btn btn-primary">
|
|
<ion-icon name="home-outline" class="mr-2"></ion-icon>
|
|
Domovská stránka
|
|
</a>
|
|
<a href="kontakt.html" class="btn btn-outline">
|
|
<ion-icon name="mail-outline" class="mr-2"></ion-icon>
|
|
Napište nám
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// Mobile menu toggle
|
|
const mobileMenuButton = document.getElementById('mobile-menu-button');
|
|
const mobileMenu = document.getElementById('mobile-menu');
|
|
|
|
if (mobileMenuButton && mobileMenu) {
|
|
mobileMenuButton.addEventListener('click', () => {
|
|
const isExpanded = mobileMenuButton.getAttribute('aria-expanded') === 'true';
|
|
mobileMenuButton.setAttribute('aria-expanded', !isExpanded);
|
|
mobileMenuButton.innerHTML = isExpanded ?
|
|
'<ion-icon name="menu-outline" class="text-2xl"></ion-icon>' :
|
|
'<ion-icon name="close-outline" class="text-2xl"></ion-icon>';
|
|
mobileMenu.classList.toggle('hidden');
|
|
});
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|