Something went wrong. Try again.
Starship Simulator Controls thoriumsim.com
Something went wrong. Try again.
2.8 kB · 40 lines
TSX
at develop
1234567891011121314151617181920212223242526272829303132333435363738394041export default function () { return ( <> <div className="relative flex h-8 w-full items-center justify-center gap-4 overflow-hidden text-red-500"> <div className="animate-pong aspect-[1/2] h-full skew-x-[76deg] bg-current [animation-delay:375ms]" /> <div className="animate-pong aspect-[1/2] h-full skew-x-[72deg] bg-current [animation-delay:300ms]" /> <div className="animate-pong aspect-[1/2] h-full skew-x-[64deg] bg-current [animation-delay:225ms]" /> <div className="animate-pong aspect-[1/2] h-full skew-x-[48deg] bg-current [animation-delay:150ms]" /> <div className="animate-pong aspect-[1/2] h-full skew-x-[32deg] bg-current [animation-delay:75ms]" /> <div className="animate-pong aspect-[1/2] h-full skew-x-[24deg] bg-current" /> <p className="animate-pulse text-4xl font-bold" style={{ fontFamily: "Dungeon" }}> RED ALERT </p> <div className="animate-pong aspect-[1/2] h-full -skew-x-[24deg] bg-current" /> <div className="animate-pong aspect-[1/2] h-full -skew-x-[32deg] bg-current [animation-delay:75ms]" /> <div className="animate-pong aspect-[1/2] h-full -skew-x-[48deg] bg-current [animation-delay:150ms]" /> <div className="animate-pong aspect-[1/2] h-full -skew-x-[64deg] bg-current [animation-delay:225ms]" /> <div className="animate-pong aspect-[1/2] h-full -skew-x-[72deg] bg-current [animation-delay:300ms]" /> <div className="animate-pong aspect-[1/2] h-full -skew-x-[76deg] bg-current [animation-delay:375ms]" /> </div> <div className="relative flex h-8 w-full items-center justify-center gap-2 overflow-hidden text-purple-500"> <div className="animate-pong aspect-[1/3] h-full bg-current" /> <div className="animate-pong aspect-[1/3] h-full bg-current [animation-delay:75ms]" /> <div className="animate-pong aspect-[1/3] h-full bg-current [animation-delay:150ms]" /> <div className="animate-pong aspect-[1/3] h-full bg-current [animation-delay:225ms]" /> <div className="animate-pong aspect-[1/3] h-full bg-current [animation-delay:300ms]" /> <div className="animate-pong aspect-[1/3] h-full bg-current [animation-delay:375ms]" /> <p className="animate-pulse text-4xl font-bold" style={{ fontFamily: "Dungeon" }}> DANGER NOODLE </p> <div className="animate-pong aspect-[1/3] h-full bg-current [animation-delay:375ms]" /> <div className="animate-pong aspect-[1/3] h-full bg-current [animation-delay:300ms]" /> <div className="animate-pong aspect-[1/3] h-full bg-current [animation-delay:225ms]" /> <div className="animate-pong aspect-[1/3] h-full bg-current [animation-delay:150ms]" /> <div className="animate-pong aspect-[1/3] h-full bg-current [animation-delay:75ms]" /> <div className="animate-pong aspect-[1/3] h-full bg-current" /> </div> </> );}