diff --git a/index.html b/index.html index 8b8e82c..3600f87 100644 --- a/index.html +++ b/index.html @@ -135,6 +135,20 @@ .x:hover { color:#ff9a8a; border-color:#c0392b; } .hint { font-size:11px; color:var(--muted); margin-top:8px; } code { background:#0d1014; padding:1px 5px; border-radius:4px; color:#cfe3ff; } + + /* subtle live program string: shows the current patch; editable + copy/paste. + Faded by default so it doesn't compete with the editor; lights up on hover/focus. */ + .patchbar { display:flex; align-items:center; gap:9px; max-width:1100px; margin:16px auto 0; + padding:6px 11px; border:1px solid var(--edge); border-radius:9px; background:var(--panel); + opacity:.55; transition:opacity .15s, box-shadow .25s; } + .patchbar:hover, .patchbar:focus-within { opacity:1; } + .patchbar > label { flex:0 0 auto; font-size:10px; text-transform:uppercase; letter-spacing:.09em; color:var(--muted); } + .patchbar input { flex:1; min-width:0; background:transparent; border:0; outline:none; color:var(--txt); + font-family:"Courier New",monospace; font-size:12px; padding:3px 0; } + .patchbar button { flex:0 0 auto; font-size:11px; padding:4px 10px; } + .patchbar.applied { box-shadow:0 0 0 2px var(--cyan) inset; } + .patchbar.err input { color:#ff8a7a; } + [data-embed] .patchbar { display:none !important; } .ex-item { display:flex; gap:8px; align-items:center; padding:7px 9px; border:1px solid var(--edge); border-radius:8px; margin-bottom:6px; font-size:13px; background:var(--panel); cursor:pointer; } .ex-item:hover { border-color:var(--muted); } .ex-item.active { border-color:#2e7d32; box-shadow:inset 3px 0 0 #2e7d32; } /* loaded / playing */ @@ -359,6 +373,14 @@ + +
+