static background testing the waters

html/random-tag-of-the-day.tsx

@@ -5,24 +5,27 @@ const Tag = ({ tag }: { tag: string }) => (
     <a href={`https://cohost.org/rc/tagged/${tag}`}>{`#${tag}`}</a>
 );
 
-const tags = `\
+const tags = [
-CSS Crimes
+    "CSS Crimes",
-borgesposting
+    "borgesposting",
-NEISVoid
+    "NEISVoid",
-circling the square
+    "circling the square",
-retrocomputing
+    "retrocomputing",
-cats of cohost
+    "cats of cohost",
-coho film club
+    "coho film club",
-cohost crafts
+    "cohost crafts",
-the cohost plural feed
+    "the cohost plural feed",
-cohost summer mixtape
+    "cohost summer mixtape",
-trans trucks
+    "trans trucks",
-The Cohost Local Feed (Minnesota)
+    "The Cohost Local Feed (Minnesota)",
-cohost draws
+    "cohost draws",
-tv head
+    "tv head",
-make up a mech pilot
+    "make up a mech pilot",
-frasierposting
+    "frasierposting",
-cohost utilities`.split("\n");
+    "cohost utilities",
+    "alt text request",
+    "meepismonday",
+];
 
 // repeating makes it seem more random
 export const PseudoRandom = ({
@@ -53,7 +56,6 @@ export const Choice = ({ children }: { children: ComponentChildren }) => (
     <details
         style={{
             width: "100%",
-            height: "100%",
             display: "flex",
             flex: 1,
             cursor: "pointer",
@@ -68,11 +70,10 @@ export const Choice = ({ children }: { children: ComponentChildren }) => (
             style={{
                 position: "absolute",
                 top: "1.5rem",
-                bottom: 0,
                 left: 0,
                 right: 0,
                 width: "100%",
-                height: "100%",
+                height: "fit-content",
                 display: "flex",
                 alignContent: "center",
                 justifyContent: "center",
@@ -111,6 +112,10 @@ render_and_copy(
                 generator for these (it would be easy to make one for tags, but
                 one for other stuff would require a bit more work)
             </li>
+            <li>
+                this was generated on {new Date().toDateString()} at{" "}
+                {new Date().toTimeString()}
+            </li>
         </ul>
     </Main>
 );

html/static-background.tsx

@@ -0,0 +1,19 @@
+import { Main, render_and_copy } from "./common.tsx";
+// when two grids are misaligned and strange patterns you find, that's-a moire
+// ^ bad remembering of https://xkcd.com/1814/
+// some sort of parallax would be *phenomenal*
+// maybe a multi-part post?
+// ^ horrible for sharing
+// shape moire is a thing
+// moires are too headachey and cws would ruin the attention-grabbing aspect
+// draggable window to reveal stuff?
+// i've been reading a lot of homestuck lately so something related to that would be nice
+
+render_and_copy(
+    <>
+        <Main>
+            <div class="moire"></div>
+        </Main>
+        <div id="fake-main"></div>
+    </>
+);