← back to Quadrille Showroom
auto-save: 2026-07-01T09:10:58 (1 files) — public/js/dock.js
e03491072567f5fbc8fbbea3c1584969b26f6c02 · 2026-07-01 09:11:01 -0700 · Steve Abrams
Files touched
Diff
commit e03491072567f5fbc8fbbea3c1584969b26f6c02
Author: Steve Abrams <steve@designerwallcoverings.com>
Date: Wed Jul 1 09:11:01 2026 -0700
auto-save: 2026-07-01T09:10:58 (1 files) — public/js/dock.js
---
public/js/dock.js | 34 ++++++++++++++++++++++++++++++++++
1 file changed, 34 insertions(+)
diff --git a/public/js/dock.js b/public/js/dock.js
index 6c48511..5b2383e 100644
--- a/public/js/dock.js
+++ b/public/js/dock.js
@@ -80,6 +80,19 @@
'#qh-burger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}',
'#qh-burger.open span:nth-child(2){opacity:0;}',
'#qh-burger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}',
+ /* first-visit discoverability: gentle attention pulse + hint pill pointing at the ☰ */
+ '#qh-burger.qh-attn{animation:qh-attn-pulse 1.9s ease-out infinite;}',
+ '@keyframes qh-attn-pulse{0%{box-shadow:0 10px 30px -8px rgba(0,0,0,0.7),0 0 0 0 rgba(201,169,110,0.5);}' +
+ '70%{box-shadow:0 10px 30px -8px rgba(0,0,0,0.7),0 0 0 15px rgba(201,169,110,0);}' +
+ '100%{box-shadow:0 10px 30px -8px rgba(0,0,0,0.7),0 0 0 0 rgba(201,169,110,0);}}',
+ '#qh-burger-hint{position:fixed;top:25px;right:74px;z-index:9000;pointer-events:none;',
+ 'font-family:Georgia,serif;font-size:13px;letter-spacing:.4px;color:#f0e6cf;',
+ 'background:rgba(12,12,17,0.88);border:1px solid rgba(201,169,110,0.5);',
+ 'padding:6px 13px;border-radius:9px;backdrop-filter:blur(12px);white-space:nowrap;',
+ 'box-shadow:0 10px 30px -8px rgba(0,0,0,0.7);transition:opacity .4s, transform .4s;}',
+ '#qh-burger-hint::after{content:"";position:absolute;top:50%;right:-6px;transform:translateY(-50%);',
+ 'border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:6px solid rgba(201,169,110,0.5);}',
+ '#qh-burger-hint.qh-hint-gone{opacity:0;transform:translateX(10px);}',
/* launcher menu */
'#qh-menu{position:fixed;top:70px;right:16px;z-index:8999;width:236px;max-height:78vh;overflow:auto;',
'background:rgba(14,14,20,0.94);border:1px solid rgba(201,169,110,0.3);border-radius:14px;',
@@ -222,6 +235,14 @@
if (burger) burger.classList.remove('open');
}
+ // First-visit hint: stop the pulse, fade the pill out, and never show it again.
+ function dismissHint() {
+ if (burger) burger.classList.remove('qh-attn');
+ var h = document.getElementById('qh-burger-hint');
+ if (h) { h.classList.add('qh-hint-gone'); setTimeout(function () { if (h.parentNode) h.remove(); }, 450); }
+ try { localStorage.setItem('qh_burger_seen', '1'); } catch (e) {}
+ }
+
function buildMenu() {
burger = document.createElement('div');
burger.id = 'qh-burger';
@@ -229,6 +250,18 @@
burger.innerHTML = '<span></span><span></span><span></span>';
document.body.appendChild(burger);
+ // First-visit discoverability: pulse the ☰ + show a labeled hint pill pointing at it.
+ // Both are one-time — dismissed on first interaction and remembered so it never nags again.
+ var seenBurger = false;
+ try { seenBurger = !!localStorage.getItem('qh_burger_seen'); } catch (e) {}
+ if (!seenBurger) {
+ burger.classList.add('qh-attn');
+ var hint = document.createElement('div');
+ hint.id = 'qh-burger-hint';
+ hint.textContent = 'Controls & Views';
+ document.body.appendChild(hint);
+ }
+
menu = document.createElement('div');
menu.id = 'qh-menu';
document.body.appendChild(menu);
@@ -266,6 +299,7 @@
});
burger.addEventListener('click', function () {
+ dismissHint();
var open = menu.classList.toggle('open');
burger.classList.toggle('open', open);
if (open) reflectMenu();
← 842a1dc showroom polish (070126A): wrap consultation nook in a group
·
back to Quadrille Showroom
·
Age View Phase-5 gate: fix under-spec type sizes on Senior/E 1ea5d2b →