mirror of
https://github.com/planetrenox/planetrenox.com.git
synced 2026-01-13 16:18:03 +00:00
42 lines
3.3 KiB
HTML
42 lines
3.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>planetrenox</title>
|
|
<style>
|
|
*{margin:0;padding:0;box-sizing:border-box}
|
|
body{background:#0a0e27;color:#00ff41;font-family:'Courier New',monospace;overflow-x:hidden;min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative}
|
|
body::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,255,65,.03) 0px,transparent 1px,transparent 2px,rgba(0,255,65,.03) 3px);pointer-events:none;animation:scan 8s linear infinite}
|
|
@keyframes scan{0%{transform:translateY(0)}100%{transform:translateY(100vh)}}
|
|
.container{max-width:900px;padding:2rem;text-align:center}
|
|
.glitch{font-size:clamp(3rem,8vw,6rem);font-weight:900;letter-spacing:.5rem;margin-bottom:1rem;position:relative;text-transform:uppercase;animation:flicker 3s infinite}
|
|
.glitch::before,.glitch::after{content:'PLANET_RENOX';position:absolute;left:0;width:100%;height:100%}
|
|
.glitch::before{color:#ff00de;animation:glitch1 2.5s infinite;clip-path:polygon(0 0,100% 0,100% 45%,0 45%)}
|
|
.glitch::after{color:#00fff9;animation:glitch2 2s infinite;clip-path:polygon(0 55%,100% 55%,100% 100%,0 100%)}
|
|
@keyframes glitch1{0%,100%{transform:translate(0)}20%{transform:translate(-3px,3px)}40%{transform:translate(-3px,-3px)}60%{transform:translate(3px,3px)}80%{transform:translate(3px,-3px)}}
|
|
@keyframes glitch2{0%,100%{transform:translate(0)}20%{transform:translate(3px,-3px)}40%{transform:translate(3px,3px)}60%{transform:translate(-3px,-3px)}80%{transform:translate(-3px,3px)}}
|
|
@keyframes flicker{0%,100%{opacity:1}93%{opacity:.8}94%{opacity:.2}95%{opacity:1}}
|
|
.tagline{font-size:1.2rem;color:#00ff41;opacity:.7;margin-bottom:3rem;letter-spacing:.3rem;text-transform:uppercase}
|
|
.game-frame{margin:3rem auto;border:2px solid #00ff41;box-shadow:0 0 30px rgba(0,255,65,.3),inset 0 0 30px rgba(0,255,65,.1);background:#0a0e27;padding:1rem;position:relative}
|
|
.game-frame::before{content:'> LOADING_GAME.EXE';position:absolute;top:-1.5rem;left:1rem;background:#0a0e27;padding:0 .5rem;font-size:.8rem;color:#00ff41}
|
|
iframe{display:block;max-width:100%;height:auto}
|
|
.github{display:inline-block;margin-top:3rem;padding:1rem 2rem;background:transparent;border:2px solid #00ff41;color:#00ff41;text-decoration:none;text-transform:uppercase;letter-spacing:.2rem;font-weight:700;position:relative;overflow:hidden;transition:all .3s}
|
|
.github::before{content:'';position:absolute;inset:0;background:#00ff41;transform:translateX(-100%);transition:transform .3s;z-index:-1}
|
|
.github:hover{color:#0a0e27;box-shadow:0 0 30px rgba(0,255,65,.6)}
|
|
.github:hover::before{transform:translateX(0)}
|
|
@media(max-width:700px){.game-frame{padding:.5rem}iframe{width:100%;height:190px}}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<h1 class="glitch">PLANET_RENOX</h1>
|
|
<p class="tagline">// INITIALIZING SYSTEMS</p>
|
|
<div class="game-frame">
|
|
<iframe src="https://store.steampowered.com/widget/1745790/?t=A%20movement%20focused%20endless%20anime%20runner.%20Jump%20till%20you're%20dead.%20It's%20basically%20a%20bhopping%20game.%20Developed%20by%20Planet%20Renox." frameborder="0" width="646" height="190"></iframe>
|
|
</div>
|
|
<a href="https://github.com/planetrenox" class="github" target="_blank">> ACCESS_GITHUB</a>
|
|
</div>
|
|
</body>
|
|
</html>
|