From 283dee01bef9c7effe7539d2eb83be2ac83c56bd Mon Sep 17 00:00:00 2001
From: mehbark <terezi@pyrope.net>
Date: Mon, 4 Sep 2023 23:22:46 -0400
Subject: [PATCH] schotter went smoothly

---
 html/common.tsx   |  2 ++
 html/schotter.tsx | 51 +++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 53 insertions(+)
 create mode 100644 html/schotter.tsx

diff --git a/html/common.tsx b/html/common.tsx
index 14f2a30..e43d7c3 100644
--- a/html/common.tsx
+++ b/html/common.tsx
@@ -192,3 +192,5 @@ export const randirect = (...urls: string[]) =>
 // kinda bad name
 export const pick_random = <T,>(xs: T[]): T =>
     xs[Math.floor(Math.random() * xs.length)];
+
+export const jitter = (n: number) => n * (Math.random() - 0.5);
diff --git a/html/schotter.tsx b/html/schotter.tsx
new file mode 100644
index 0000000..be88362
--- /dev/null
+++ b/html/schotter.tsx
@@ -0,0 +1,51 @@
+import { Main, jitter, n_of, render_and_copy } from "./common.tsx";
+
+const Square = ({ row }: { row: number }) => (
+    <div
+        style={{
+            outline: "0.05rem solid black",
+            borderRadius: "0.05rem",
+            transform: `translateX(${jitter(row * 2)}px) translateY(${jitter(
+                row * 2
+            )}px) rotate(${jitter(row * 0.05)}rad)`,
+        }}
+    ></div>
+);
+
+render_and_copy(
+    <div
+        style={{
+            backgroundColor: "#E1DED9",
+            padding: "18%",
+            border: "1.5rem solid #0C0C0C",
+        }}
+    >
+        <Main
+            style={{
+                display: "grid",
+                gridTemplateColumns: "repeat(12, 1fr)",
+                width: "100%",
+                aspectRatio: "12 / 22",
+                gap: "-1px",
+            }}
+        >
+            {n_of(22, undefined).map((_, row) =>
+                n_of(12, <Square row={row} />)
+            )}
+        </Main>
+        <div
+            style={{
+                textAlign: "right",
+                marginTop: "1.5rem",
+                fontSize: "0.5rem",
+            }}
+        >
+            <a
+                href="https://collections.vam.ac.uk/item/O221321/schotter-print-nees-georg/"
+                style={{ textDecoration: "none" }}
+            >
+                COMPUTERGRAFIK MIT SIEMENS-SYSTEM 4004
+            </a>
+        </div>
+    </div>
+);