Add active state icons for rule condition buttons

This commit is contained in:
Jordan Wages 2025-07-16 00:40:03 -05:00
commit 20dfba8406
2 changed files with 11 additions and 4 deletions

View file

@ -286,12 +286,18 @@ document.addEventListener('DOMContentLoaded', async () => {
const btn = document.createElement('button');
btn.type = 'button';
btn.className = 'button is-small is-light';
btn.textContent = label;
const icon = document.createElement('img');
icon.width = 16;
icon.height = 16;
icon.className = 'mr-1';
btn.appendChild(icon);
btn.append(label);
let active = checkbox ? checkbox.checked : sectionEl && !sectionEl.classList.contains('is-hidden');
function update() {
btn.classList.toggle('is-info', active);
btn.classList.toggle('is-active', active);
icon.src = browser.runtime.getURL(`resources/svg/${active ? 'circledot' : 'circle'}.svg`);
if (sectionEl) sectionEl.classList.toggle('is-hidden', !active);
if (checkbox) checkbox.checked = active;
}