RanchiMall/btcwallet
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bug fixes

Browse Source
This commit is contained in:
sairaj mote 2022-07-28 17:16:08 +05:30
parent 6395707bfa
commit be881dbebc
4 changed files with 49 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
css/main.css
View File

@ -145,7 +145,7 @@ button .icon {
.cta { .cta {
text-transform: uppercase; text-transform: uppercase;
font-size: 0.8rem; font-size: 0.9rem;
font-weight: 700; font-weight: 700;
letter-spacing: 0.05em; letter-spacing: 0.05em;
padding: 0.8rem 1rem; padding: 0.8rem 1rem;
@ -248,7 +248,7 @@ strip-select {
} }
strip-option { strip-option {
font-size: 0.8rem; font-size: 0.9rem;
--border-radius: 0.2rem; --border-radius: 0.2rem;
-webkit-user-select: none; -webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
@ -287,7 +287,7 @@ ol li::before {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
text-align: center; text-align: center;
font-size: 0.8rem; font-size: 0.9rem;
font-weight: 500; font-weight: 500;
margin-top: 0.15rem; margin-top: 0.15rem;
margin-right: 1rem; margin-right: 1rem;
@ -449,7 +449,7 @@ ol li::before {
} }
.label { .label {
font-size: 0.8rem; font-size: 0.9rem;
color: rgba(var(--text-color), 0.8); color: rgba(var(--text-color), 0.8);
font-weight: 500; font-weight: 500;
margin-bottom: 0.2rem; margin-bottom: 0.2rem;
@ -675,7 +675,7 @@ ol li::before {
justify-content: center; justify-content: center;
padding: 0.5rem 0.3rem; padding: 0.5rem 0.3rem;
color: var(--text-color); color: var(--text-color);
font-size: 0.8rem; font-size: 0.9rem;
border-radius: 0.3rem; border-radius: 0.3rem;
font-weight: 500; font-weight: 500;
} }
@ -750,7 +750,7 @@ ol li::before {
padding: 0.8rem 1rem; padding: 0.8rem 1rem;
gap: 0.5rem; gap: 0.5rem;
white-space: normal; white-space: normal;
font-size: 0.8rem; font-size: 0.9rem;
border-radius: 0.5rem; border-radius: 0.5rem;
background-color: transparent; background-color: transparent;
border: thin solid rgba(var(--text-color), 0.3); border: thin solid rgba(var(--text-color), 0.3);
@ -863,6 +863,9 @@ ol li::before {
.transaction.in .transaction__amount::before { .transaction.in .transaction__amount::before {
content: "+ "; content: "+ ";
} }
.transaction.unconfirmed-tx {
grid-template-areas: "icon time amount" "icon receiver receiver" "icon txid txid" "icon unconfirmed unconfirmed";
}
.transaction.unconfirmed-tx .icon { .transaction.unconfirmed-tx .icon {
fill: var(--yellow); fill: var(--yellow);
} }
@ -882,7 +885,7 @@ ol li::before {
} }
.transaction__time { .transaction__time {
grid-area: time; grid-area: time;
font-size: 0.8rem; font-size: 0.9rem;
color: rgba(var(--text-color), 0.8); color: rgba(var(--text-color), 0.8);
} }
.transaction__amount { .transaction__amount {
@ -892,9 +895,13 @@ ol li::before {
} }
.transaction__id { .transaction__id {
grid-area: txid; grid-area: txid;
font-size: 0.8rem; font-size: 0.9rem;
color: rgba(var(--text-color), 0.8); color: rgba(var(--text-color), 0.8);
} }
.transaction .unconfirmed-wrapper {
grid-area: unconfirmed;
padding: 0.5rem 0;
}
.fab { .fab {
position: absolute; position: absolute;

2
css/main.min.css vendored
View File

File diff suppressed because one or more lines are too long

21
css/main.scss
View File

@ -136,7 +136,7 @@ button {
} }
.cta { .cta {
text-transform: uppercase; text-transform: uppercase;
font-size: 0.8rem; font-size: 0.9rem;
font-weight: 700; font-weight: 700;
letter-spacing: 0.05em; letter-spacing: 0.05em;
padding: 0.8rem 1rem; padding: 0.8rem 1rem;
@ -228,7 +228,7 @@ strip-select {
padding: 0.3rem; padding: 0.3rem;
} }
strip-option { strip-option {
font-size: 0.8rem; font-size: 0.9rem;
--border-radius: 0.2rem; --border-radius: 0.2rem;
user-select: none; user-select: none;
} }
@ -262,7 +262,7 @@ ol {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
text-align: center; text-align: center;
font-size: 0.8rem; font-size: 0.9rem;
font-weight: 500; font-weight: 500;
margin-top: 0.15rem; margin-top: 0.15rem;
margin-right: 1rem; margin-right: 1rem;
@ -413,7 +413,7 @@ ol {
height: 100%; height: 100%;
} }
.label { .label {
font-size: 0.8rem; font-size: 0.9rem;
color: rgba(var(--text-color), 0.8); color: rgba(var(--text-color), 0.8);
font-weight: 500; font-weight: 500;
margin-bottom: 0.2rem; margin-bottom: 0.2rem;
@ -626,7 +626,7 @@ ol {
justify-content: center; justify-content: center;
padding: 0.5rem 0.3rem; padding: 0.5rem 0.3rem;
color: var(--text-color); color: var(--text-color);
font-size: 0.8rem; font-size: 0.9rem;
border-radius: 0.3rem; border-radius: 0.3rem;
font-weight: 500; font-weight: 500;
.icon { .icon {
@ -699,7 +699,7 @@ ol {
padding: 0.8rem 1rem; padding: 0.8rem 1rem;
gap: 0.5rem; gap: 0.5rem;
white-space: normal; white-space: normal;
font-size: 0.8rem; font-size: 0.9rem;
border-radius: 0.5rem; border-radius: 0.5rem;
background-color: transparent; background-color: transparent;
border: thin solid rgba(var(--text-color), 0.3); border: thin solid rgba(var(--text-color), 0.3);
@ -806,6 +806,7 @@ ol {
} }
} }
&.unconfirmed-tx { &.unconfirmed-tx {
grid-template-areas: "icon time amount" "icon receiver receiver" "icon txid txid" "icon unconfirmed unconfirmed";
.icon { .icon {
fill: var(--yellow); fill: var(--yellow);
} }
@ -826,7 +827,7 @@ ol {
} }
&__time { &__time {
grid-area: time; grid-area: time;
font-size: 0.8rem; font-size: 0.9rem;
color: rgba(var(--text-color), 0.8); color: rgba(var(--text-color), 0.8);
} }
&__amount { &__amount {
@ -836,9 +837,13 @@ ol {
} }
&__id { &__id {
grid-area: txid; grid-area: txid;
font-size: 0.8rem; font-size: 0.9rem;
color: rgba(var(--text-color), 0.8); color: rgba(var(--text-color), 0.8);
} }
.unconfirmed-wrapper {
grid-area: unconfirmed;
padding: 0.5rem 0;
}
} }
.fab { .fab {
position: absolute; position: absolute;

28
index.html
View File

@ -318,8 +318,7 @@
<path d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z" /> <path d="M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z" />
</svg> </svg>
<h3>Keep your keys safe!</h3> <h3>Keep your keys safe!</h3>
<strong>Don't share with anyone. Once lost private key can't be <strong>Don't share with anyone. The private key cannot be recovered if lost.</strong>
recovered.</strong>
</div> </div>
<div id="generated_btc_addr" class="generated-id-card"></div> <div id="generated_btc_addr" class="generated-id-card"></div>
</div> </div>
@ -708,6 +707,10 @@
circle.classList.add("ripple"); circle.classList.add("ripple");
const rippleAnimation = circle.animate( const rippleAnimation = circle.animate(
[ [
{
opacity: 1,
transform: `scale(0)`
},
{ {
transform: "scale(4)", transform: "scale(4)",
opacity: 0, opacity: 0,
@ -1095,9 +1098,10 @@
let transactionsLazyLoader let transactionsLazyLoader
const render = { const render = {
transactionCard(transactionDetails) { transactionCard(transactionDetails) {
const { address, amount, time, txid, sender, receiver, type, block } = transactionDetails; let { address, amount, time, txid, sender, receiver, type, block } = transactionDetails;
let transactionReceiver let transactionReceiver
let icon let icon
// block = null
if (block) { if (block) {
if (type === 'out') { if (type === 'out') {
transactionReceiver = `Sent to ${receiver}`; transactionReceiver = `Sent to ${receiver}`;
@ -1110,7 +1114,8 @@
icon = svg`<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"/></svg>`; icon = svg`<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"/></svg>`;
} }
} else { } else {
transactionReceiver = (type === 'out' ? `Sent to ${receiver}` : `Received from ${sender}`) + ` (Unconfirmed)`; console.log(transactionDetails)
transactionReceiver = (type === 'out' ? `Sent to ${receiver}` : `Received from ${sender}`);
icon = svg`<svg class="icon" 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="M6,2l0.01,6L10,12l-3.99,4.01L6,22h12v-6l-4-4l4-3.99V2H6z M16,16.5V20H8v-3.5l4-4L16,16.5z"/></g></svg>`; icon = svg`<svg class="icon" 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="M6,2l0.01,6L10,12l-3.99,4.01L6,22h12v-6l-4-4l4-3.99V2H6z M16,16.5V20H8v-3.5l4-4L16,16.5z"/></g></svg>`;
} }
const className = `transaction grid ${type} ${block === null ? 'unconfirmed-tx' : ''}` const className = `transaction grid ${type} ${block === null ? 'unconfirmed-tx' : ''}`
@ -1121,8 +1126,14 @@
<div class="transaction__amount amount-shown" data-btc-amount="${amount}">${formatAmount(amount * globalExchangeRate[getRef('currency_selector').value])}</div> <div class="transaction__amount amount-shown" data-btc-amount="${amount}">${formatAmount(amount * globalExchangeRate[getRef('currency_selector').value])}</div>
<div class="transaction__receiver wrap-around">${transactionReceiver}</div> <div class="transaction__receiver wrap-around">${transactionReceiver}</div>
<div class="transaction__id wrap-around">TXID: ${txid}</div> <div class="transaction__id wrap-around">TXID: ${txid}</div>
</li> </li>
`; `;
// ${!block ? html`
// <p class="flex align-center unconfirmed-wrapper">
// <span class="margin-right-0-5">Confirmation taking too long? </span>
// <button class="button button--small">Increase fees</button>
// </p>
// `: ''}
}, },
async transactions(address) { async transactions(address) {
try { try {
@ -1342,11 +1353,12 @@
switch (e.target.value) { switch (e.target.value) {
case 'custom': case 'custom':
getRef('send_fee').readOnly = false; getRef('send_fee').readOnly = false;
getRef('send_fee').focusIn() getRef('send_fee').focusIn();
getRef('selected_fee_tip').textContent = 'Set custom fee' getRef('selected_fee_tip').textContent = 'Set custom fee';
break; break;
case 'suggested': case 'suggested':
getRef('selected_fee_tip').textContent = 'Estimated time of confirmation is 1hr' getRef('selected_fee_tip').textContent = 'Estimated time of confirmation is 1hr'
calculateFee();
break; break;
} }
}) })