From a6728ec535013b6cbd0236e1da314ad353cd862c Mon Sep 17 00:00:00 2001
From: luciano <info@zappacosta.eu>
Date: Fri, 31 Jul 2026 11:20:42 +0200
Subject: [PATCH] Repertoire as an aligned two-column checkbox list

The Auto VJ pill style (hidden checkbox, ragged flex wrap) didn't fit
the long clip names: #glb-anims now lays out as a two-column grid with
visible aligned checkboxes, ellipsis on overflow and green accent.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 src/control.js |  2 +-
 src/style.css  | 23 +++++++++++++++++++++++
 2 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/src/control.js b/src/control.js
index 6483341..88494db 100644
--- a/src/control.js
+++ b/src/control.js
@@ -178,7 +178,7 @@ function renderGlbClips(names) {
       send({ type: 'glbAnims', names: glbClipSel });
     });
     l.appendChild(c);
-    l.appendChild(document.createTextNode(' ' + n));
+    l.appendChild(document.createTextNode(n));
     box.appendChild(l);
   });
 }
diff --git a/src/style.css b/src/style.css
index de37c42..6c2c3b2 100644
--- a/src/style.css
+++ b/src/style.css
@@ -827,3 +827,26 @@ kbd {
 .av-fam { font-size: 11px; padding: 4px 8px; border: 1px solid #444; border-radius: 8px; cursor: pointer; opacity: .75; }
 .av-fam.on { border-color: #4caf50; background: rgba(76,175,80,.15); opacity: 1; }
 .av-fam input { display: none; }
+
+/* Dance repertoire: a proper aligned two-column checkbox list (the Auto VJ
+   pill style hides the checkbox and wraps raggedly with long clip names) */
+#glb-anims { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; }
+#glb-anims .av-fam {
+  display: flex;
+  align-items: center;
+  gap: 7px;
+  padding: 5px 8px;
+  font-size: 11.5px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+#glb-anims .av-fam input {
+  display: inline-block;
+  width: 13px;
+  height: 13px;
+  margin: 0;
+  flex: 0 0 auto;
+  accent-color: #4caf50;
+}
+#glb-anims .hint-mini { grid-column: 1 / -1; }