kstraessler/404-Banner
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fertig

Browse source
This commit is contained in:
Kevin Sträßler 2025-12-14 15:42:16 +01:00
commit 8b35484c34
6 changed files with 159 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
.idea/.gitignore vendored Normal file
View file

@ -0,0 +1,8 @@
# Default ignored files
/shelf/
/workspace.xml
# Editor-based HTTP Client requests
/httpRequests/
# Datasource local storage ignored files
/dataSources/
/dataSources.local.xml

12
.idea/404-Banner.iml Normal file
View file

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
<excludeFolder url="file://$MODULE_DIR$/temp" />
<excludeFolder url="file://$MODULE_DIR$/tmp" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>

8
.idea/modules.xml Normal file
View file

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/404-Banner.iml" filepath="$PROJECT_DIR$/.idea/404-Banner.iml" />
</modules>
</component>
</project>

6
.idea/vcs.xml Normal file
View file

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="" vcs="Git" />
</component>
</project>

8
.idea/workspace.xml Normal file
View file

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="PropertiesComponent">{
&quot;keyToString&quot;: {
&quot;settings.editor.selected.configurable&quot;: &quot;settings.sync&quot;
}
}</component>
</project>

117
index.html Normal file
View file

@ -0,0 +1,117 @@
<!DOCTYPE html>
<html lang="de" class="dark h-full">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>404 - Zugriff verweigert</title>
<meta name="robots" content="noindex, nofollow">
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
darkMode: 'class',
theme: {
extend: {
colors: {
'cyber-blue': '#00f3ff',
'cyber-purple': '#bd00ff',
'dark-bg': '#050a14',
},
animation: {
'blob-spin_slow': 'spin 20s linear infinite',
'blob-spin_reverse': 'spin 25s linear reverse infinite',
'tilt': 'tilt 10s infinite linear',
'scan': 'scan 4s linear infinite',
},
keyframes: {
tilt: {
'0%, 50%, 100%': { transform: 'rotate(0deg)' },
'25%': { transform: 'rotate(1deg)' },
'75%': { transform: 'rotate(-1deg)' },
},
scan: {
'0%': { backgroundPosition: '0 -100vh' },
'100%': { backgroundPosition: '0 100vh' },
}
},
backgroundImage: {
'scan-lines': 'linear-gradient(to bottom, transparent 50%, rgba(0, 243, 255, 0.05) 51%, transparent 51%)',
}
}
}
}
</script>
<style type="text/tailwindcss">
@layer utilities {
.glitch-text {
text-shadow: 0.05em 0 0 rgba(255, 0, 0, 0.75),
-0.025em -0.05em 0 rgba(0, 255, 0, 0.75),
0.025em 0.05em 0 rgba(0, 0, 255, 0.75);
animation: glitch 500ms infinite;
}
@keyframes glitch {
0% { text-shadow: 0.05em 0 0 rgba(255, 0, 0, 0.75), -0.05em -0.025em 0 rgba(0, 255, 0, 0.75), -0.025em 0.05em 0 rgba(0, 0, 255, 0.75); }
14% { text-shadow: 0.05em 0 0 rgba(255, 0, 0, 0.75), -0.05em -0.025em 0 rgba(0, 255, 0, 0.75), -0.025em 0.05em 0 rgba(0, 0, 255, 0.75); }
15% { text-shadow: -0.05em -0.025em 0 rgba(255, 0, 0, 0.75), 0.025em 0.025em 0 rgba(0, 255, 0, 0.75), -0.05em -0.05em 0 rgba(0, 0, 255, 0.75); }
49% { text-shadow: -0.05em -0.025em 0 rgba(255, 0, 0, 0.75), 0.025em 0.025em 0 rgba(0, 255, 0, 0.75), -0.05em -0.05em 0 rgba(0, 0, 255, 0.75); }
50% { text-shadow: 0.025em 0.05em 0 rgba(255, 0, 0, 0.75), 0.05em 0 0 rgba(0, 255, 0, 0.75), 0 -0.05em 0 rgba(0, 0, 255, 0.75); }
99% { text-shadow: 0.025em 0.05em 0 rgba(255, 0, 0, 0.75), 0.05em 0 0 rgba(0, 255, 0, 0.75), 0 -0.05em 0 rgba(0, 0, 255, 0.75); }
100% { text-shadow: -0.025em 0 0 rgba(255, 0, 0, 0.75), -0.025em -0.025em 0 rgba(0, 255, 0, 0.75), -0.025em -0.05em 0 rgba(0, 0, 255, 0.75); }
}
}
</style>
</head>
<body class="bg-dark-bg text-gray-200 h-full overflow-hidden relative flex items-center justify-center font-mono">
<div class="absolute inset-0 pointer-events-none bg-scan-lines bg-[length:100%_4px] animate-scan opacity-20 z-10"></div>
<div class="absolute top-0 left-0 w-full h-full overflow-hidden -z-10">
<div class="absolute top-1/4 left-1/4 w-96 h-96 bg-cyber-purple/30 rounded-full mix-blend-multiply filter blur-3xl opacity-30 animate-blob-spin_slow"></div>
<div class="absolute bottom-1/4 right-1/4 w-96 h-96 bg-cyber-blue/30 rounded-full mix-blend-multiply filter blur-3xl opacity-30 animate-blob-spin_reverse"></div>
</div>
<div class="absolute inset-0 bg-[linear-gradient(rgba(18,24,38,0.8)_2px,transparent_2px),linear-gradient(90deg,rgba(18,24,38,0.8)_2px,transparent_2px)] bg-[size:30px_30px] [mask-image:radial-gradient(ellipse_80%_80%_at_50%_50%,#000_30%,transparent_100%)] -z-5"></div>
<div class="relative z-20 text-center px-6 max-w-2xl mx-auto">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[300px] h-[300px] md:w-[500px] md:h-[500px] border border-cyber-blue/20 rounded-full animate-pulse">
<div class="w-full h-full rounded-full border border-t-cyber-blue/80 border-r-transparent border-b-transparent border-l-transparent animate-spin"></div>
</div>
<h1 class="text-[10rem] md:text-[14rem] font-black leading-none select-none relative">
<span class="absolute inset-0 glitch-text opacity-50" aria-hidden="true">404</span>
<span class="relative text-transparent bg-clip-text bg-gradient-to-br from-cyber-blue via-white to-cyber-purple animate-tilt inline-block">
404
</span>
</h1>
<h2 class="text-2xl md:text-4xl font-bold mt-4 mb-4 tracking-wider uppercase text-red-500 drop-shadow-[0_0_10px_rgba(239,68,68,0.5)]">
Zugriff Verweigert
</h2>
<p class="text-gray-400 text-lg mb-10 md:px-12 leading-relaxed">
Endstation. Du hast das Ende meines Netzwerks erreicht.
Hier gibt es keine offenen Ports und nichts zu sehen.
<span class="block mt-2 text-cyber-blue/80 text-sm">>_ Verbindung wird getrennt...</span>
</p>
<div class="relative group inline-block">
<div class="absolute -inset-0.5 bg-gradient-to-r from-cyber-blue to-cyber-purple rounded-full blur opacity-30 group-hover:opacity-100 transition duration-500 group-hover:duration-200 animate-tilt"></div>
<a href="https://linktr.ee/RentnerKev" class="relative px-8 py-3 bg-dark-bg rounded-full leading-none flex items-center divide-x divide-gray-600 border border-gray-700 hover:border-gray-500 transition-colors duration-200">
<span class="flex items-center space-x-2">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-cyber-blue -ml-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" />
</svg>
<span class="text-gray-100 pr-4">RentnerKev</span>
</span>
<span class="pl-4 text-cyber-purple transition duration-200 group-hover:text-gray-100">
LINKTREE
</span>
</a>
</div>
</div>
<div class="absolute bottom-4 text-gray-600 text-xs uppercase tracking-widest">
Security Protocol // Level 404 // Active
</div>
</body>
</html>