static background not liking the hemo

html/static-background.tsx

@@ -8,12 +8,50 @@ import { Main, render_and_copy } from "./common.tsx";
 // 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
+// background-clip: text?
+// ^ doesn't seem to really work :(
+// vh units will work really well
+// scrolling through my drafts is very headache lol
+
+function vh_stripes(
+    percent_of_view_height: number,
+    ...colors: string[]
+): string {
+    const out = [];
+    const stripe_height = (percent_of_view_height * 100) / colors.length;
+    let start = 0;
+
+    for (const color of colors) {
+        const end = start + stripe_height;
+        out.push(`${color} ${start}vh ${end}vh`);
+        start = end;
+    }
+
+    return out.join(", ");
+}
 
 render_and_copy(
     <>
-        <Main>
-            <div class="moire"></div>
-        </Main>
+        <div
+            id="main"
+            style={{
+                background: `linear-gradient(${vh_stripes(
+                    0.9,
+                    "#a10000",
+                    "#a15000",
+                    "#a1a100",
+                    "#626262",
+                    "#416600",
+                    "#008141",
+                    "#008282",
+                    "#005682",
+                    "#000056",
+                    "#2b0057",
+                    "#6a006a",
+                    "#77003c"
+                )}) fixed`,
+            }}
+        ></div>
         <div id="fake-main"></div>
     </>
 );