Bug fixes and UI improvements
This commit is contained in:
sairaj mote
parent
8b14c19ed1
commit
619a261732
18
css/main.css
18
css/main.css
@ -984,6 +984,24 @@ sm-button[variant=primary] {
|
||||
grid-template-rows: 1fr auto;
|
||||
}
|
||||
|
||||
.prime-action {
|
||||
display: flex;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 500;
|
||||
white-space: initial;
|
||||
text-align: left;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
.prime-action .icon {
|
||||
background-color: rgba(var(--text-color), 0.06);
|
||||
fill: var(--accent-color);
|
||||
border-radius: 2rem;
|
||||
padding: 0.6rem;
|
||||
height: 2.6rem;
|
||||
width: 2.6rem;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.initial {
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -1014,6 +1014,24 @@ sm-button[variant="primary"] {
|
||||
grid-template-rows: 1fr auto;
|
||||
}
|
||||
|
||||
.prime-action {
|
||||
display: flex;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 500;
|
||||
white-space: initial;
|
||||
text-align: left;
|
||||
padding: 0.5rem;
|
||||
.icon {
|
||||
background-color: rgba(var(--text-color), 0.06);
|
||||
fill: var(--accent-color);
|
||||
border-radius: 2rem;
|
||||
padding: 0.6rem;
|
||||
height: 2.6rem;
|
||||
width: 2.6rem;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.initial {
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
|
||||
49
index.html
49
index.html
@ -219,13 +219,26 @@
|
||||
<main id="main_page" class="page grid hidden">
|
||||
<section id="chat_page" class="inner-page">
|
||||
<div id="contacts" class="grid">
|
||||
<section class="grid gap-0-5" style="padding: 1rem;">
|
||||
<h5>Multisig</h5>
|
||||
<div>
|
||||
<button class="button button--small" onclick="openCreationPopup('multisig')">Create
|
||||
address</button>
|
||||
<button class="button button--small" onclick="openPopup('multisig_tx_popup')">Initiate
|
||||
transaction</button>
|
||||
<section class="grid gap-0-5 card" style="padding: 1rem 1rem 0 1rem; border-radius: 0 0 1rem 1rem;">
|
||||
<h4>Bitcoin multisig</h4>
|
||||
<div class="flex align-center gap-0-5" style="margin: 0 -0.5rem 0.5rem;">
|
||||
<button class="prime-action" onclick="openCreationPopup('multisig')">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24"
|
||||
width="24px" fill="#000000">
|
||||
<path d="M0 0h24v24H0z" fill="none" />
|
||||
<path
|
||||
d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10h-4v4h-2v-4H7v-2h4V7h2v4h4v2z" />
|
||||
</svg>
|
||||
Create address
|
||||
</button>
|
||||
<button class="prime-action" onclick="openPopup('multisig_tx_popup')">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24"
|
||||
width="24px" fill="#000000">
|
||||
<path d="M0 0h24v24H0z" fill="none" />
|
||||
<path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" />
|
||||
</svg>
|
||||
Initiate transaction
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
<div class="grid header">
|
||||
@ -2504,11 +2517,6 @@
|
||||
} else if (type) {
|
||||
switch (type) {
|
||||
case 'TRANSACTION':
|
||||
if (floGlobals.pipeSigns[pipeID]) {
|
||||
floGlobals.pipeSigns[pipeID].add(sender)
|
||||
} else {
|
||||
floGlobals.pipeSigns[pipeID] = new Set()
|
||||
}
|
||||
return html.node`<p class="pipeline-event pipeline-event--signed event-card flex align-center">
|
||||
<svg class="icon margin-right-0-5" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><path d="M23,12l-2.44-2.79l0.34-3.69l-3.61-0.82L15.4,1.5L12,2.96L8.6,1.5L6.71,4.69L3.1,5.5L3.44,9.2L1,12l2.44,2.79l-0.34,3.7 l3.61,0.82L8.6,22.5l3.4-1.47l3.4,1.46l1.89-3.19l3.61-0.82l-0.34-3.69L23,12z M10.09,16.72l-3.8-3.81l1.48-1.48l2.32,2.33 l5.85-5.87l1.48,1.48L10.09,16.72z"/></g></svg>
|
||||
${getContactName(sender)} signed the transaction
|
||||
@ -2589,9 +2597,9 @@
|
||||
},
|
||||
multisigOption(address) {
|
||||
btcOperator.getBalance(address).then(balance => {
|
||||
const target = getRef('select_multisig_list').querySelector(`input[value="${address}"]`).parentNode.querySelector('.multisig-option__balance');
|
||||
const target = getRef('select_multisig_list').querySelector(`input[value="${address}"]`);
|
||||
if (target)
|
||||
target.textContent = `Balance: ${balance} BTC`;
|
||||
target.parentNode.querySelector('.multisig-option__balance').textContent = `Balance: ${balance} BTC`;
|
||||
}).catch(err => notify(err, 'error'))
|
||||
return html`
|
||||
<li>
|
||||
@ -3494,6 +3502,18 @@
|
||||
});
|
||||
}
|
||||
chatLazyLoader.init()
|
||||
if (getFloIdType(floID) === 'pipeline') {
|
||||
for (const key in chat) {
|
||||
const { type, sender } = chat[key]
|
||||
if (type === 'TRANSACTION') {
|
||||
if (floGlobals.pipeSigns[floID]) {
|
||||
floGlobals.pipeSigns[floID].add(sender)
|
||||
} else {
|
||||
floGlobals.pipeSigns[floID] = new Set()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
resolve()
|
||||
}).catch(error => {
|
||||
console.log(error)
|
||||
@ -3566,6 +3586,7 @@
|
||||
`)
|
||||
}
|
||||
}
|
||||
// to-do: fix signed transaction detection error caused due to lazy loading
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
|
||||
@ -2139,6 +2139,7 @@ smNotifications.innerHTML = `
|
||||
padding: 0.3rem;
|
||||
transition: background-color 0.3s, transform 0.3s;
|
||||
background-color: transparent;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.close:active{
|
||||
transform: scale(0.9);
|
||||
@ -2240,13 +2241,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 += `
|
||||
<div class="icon-container">${icon}</div>
|
||||
<p>${message}</p>
|
||||
<output>${message}</output>
|
||||
`;
|
||||
if (action) {
|
||||
composition += `
|
||||
@ -2300,6 +2301,7 @@ customElements.define('sm-notifications', class extends HTMLElement {
|
||||
}
|
||||
|
||||
removeNotification(notification, direction = 'left') {
|
||||
if (!notification) return;
|
||||
const sign = direction === 'left' ? '-' : '+';
|
||||
notification.animate([
|
||||
{
|
||||
@ -2341,8 +2343,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();
|
||||
@ -2385,12 +2389,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') {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user