Back

Version 6

8/26/2024
/**
* This script creates a minimalist homepage for redfloatplane.lol.
* It features a central heading with Carl Lange's name, an animated subheading,
* and a small area for additional links. The design is sleek, modern, and minimal.
*/

/** @jsxImportSource https://esm.sh/react */
import React, { useEffect, useState } from "https://esm.sh/react";
import { createRoot } from "https://esm.sh/react-dom/client";

function App() {
const subheadings = [
"doing this for fun",
"Donald Duck is my spirit animal",
"🤙🤙🤙🤙🤙🤙🤙🤙",
"talks a good game",
"rather be playing tennis",
"hey, this isn't a bouldering gym!",
"should be outside",
"an AI wrote these",
];

const [currentSubheading, setCurrentSubheading] = useState(0);

useEffect(() => {
// Shuffle the subheadings array
for (let i = subheadings.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[subheadings[i], subheadings[j]] = [subheadings[j], subheadings[i]];
}

const interval = setInterval(() => {
setCurrentSubheading((prev) => (prev + 1) % subheadings.length);
}, 3000);
return () => clearInterval(interval);
}, []);
csl_-homepage.web.val.run
Updated: August 26, 2024