UI improvements
This commit is contained in:
parent
fc2dafa686
commit
8f0de4b0f0
11
css/main.css
11
css/main.css
@ -990,7 +990,7 @@ h3 {
|
|||||||
|
|
||||||
#transaction_result {
|
#transaction_result {
|
||||||
display: grid;
|
display: grid;
|
||||||
gap: 0.5rem;
|
gap: 1.5rem;
|
||||||
height: max(40vh, 24rem);
|
height: max(40vh, 24rem);
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@ -1004,7 +1004,7 @@ h3 {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
#transaction_result .icon {
|
#transaction_result > .icon {
|
||||||
justify-self: center;
|
justify-self: center;
|
||||||
height: 4rem;
|
height: 4rem;
|
||||||
width: 4rem;
|
width: 4rem;
|
||||||
@ -1013,18 +1013,21 @@ h3 {
|
|||||||
-webkit-animation: popup 1s;
|
-webkit-animation: popup 1s;
|
||||||
animation: popup 1s;
|
animation: popup 1s;
|
||||||
}
|
}
|
||||||
#transaction_result .icon--success {
|
#transaction_result > .icon--success {
|
||||||
fill: rgba(var(--background-color), 1);
|
fill: rgba(var(--background-color), 1);
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
background-color: #0bbe56;
|
background-color: #0bbe56;
|
||||||
}
|
}
|
||||||
#transaction_result .icon--failed {
|
#transaction_result > .icon--failed {
|
||||||
background-color: rgba(var(--text-color), 0.03);
|
background-color: rgba(var(--text-color), 0.03);
|
||||||
fill: var(--danger-color);
|
fill: var(--danger-color);
|
||||||
}
|
}
|
||||||
#transaction_result sm-copy {
|
#transaction_result sm-copy {
|
||||||
font-size: 0.8rem;
|
font-size: 0.8rem;
|
||||||
}
|
}
|
||||||
|
#transaction_result #transaction_link {
|
||||||
|
justify-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
@-webkit-keyframes popup {
|
@-webkit-keyframes popup {
|
||||||
0% {
|
0% {
|
||||||
|
|||||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -959,7 +959,7 @@ h3 {
|
|||||||
}
|
}
|
||||||
#transaction_result {
|
#transaction_result {
|
||||||
display: grid;
|
display: grid;
|
||||||
gap: 0.5rem;
|
gap: 1.5rem;
|
||||||
height: max(40vh, 24rem);
|
height: max(40vh, 24rem);
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@ -972,7 +972,7 @@ h3 {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
.icon {
|
& > .icon {
|
||||||
justify-self: center;
|
justify-self: center;
|
||||||
height: 4rem;
|
height: 4rem;
|
||||||
width: 4rem;
|
width: 4rem;
|
||||||
@ -992,6 +992,9 @@ h3 {
|
|||||||
sm-copy {
|
sm-copy {
|
||||||
font-size: 0.8rem;
|
font-size: 0.8rem;
|
||||||
}
|
}
|
||||||
|
#transaction_link {
|
||||||
|
justify-self: center;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@keyframes popup {
|
@keyframes popup {
|
||||||
0% {
|
0% {
|
||||||
|
|||||||
11
index.html
11
index.html
@ -2718,7 +2718,10 @@
|
|||||||
<p id="transaction_result__description"> ${description} </p>
|
<p id="transaction_result__description"> ${description} </p>
|
||||||
${success && result ? html`
|
${success && result ? html`
|
||||||
<div class="grid gap-1">
|
<div class="grid gap-1">
|
||||||
<a id="transaction_link" href=${`${floBlockchainAPI.current_server}tx/${result}`} style="margin-top: 1.5rem;" target="_blank">See transaction on blockchain</a>
|
<a id="transaction_link" class="flex align-center button--colored" href=${`${floBlockchainAPI.current_server}tx/${result}`} style="margin-top: 1.5rem;" target="_blank">
|
||||||
|
See transaction on blockchain
|
||||||
|
<svg class="icon margin-left-0-5" 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> <path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path> </svg>
|
||||||
|
</a>
|
||||||
<div class="grid">
|
<div class="grid">
|
||||||
<span class="label">Transaction ID</span>
|
<span class="label">Transaction ID</span>
|
||||||
<sm-copy class="justify-self-center" value=${result}></sm-copy>
|
<sm-copy class="justify-self-center" value=${result}></sm-copy>
|
||||||
@ -3215,8 +3218,10 @@
|
|||||||
floBlockchainAPI.writeData(creatorAddress, floData, creatorPrivateKey, creatorAddress).then((txid) => {
|
floBlockchainAPI.writeData(creatorAddress, floData, creatorPrivateKey, creatorAddress).then((txid) => {
|
||||||
showTransactionResult(true, txid, {
|
showTransactionResult(true, txid, {
|
||||||
title: 'Smart contract creation initiated',
|
title: 'Smart contract creation initiated',
|
||||||
description: html`Check details about your smart contract <a href=${`https://ranchimall.github.io/floscout/#/contract/${contractName}-${creatorAddress}`} target="_blank" rel="noopener noreferrer">here</a>.
|
description: html`
|
||||||
<br> It may take some time for the smart contract to be created.`
|
<strong> It may take some time for the smart contract to be created.</strong><br>
|
||||||
|
<a class="button button--small button--primary" style="margin-top: 0.5rem;" href=${`https://ranchimall.github.io/floscout/#/smart-contracts`} target="_blank" rel="noopener noreferrer">Check out created smart contract</a>
|
||||||
|
`
|
||||||
})
|
})
|
||||||
getRef('smart_contract_creation_form').reset()
|
getRef('smart_contract_creation_form').reset()
|
||||||
document.getElementById('create_contract_button').disabled = true
|
document.getElementById('create_contract_button').disabled = true
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user