ok is true

/** @jsxImportSource https://esm.sh/react */ import React from "https://esm.sh/react"; import { createRoot } from "https://esm.sh/react-dom/client"; function App() { return (

{[...Array(50)].map((_, i) => (

))}

{'ok is true'.split('').map((char, i) => ( {char === ' ' ? '\u00A0' : char} ))}

); } function client() { createRoot(document.getElementById("root")).render(); } if (typeof document !== "undefined") { client(); } export default async function server(request: Request): Promise { return new Response(` ok is true

`, { headers: { "content-type": "text/html", }, }); } const css = ` body { margin: 0; background: #000; height: 100vh; overflow: hidden; } .container { height: 100vh; display: flex; justify-content: center; align-items: center; background: radial-gradient(circle at center, #1a1a1a 0%, #000 100%); animation: backgroundPulse 20s ease-in-out infinite; } .text-wrapper { display: flex; font-family: "Helvetica Neue", sans-serif; font-size: 8vw; font-weight: 300; } .char { opacity: 0; display: inline-block; color: #fff; animation: charFadeIn 1s ease-out forwards, charFloat 4s ease-in-out infinite, charGlow 20s ease-in-out infinite, charColorShift 20s ease-in-out infinite; animation-delay: calc(var(--index) * 0.2s); transform-origin: center; } .particles { position: absolute; width: 100%; height: 100%; } .particle { position: absolute; width: 3px; height: 3px; background: rgba(255, 255, 255, 0.5); border-radius: 50%; left: var(--position); top: -10px; animation: particleFall 20s linear infinite, particleFade 20s ease-in-out infinite; animation-delay: var(--delay); } @keyframes backgroundPulse { 0%, 100% { background: radial-gradient(circle at center, #1a1a1a 0%, #000 100%); } 50% { background: radial-gradient(circle at center, #2a2a2a 0%, #000 100%); } } @keyframes charFadeIn { 0% { opacity: 0; transform: scale(0) rotate(-180deg); } 100% { opacity: 1; transform: scale(1) rotate(0deg); } } @keyframes charFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-20px); } } @keyframes charGlow { 0%, 100% { text-shadow: 0 0 30px rgba(255,255,255,0.3), 0 0 60px rgba(255,255,255,0.2), 0 0 90px rgba(255,255,255,0.1); } 50% { text-shadow: 0 0 60px rgba(255,255,255,0.6), 0 0 120px rgba(255,255,255,0.4), 0 0 180px rgba(255,255,255,0.2); } } @keyframes charColorShift { 0%, 100% { color: #fff; } 25% { color: #64ffda; } 50% { color: #7f7fd5; } 75% { color: #86a8e7; } } @keyframes particleFall { 0% { transform: translateY(-10px); } 100% { transform: translateY(100vh); } } @keyframes particleFade { 0%, 100% { opacity: 0; } 50% { opacity: 1; } } `;

oktrue

Version 0