// attach remove event listeners for each dynamically created remove button document.querySelectorAll('.remove-btn[data-url]').forEach(btn => btn.removeEventListener('click', handleRemoveBlock); btn.addEventListener('click', handleRemoveBlock); );
.remove-btn background: none; border: none; color: #ff8a8a; font-size: 1.3rem; cursor: pointer; font-weight: bold; padding: 0 8px; transition: 0.1s; border-radius: 40px;
.btn-warning background: #a56b1f; color: #ffe3b3;
.sub color: #8f98b3; margin-top: 8px; font-size: 0.9rem; font-weight: 400;
.empty-msg text-align: center; padding: 28px 20px; color: #5f6a87; font-style: italic; font-size: 0.85rem;
// small UX alert simulation (non-intrusive) function triggerSimulatedBlockAlert(url) // just a visual flash effect on footer or info, but not annoying alert const footer = document.querySelector('footer'); if (footer) footer.style.transition = '0.1s'; footer.style.backgroundColor = '#4a2525'; setTimeout(() => footer.style.backgroundColor = ''; , 300); // optional: console log console.log(`[RUN BLOCKER] Blocked attempt: $url`);
/* input area */ .input-group margin-bottom: 28px;
// DOM elements const urlInput = document.getElementById('urlInput'); const allowBtn = document.getElementById('allowBtn'); const blockDemoBtn = document.getElementById('blockDemoBtn'); const clearAllBtn = document.getElementById('clearAllBtn'); const blockedListEl = document.getElementById('blockedList'); const statusSpan = document.getElementById('statusMsg');