RanchiMall/floscout-testnet
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI changes

Browse Source
This commit is contained in:
sairaj mote 2023-04-15 02:51:49 +05:30
parent ea6773a768
commit 74e341cb26
6 changed files with 61 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
css/main.css
View File

@ -1045,6 +1045,10 @@ p {
grid-area: 1/1;
}
.info-row {
flex-direction: column;
}
@media only screen and (min-width: 640px) {
.margin,
.page {
@ -1083,8 +1087,12 @@ p {
grid-template-columns: 2fr 1fr 1fr;
align-items: center;
}
.info-row {
flex-wrap: wrap;
flex-direction: row;
}
.info-row h5 {
min-width: 8rem;
min-width: 12rem;
}
}
@media only screen and (min-width: 1280px) {
@ -1105,4 +1113,3 @@ p {
cursor: pointer;
}
}
/*# sourceMappingURL=main.css.map */

1
css/main.css.map
View File

File diff suppressed because one or more lines are too long

3
css/main.min.css vendored
View File

File diff suppressed because one or more lines are too long

1
css/main.min.css.map
View File

File diff suppressed because one or more lines are too long

7
css/main.scss
View File

@ -952,6 +952,9 @@ p {
grid-area: 1/1;
}
}
.info-row {
flex-direction: column;
}
@media only screen and (min-width: 640px) {
.margin,
.page {
@ -997,8 +1000,10 @@ p {
align-items: center;
}
.info-row {
flex-wrap: wrap;
flex-direction: row;
h5 {
min-width: 8rem;
min-width: 12rem;
}
}
}

38
index.html
View File

@ -807,103 +807,103 @@
`)}
</ul>
`: ''}
<div class="card">
<div class="flex align-center gap-0-5 info-row">
<div class="card grid gap-1-5">
<div class="flex gap-0-5 info-row">
<h5 class="label">Contract Type</h5>
<h4>${replaceDash(contractType)}</h4>
</div>
${contractSubtype ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Contract Subtype</h5>
<h4>${replaceDash(contractSubtype)}</h4>
</div>
` : ''}
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Contract Address</h5>
<a href=${`#/address/${contractAddress}`} class="address wrap-around">${contractAddress}</a>
</div>
${expiration ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Expiration</h5>
<h4>${expiration}</h4>
</div>
` : ''}
${payeeAddress ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Payee Address</h5>
<h4>${payeeAddress}</h4>
</div>
`: ''}
${minAmount ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Min. Subscription Amount</h5>
<h4>${formatAmount(minAmount, 'usd')}</h4>
</div>
`: ''}
${maxAmount ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Max. Subscription Amount</h5>
<h4>${formatAmount(maxAmount, 'usd')}</h4>
</div>
`: ''}
${participationFees ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Participation Fees</h5>
<h4>${formatAmount(participationFees, 'usd')}</h4>
</div>
`: ''}
${contractType === 'one-time-event' ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Token Used</h5>
<h4>${token}</h4>
</div>
`: ''}
${contractType === 'continuos-event' && contractSubtype === 'tokenswap' ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Input token</h5>
<h4>${accepting_token}</h4>
</div>
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Output token</h5>
<h4>${selling_token}</h4>
</div>
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">exchange rate</h5>
<h4>1 ${selling_token} = ${price} ${accepting_token}</h4>
</div>
`: ''}
${numberOfDeposits ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Number of deposits</h5>
<h4>${numberOfDeposits}</h4>
</div>
`: ''}
${numberOfParticipants ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Number of participants</h5>
<h4>${numberOfParticipants}</h4>
</div>
`: ''}
${priceType ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Price type</h5>
<h4>${priceType}</h4>
</div>
`: ''}
${oracle_address ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Oracle address</h5>
<a href=${`#/address/${oracle_address}`} class="address wrap-around">${oracle_address}</a>
</div>
`: ''}
${totalParticipationAmount ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Total participation amount</h5>
<h4>${formatAmount(totalParticipationAmount, 'usd')} ${accepting_token}</h4>
</div>
`: ''}
${totalHonorAmount ? html`
<div class="flex align-center gap-0-5 info-row">
<div class="flex gap-0-5 info-row">
<h5 class="label">Total output amount</h5>
<h4>${formatAmount(totalHonorAmount, 'usd')} ${selling_token}</h4>
</div>