fixed bug, toggle was falling behind featured in mobile

Author: tjards

assets/css/extended/custom.css

@@ -15,6 +15,7 @@
 body:has(#shepherd-bg) .main {
   position: relative;
   overflow: hidden;
+  padding-bottom: 50px; /* extends iframe below featured-section so toggle has clear space */
 }
 
 /* Profile card and featured posts sit above the iframe */

config.yaml

@@ -65,7 +65,7 @@ minify:
 params:
 
   homeInfoParams:
-    Title: P Travis Jardine
+    Title: tangents
     Content: on technology, artificial intelligence, and other things
 
   assets:

static/web_shepherd_local/style.css

@@ -106,8 +106,6 @@ canvas {
   color: var(--color-label-inactive);
   transition: color 0.2s;
   user-select: none;
-  padding: 6px 0;
-  touch-action: manipulation;
 }
 
 .three-way-toggle[data-pos="0"] .three-way-labels span:nth-child(1),

static/web_shepherd_local/ui.js

@@ -79,19 +79,11 @@ function initCursorModeToggle() {
 
   slider.addEventListener('click', (e) => applyToggle(e.target));
 
-  slider.addEventListener('touchstart', (e) => {
-    e.preventDefault(); // block scroll and synthesized mouse events
-  }, { passive: false });
-
   slider.addEventListener('touchend', (e) => {
-    e.preventDefault();
+    e.preventDefault(); // prevent synthesized click + 300ms delay
     const touch = e.changedTouches[0];
-    const rect = slider.getBoundingClientRect();
-    const x = touch.clientX - rect.left;
-    const third = rect.width / 3;
-    const idx = x < third ? 0 : x < third * 2 ? 1 : 2;
-    slider.dataset.pos = String(idx);
-    cursorMode = modes[idx];
+    const el = document.elementFromPoint(touch.clientX, touch.clientY);
+    if (el) applyToggle(el);
   });
 }