From a5099f088bc223ad459ee65a4f705e9ab4eccc35 Mon Sep 17 00:00:00 2001
From: Orion Reed <orionreedt@gmail.com>
Date: Wed, 27 Mar 2024 04:08:02 -0700
Subject: [PATCH] Added "things I made recently" section

---
 src/components/Default.tsx | 23 +++++++++++++++++++----
 src/css/style.css          |  9 +++++----
 src/hooks/useCanvas.ts     |  2 +-
 3 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/src/components/Default.tsx b/src/components/Default.tsx
index ac6d4d2..c2686cd 100644
--- a/src/components/Default.tsx
+++ b/src/components/Default.tsx
@@ -37,20 +37,35 @@ export function Default() {
       <span className="dinkus">***</span>
 
       <h1>Talks</h1>
-      <ul>
+      <ol reversed>
         <li><a
           href="artifact/causal-islands-integration-domain.pdf">Spatial
           Canvases: Towards an Integration Domain for HCI @ Causal Islands LA</a></li>
         <li><a
           href="https://www.youtube.com/watch?v=-q-kk-NMFbA">Knowledge Organisation Infrastructure Demo @ NPC
           Denver</a></li>
-      </ul>
+      </ol>
       <h1>Writing</h1>
-      <ul>
+      <ol reversed>
         <li><a
           href="https://blog.block.science/objects-as-reference-toward-robust-first-principles-of-digital-organization/">Objects
           as Reference: Toward Robust First Principles of Digital Organization</a></li>
-      </ul>
+      </ol>
+      <h1>Things I made recently</h1>
+      <ol reversed>
+        <li><a
+          href="https://twitter.com/OrionReedOne/status/1772934478421188620">Tiny 3D HTML/DOM viewer (you can paste it into your console)</a>
+        </li>
+        <li><a
+          href="https://twitter.com/OrionReedOne/status/1772271156373905465">DOM to canvas translation (it's that button in the top right of this page)</a>
+        </li>
+        <li><a
+          href="https://github.com/OrionReed/tldraw-graph-layout">Constraint-based graph layout in tldraw</a>
+        </li>
+        <li><a
+          href="https://github.com/OrionReed/tldraw-physics">Physics in tldraw</a>
+        </li>
+      </ol>
     </main>
   );
 }
diff --git a/src/css/style.css b/src/css/style.css
index 0be517b..e2ef291 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -84,10 +84,9 @@ p a {
   margin-bottom: 0em;
 }
 
-ul {
+ol {
   padding-left: 0;
   font-size: 1rem;
-  list-style: decimal-leading-zero;
   & li::marker {
     color: rgba(0, 0, 0, 0.322);
   }
@@ -134,7 +133,7 @@ ul {
   header {
     margin-bottom: 1em;
   }
-  ul {
+  ol {
     list-style-position: inside;
   }
 }
@@ -147,9 +146,11 @@ ul {
   p,
   span,
   header,
-  ul {
+  ul,
+  ol {
     margin: 0;
   }
+
   & header {
     font-size: 1.5rem;
   }
diff --git a/src/hooks/useCanvas.ts b/src/hooks/useCanvas.ts
index 6d01834..f68b1ec 100644
--- a/src/hooks/useCanvas.ts
+++ b/src/hooks/useCanvas.ts
@@ -52,7 +52,7 @@ async function gatherElementsInfo() {
       if (['BUTTON'].includes(child.tagName)) continue;
       const rect = child.getBoundingClientRect();
       let w = rect.width;
-      if (!['P', 'UL'].includes(child.tagName)) {
+      if (!['P', 'UL', 'OL'].includes(child.tagName)) {
         w = measureElementTextWidth(child as HTMLElement);
       }
       // Check if the element is centered