mirror of
https://github.com/Shineii86/AniKotoAPI.git
synced 2026-10-22 10:55:10 +00:00
- New index.html: dark theme, ambient orbs, glassmorphism, sticky header - Hero section with terminal preview, animated gradient text - Stats ribbon, features grid, expandable endpoint docs - Interactive playground with 4 demos (search, stream, random, schedule) - New 404.html with animated 404 code and action buttons - Responsive mobile design
82 lines
3.7 KiB
HTML
82 lines
3.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>404 - AniKatoAPI</title>
|
|
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>⛩</text></svg>" />
|
|
<style>
|
|
:root {
|
|
--bg-primary: #0a0a12;
|
|
--text-primary: #eee;
|
|
--text-secondary: #9a9ab0;
|
|
--accent-pink: #f43f8e;
|
|
--accent-purple: #a855f7;
|
|
--accent-indigo: #6366f1;
|
|
--border: rgba(255,255,255,0.08);
|
|
--glass: rgba(255,255,255,0.03);
|
|
}
|
|
* { margin:0; padding:0; box-sizing:border-box; }
|
|
body {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
|
background: var(--bg-primary); color: var(--text-primary);
|
|
min-height: 100vh; display: flex; align-items: center; justify-content: center;
|
|
overflow: hidden; position: relative;
|
|
}
|
|
.ambient { position: fixed; inset: 0; pointer-events: none; }
|
|
.orb { position: absolute; border-radius: 50%; filter: blur(100px); opacity: .12; }
|
|
.orb-1 { width: 500px; height: 500px; background: var(--accent-pink); top: -150px; left: -100px; animation: drift 20s ease-in-out infinite; }
|
|
.orb-2 { width: 400px; height: 400px; background: var(--accent-purple); bottom: -100px; right: -80px; animation: drift 16s ease-in-out infinite reverse; }
|
|
@keyframes drift {
|
|
0%,100% { transform: translate(0,0) scale(1); }
|
|
50% { transform: translate(30px,-20px) scale(1.06); }
|
|
}
|
|
.container {
|
|
position: relative; z-index: 1; text-align: center; padding: 40px;
|
|
}
|
|
.code {
|
|
font-size: clamp(6rem, 15vw, 12rem); font-weight: 900; line-height: 1;
|
|
background: linear-gradient(135deg, var(--accent-pink), var(--accent-purple), var(--accent-indigo));
|
|
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
|
|
animation: float 3s ease-in-out infinite;
|
|
}
|
|
@keyframes float {
|
|
0%,100% { transform: translateY(0); }
|
|
50% { transform: translateY(-8px); }
|
|
}
|
|
.title { font-size: 1.4rem; font-weight: 600; margin: 16px 0 8px; }
|
|
.desc { color: var(--text-secondary); font-size: .95rem; margin-bottom: 28px; line-height: 1.6; }
|
|
.actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
|
|
.btn {
|
|
padding: 11px 24px; border-radius: 10px; font-size: .88rem; font-weight: 600;
|
|
text-decoration: none; transition: all .2s; display: inline-flex; align-items: center; gap: 8px;
|
|
}
|
|
.btn-primary {
|
|
background: linear-gradient(135deg, var(--accent-pink), var(--accent-purple));
|
|
color: #fff; border: none;
|
|
}
|
|
.btn-primary:hover { opacity: .9; transform: translateY(-1px); }
|
|
.btn-ghost {
|
|
background: var(--glass); border: 1px solid var(--border); color: var(--text-secondary);
|
|
}
|
|
.btn-ghost:hover { background: rgba(255,255,255,.06); color: var(--text-primary); }
|
|
.footer-note {
|
|
margin-top: 40px; color: #444; font-size: .72rem;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="ambient"><div class="orb orb-1"></div><div class="orb orb-2"></div></div>
|
|
<div class="container">
|
|
<div class="code">404</div>
|
|
<div class="title">This endpoint doesn't exist</div>
|
|
<div class="desc">The path you're looking for isn't part of the AniKatoAPI.<br/>Check the docs or try a valid endpoint.</div>
|
|
<div class="actions">
|
|
<a href="/" class="btn btn-primary">Home</a>
|
|
<a href="/api" class="btn btn-ghost">API Status</a>
|
|
<a href="https://github.com/Shineii86/AniKatoAPI#readme" class="btn btn-ghost" target="_blank">Docs</a>
|
|
</div>
|
|
<div class="footer-note">AniKatoAPI · Made by Sʜɪɴᴇɪ Nᴏᴜᴢᴇɴ</div>
|
|
</div>
|
|
</body>
|
|
</html> |