Restyle VC lock as attached orange button segment
This commit is contained in:
@@ -111,9 +111,11 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display:flex;gap:0.75rem;align-items:center;flex-wrap:wrap;">
|
<div style="display:flex;gap:0.75rem;align-items:center;flex-wrap:wrap;">
|
||||||
<button class="btn btn-primary" id="vc-btn" onclick="submitTTS()" disabled style="opacity:0.5;">
|
<div style="display:inline-flex;">
|
||||||
<span id="spinner" class="spin" style="display:none;"></span><span id="vc-lock" style="font-size:0.75rem;">⚲</span> Speak in VC
|
<button class="btn btn-primary" id="vc-btn" onclick="submitTTS()" disabled style="opacity:0.5;border-top-right-radius:0;border-bottom-right-radius:0;">
|
||||||
</button>
|
<span id="spinner" class="spin" style="display:none;"></span> Speak in VC
|
||||||
|
</button><button id="vc-lock-btn" onclick="toggleVcLock()" style="border:none;background:#e67e22;color:#fff;padding:0.4rem 0.6rem;cursor:pointer;border-top-right-radius:4px;border-bottom-right-radius:4px;font-size:0.85rem;display:inline-flex;align-items:center;" title="Click to unlock">⚲</button>
|
||||||
|
</div>
|
||||||
<button class="btn btn-secondary" id="gen-only-btn" onclick="generateOnly()" style="display:none;">
|
<button class="btn btn-secondary" id="gen-only-btn" onclick="generateOnly()" style="display:none;">
|
||||||
<span id="gen-spinner" class="spin" style="display:none;"></span> Generate Only
|
<span id="gen-spinner" class="spin" style="display:none;"></span> Generate Only
|
||||||
</button>
|
</button>
|
||||||
@@ -360,22 +362,22 @@ loadSfxEmojis();
|
|||||||
// Show generate-only button for all modes
|
// Show generate-only button for all modes
|
||||||
document.getElementById('gen-only-btn').style.display = '';
|
document.getElementById('gen-only-btn').style.display = '';
|
||||||
|
|
||||||
// VC lock toggle — click the lock icon to unlock
|
// VC lock toggle
|
||||||
document.getElementById('vc-lock').addEventListener('click', function(e) {
|
function toggleVcLock() {
|
||||||
e.stopPropagation();
|
|
||||||
const btn = document.getElementById('vc-btn');
|
const btn = document.getElementById('vc-btn');
|
||||||
const lock = document.getElementById('vc-lock');
|
const lock = document.getElementById('vc-lock-btn');
|
||||||
if (btn.disabled) {
|
if (btn.disabled) {
|
||||||
btn.disabled = false;
|
btn.disabled = false;
|
||||||
btn.style.opacity = '1';
|
btn.style.opacity = '1';
|
||||||
lock.innerHTML = '⚳';
|
lock.innerHTML = '⚳';
|
||||||
|
lock.title = 'Click to lock';
|
||||||
} else {
|
} else {
|
||||||
btn.disabled = true;
|
btn.disabled = true;
|
||||||
btn.style.opacity = '0.5';
|
btn.style.opacity = '0.5';
|
||||||
lock.innerHTML = '⚲';
|
lock.innerHTML = '⚲';
|
||||||
|
lock.title = 'Click to unlock';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
|
||||||
document.getElementById('vc-lock').style.cursor = 'pointer';
|
|
||||||
let sfxEmojis = [];
|
let sfxEmojis = [];
|
||||||
let sfxDrawerOpen = false;
|
let sfxDrawerOpen = false;
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user