From 46e224eb423ffa8021941ce9c83727c1466fc096 Mon Sep 17 00:00:00 2001
From: "prompt.ac/@jeffrey" <mail@aesthetic.computer>
Date: Tue, 16 Jun 2026 19:44:44 -0700
Subject: [PATCH] keeps: gold Keep tab + expand embedded keep flow to full
 kidlisp window

- Style the new top-level Keep tab with an amber/gold (Tezos) tint + hover, light
  and dark, matching the color-coded tab pattern.
- The embedded keep flow now asks the parent editor to expand the keeps iframe
  to cover the full kidlisp window (position:fixed, full viewport) while the keep
  modal is open, then restores on close. Beacon/Taquito wallet modals render into
  the iframe's own viewport, so full-window = a proper desktop connect/sign modal
  instead of the cramped mobile-forced one locked to the tiny tab panel.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 system/public/kidlisp.com/index.html | 41 +++++++++++++++++++++++++++-
 system/public/kidlisp.com/keeps.html | 11 ++++++++
 2 files changed, 51 insertions(+), 1 deletion(-)

diff --git a/system/public/kidlisp.com/index.html b/system/public/kidlisp.com/index.html
index 10261efcb4..e0bf7ad8cf 100644
--- a/system/public/kidlisp.com/index.html
+++ b/system/public/kidlisp.com/index.html
@@ -3887,6 +3887,9 @@
       #jukebox-tab:hover {
         background: rgba(59, 130, 246, 0.35);
       }
+      #keep-tab:hover {
+        background: rgba(245, 158, 11, 0.4);
+      }
       #reference-tab:hover {
         background: rgba(34, 197, 94, 0.35);
       }
@@ -3971,6 +3974,35 @@
       color: #14532d;
     }
 
+    /* Keep - Amber/Gold (Tezos) */
+    #keep-tab {
+      background: rgba(245, 158, 11, 0.22);
+      color: #b45309;
+    }
+    #keep-tab.active {
+      background: rgba(245, 158, 11, 0.55);
+      color: #7c2d12;
+    }
+    :root.dark #keep-tab {
+      background: rgba(245, 158, 11, 0.3);
+      color: #fde68a;
+    }
+    :root.dark #keep-tab.active {
+      background: rgba(245, 158, 11, 0.55);
+      color: #fffbeb;
+    }
+
+    /* While the embedded keep flow is open, the keeps iframe takes over the full
+       kidlisp window so the Beacon/Taquito wallet modal renders desktop-size. */
+    #keeps-iframe.keeps-iframe-fullscreen {
+      position: fixed;
+      inset: 0;
+      width: 100vw;
+      height: 100vh;
+      z-index: 100000;
+      background: var(--bg-primary);
+    }
+
     /* Dark mode adjustments for tab colors - brighter text for contrast */
     :root.dark #guide-tab {
       background: rgba(34, 197, 94, 0.4);
@@ -15555,9 +15587,16 @@ s("ape_breaks_3").loopAt(2)</textarea>
     }
 
     // The embedded keeps page announces readiness; (re)send the current piece.
+    // It also asks to expand to the full window during the keep flow so the
+    // Beacon/Taquito wallet modal renders full-size (not the cramped mobile one).
     window.addEventListener('message', (e) => {
       if (e.origin !== window.location.origin) return;
-      if (e.data?.type === 'keeps:ready') postCurrentPieceToKeeps();
+      if (e.data?.type === 'keeps:ready') {
+        postCurrentPieceToKeeps();
+      } else if (e.data?.type === 'keeps:expand') {
+        const kf = document.getElementById('keeps-iframe');
+        if (kf) kf.classList.toggle('keeps-iframe-fullscreen', !!e.data.on);
+      }
     });
 
     // Configure Monaco with jsDelivr CDN (modern, well-supported)
diff --git a/system/public/kidlisp.com/keeps.html b/system/public/kidlisp.com/keeps.html
index adbcd6dd09..0d4220ad2a 100644
--- a/system/public/kidlisp.com/keeps.html
+++ b/system/public/kidlisp.com/keeps.html
@@ -6059,6 +6059,7 @@
       clearTrackLog();
       document.getElementById('mint-overlay').classList.add('open');
       document.body.style.overflow = 'hidden';
+      requestEmbedExpand(true);
 
       // Permalink: reflect the open mint modal in the URL so sharing /kept/$code
       // or /unkept/$code reopens this exact view. Only push when the URL isn't
@@ -6086,6 +6087,7 @@
       mintAutoSyncAfterRebake = false;
       document.getElementById('mint-overlay').classList.remove('open');
       document.body.style.overflow = '';
+      requestEmbedExpand(false);
 
       // Permalink: restore URL to tab root when the modal closes. Matches
       // /kept/$code or /unkept/$code (and bare /$code inside unkept context)
@@ -7197,6 +7199,15 @@
       openMintModal({ code });
     }
 
+    // Ask the parent editor to expand this iframe to cover the full kidlisp
+    // window while the keep flow is open. The Beacon/Taquito wallet modals
+    // render into THIS document's viewport — full-window means a proper desktop
+    // connect/sign modal instead of the cramped mobile-forced one in a tiny tab.
+    function requestEmbedExpand(on) {
+      if (!IS_EMBEDDED) return;
+      try { window.parent.postMessage({ type: 'keeps:expand', on: !!on }, window.location.origin); } catch (e) {}
+    }
+
     if (IS_EMBEDDED) {
       window.addEventListener('message', (e) => {
         if (e.origin !== window.location.origin) return;
-- 
2.51.2