From 1c3dabed864ed6ee9ed3d3e52b14aab09dad9e41 Mon Sep 17 00:00:00 2001 From: sairaj mote Date: Sun, 28 Aug 2022 22:17:54 +0530 Subject: [PATCH] minor UI fix --- components.js | 25 +++++++++++-------------- index.html | 3 +-- 2 files changed, 12 insertions(+), 16 deletions(-) diff --git a/components.js b/components.js index a5b9cdf..f124d7a 100644 --- a/components.js +++ b/components.js @@ -1001,11 +1001,11 @@ smNotifications.innerHTML = ` } .icon--success { fill: var(--green); - } - .icon--failure, - .icon--error { + } + .icon--failure, + .icon--error { fill: var(--danger-color); - } + } .close{ height: 2rem; width: 2rem; @@ -1117,13 +1117,13 @@ customElements.define('sm-notifications', class extends HTMLElement { createNotification(message, options = {}) { const { pinned = false, icon = '', action } = options; - const notification = document.createElement('output') + const notification = document.createElement('div') notification.id = this.randString(8) notification.classList.add('notification'); let composition = ``; composition += `
${icon}
-

${message}

+ ${message} `; if (action) { composition += ` @@ -1177,6 +1177,7 @@ customElements.define('sm-notifications', class extends HTMLElement { } removeNotification(notification, direction = 'left') { + if (!notification) return; const sign = direction === 'left' ? '-' : '+'; notification.animate([ { @@ -1218,8 +1219,10 @@ customElements.define('sm-notifications', class extends HTMLElement { this.mediaQuery.addEventListener('change', this.handleOrientationChange); this.notificationPanel.addEventListener('pointerdown', e => { - if (e.target.closest('.notification')) { - this.swipeThreshold = this.clientWidth / 2; + if (e.target.closest('.close')) { + this.removeNotification(e.target.closest('.notification')); + } else if (e.target.closest('.notification')) { + this.swipeThreshold = e.target.closest('.notification').getBoundingClientRect().width / 2; this.currentTarget = e.target.closest('.notification'); this.currentTarget.setPointerCapture(e.pointerId); this.startTime = Date.now(); @@ -1262,12 +1265,6 @@ customElements.define('sm-notifications', class extends HTMLElement { this.notificationPanel.releasePointerCapture(e.pointerId); this.currentX = 0; }); - this.notificationPanel.addEventListener('click', e => { - if (e.target.closest('.close')) { - this.removeNotification(e.target.closest('.notification')); - } - }); - const observer = new MutationObserver(mutationList => { mutationList.forEach(mutation => { if (mutation.type === 'childList') { diff --git a/index.html b/index.html index 4631099..481f1ed 100644 --- a/index.html +++ b/index.html @@ -1515,16 +1515,15 @@ console.error(e) }) }).catch(error => { + console.error(error) notify(`Error sending transaction \n ${error}`, 'error'); }).finally(_ => { buttonLoader('send_transaction', false) }) }).catch(err => { notify(err, 'error') - }).finally(() => { buttonLoader('send_transaction', false) }) - } // detect if given string is a bitcoin transaction id