diff --git a/docs/mockup_cabinet.html b/docs/mockup_cabinet.html index 05d6e4b..888ad0c 100644 --- a/docs/mockup_cabinet.html +++ b/docs/mockup_cabinet.html @@ -430,6 +430,18 @@ body{font-family:'Inter',sans-serif;background:var(--body-bg);color:var(--text); .qa-submit-txt .qs-title{font-size:14px;font-weight:700;color:#fff;margin-bottom:2px} .qa-submit-txt .qs-sub{font-size:12px;color:rgba(255,255,255,.5)} .qa-sep{height:1px;background:var(--border);margin:12px 0} +/* Custom answer option */ +.qa-custom-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border:1.5px dashed #CBD5E1;border-radius:8px;font-size:12px;font-weight:600;color:#9CA3AF;cursor:pointer;background:transparent;font-family:'Inter',sans-serif;transition:all .15s;margin-top:2px} +.qa-custom-btn:hover{border-color:var(--primary);color:var(--primary)} +.qa-custom-btn.open{border-color:var(--primary);color:var(--primary);background:var(--light)} +.qa-custom-expand{display:none;align-items:center;gap:7px;margin-top:8px} +.qa-custom-expand.show{display:flex} +.qa-custom-inp{flex:1;border:1.5px solid var(--border);border-radius:8px;padding:8px 12px;font-size:13px;font-family:'Inter',sans-serif;color:var(--text);background:var(--white);outline:none} +.qa-custom-inp:focus{border-color:var(--mid);box-shadow:0 0 0 3px rgba(16,185,129,.08)} +.qa-custom-inp::placeholder{color:#9CA3AF} +.qa-custom-mic{width:34px;height:34px;border-radius:8px;background:var(--light);border:1.5px solid rgba(4,120,87,.2);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all .15s} +.qa-custom-mic:hover{background:#D1FAE5} +.qa-custom-mic.rec{background:#FEF2F2;border-color:#FECACA;animation:recPulse 1.4s ease-in-out infinite} /* Voice input in questionnaire */ .qa-voice-row{display:flex;align-items:center;gap:8px;margin-top:8px} .qa-mic-btn{display:flex;align-items:center;gap:7px;padding:7px 12px;border:1.5px solid var(--border);border-radius:8px;background:var(--white);cursor:pointer;font-size:12px;font-weight:600;color:var(--muted);font-family:'Inter',sans-serif;transition:all .15s} @@ -1605,6 +1617,28 @@ function toggleDoc(row){ if(!isOpen) panel.classList.add('open'); } +// Inject "custom answer" option into every radio group +document.querySelectorAll('.qa-radios').forEach((grp,i)=>{ + const uid='cust'+i; + const btn=document.createElement('button'); + btn.className='qa-custom-btn'; + btn.innerHTML=' Свой вариант'; + btn.onclick=()=>{ + btn.classList.toggle('open'); + exp.classList.toggle('show'); + if(exp.classList.contains('show')) inp.focus(); + }; + const exp=document.createElement('div'); + exp.className='qa-custom-expand'; + exp.innerHTML=` + `; + const inp=exp.querySelector('input'); + grp.after(btn); + btn.after(exp); +}); + function qsel(el){ const grp=el.closest('.qa-radios'); grp.querySelectorAll('.qa-radio').forEach(r=>r.classList.remove('sel'));