diff --git a/html/common.tsx b/html/common.tsx
index b761995..34e4501 100644
--- a/html/common.tsx
+++ b/html/common.tsx
@@ -148,6 +148,20 @@ export const DisappearOnClick = ({
     </details>
 );
 
+/// make sure the margins are all legit
+export const ToggleOnClick = ({
+    children: [a, b],
+}: {
+    children: [ComponentChild, ComponentChild];
+}) => (
+    <details style="position: relative; margin: 0 auto; cursor: pointer;">
+        <summary style="list-style: none;">{a}</summary>
+        <div style="display: block; position: absolute; top: 0; pointer-events: none;">
+            {b}
+        </div>
+    </details>
+);
+
 export function shuffle<T>(array: T[]): T[] {
     let currentIndex = array.length,
         randomIndex;
diff --git a/html/diyavepeta.tsx b/html/diyavepeta.tsx
new file mode 100644
index 0000000..64265e1
--- /dev/null
+++ b/html/diyavepeta.tsx
@@ -0,0 +1,8 @@
+import { ToggleOnClick, render_and_copy, static_url } from "./common.tsx";
+
+render_and_copy(
+    <ToggleOnClick>
+        <img src={static_url("davepeta-0.png")} style="margin: 0" />
+        <img src={static_url("davepeta-1.png")} style="margin: 0" />
+    </ToggleOnClick>
+);
diff --git a/static/davepeta-0.png b/static/davepeta-0.png
new file mode 100644
index 0000000..787de33
Binary files /dev/null and b/static/davepeta-0.png differ
diff --git a/static/davepeta-1.png b/static/davepeta-1.png
new file mode 100644
index 0000000..2397286
Binary files /dev/null and b/static/davepeta-1.png differ
diff --git a/static/davepeta.gif b/static/davepeta.gif
new file mode 100644
index 0000000..8944eac
Binary files /dev/null and b/static/davepeta.gif differ