UI improvements
This commit is contained in:
parent
1ffb70858c
commit
44456a6eaf
25
css/main.css
25
css/main.css
@ -55,6 +55,16 @@ body[data-theme=dark] a:any-link {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: "Overpass", sans-serif;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.h1 {
|
||||
font-size: 6rem;
|
||||
}
|
||||
@ -549,12 +559,25 @@ ul {
|
||||
}
|
||||
|
||||
.popup__header {
|
||||
position: relative;
|
||||
display: grid;
|
||||
gap: 0.5rem;
|
||||
width: 100%;
|
||||
padding: 0 1.5rem 0 0.5rem;
|
||||
align-items: center;
|
||||
grid-template-columns: auto 1fr auto;
|
||||
grid-template-columns: auto 1fr;
|
||||
}
|
||||
.popup__header > * {
|
||||
grid-row: 1;
|
||||
}
|
||||
.popup__header h3,
|
||||
.popup__header h4 {
|
||||
grid-column: 1/-1;
|
||||
justify-self: center;
|
||||
align-self: center;
|
||||
}
|
||||
.popup__header__close {
|
||||
grid-column: 1;
|
||||
}
|
||||
|
||||
#loading_page,
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -43,6 +43,15 @@ body[data-theme="dark"] {
|
||||
font-family: "Overpass", sans-serif;
|
||||
font-weight: 700;
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: "Overpass", sans-serif;
|
||||
font-weight: 700;
|
||||
}
|
||||
.h1 {
|
||||
font-size: 6rem;
|
||||
}
|
||||
@ -426,12 +435,25 @@ ul {
|
||||
display: none;
|
||||
}
|
||||
.popup__header {
|
||||
position: relative;
|
||||
display: grid;
|
||||
gap: 0.5rem;
|
||||
width: 100%;
|
||||
padding: 0 1.5rem 0 0.5rem;
|
||||
align-items: center;
|
||||
grid-template-columns: auto 1fr auto;
|
||||
grid-template-columns: auto 1fr;
|
||||
& > * {
|
||||
grid-row: 1;
|
||||
}
|
||||
h3,
|
||||
h4 {
|
||||
grid-column: 1/-1;
|
||||
justify-self: center;
|
||||
align-self: center;
|
||||
}
|
||||
&__close {
|
||||
grid-column: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#loading_page,
|
||||
|
||||
22
index.html
22
index.html
@ -10,7 +10,7 @@
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Overpass:wght@700&family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap"
|
||||
href="https://fonts.googleapis.com/css2?family=Overpass:ital,wght@0,400;0,500;1,400;1,500;1,700&family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap"
|
||||
rel="stylesheet">
|
||||
<script id="floGlobals">
|
||||
/* Constants for FLO blockchain operations !!Make sure to add this at begining!! */
|
||||
@ -328,7 +328,7 @@
|
||||
d="M12 10.586l4.95-4.95 1.414 1.414-4.95 4.95 4.95 4.95-1.414 1.414-4.95-4.95-4.95 4.95-1.414-1.414 4.95-4.95-4.95-4.95L7.05 5.636z" />
|
||||
</svg>
|
||||
</button>
|
||||
<h3>Redeem fund</h3>
|
||||
<h3>Withdraw fund</h3>
|
||||
</header>
|
||||
<div id="redeem_process">
|
||||
<div id="redeem_precess__get_priv_key">
|
||||
@ -357,8 +357,8 @@
|
||||
</label>
|
||||
</sm-input>
|
||||
<div class="multi-state-button">
|
||||
<button id="redeem_private_key_button" type="submit"
|
||||
class="button button--primary cta">Redeem</button>
|
||||
<button id="redeem_private_key_button" type="submit" class="button button--primary cta">Confirm
|
||||
withdrawal</button>
|
||||
</div>
|
||||
</sm-form>
|
||||
</div>
|
||||
@ -368,7 +368,7 @@
|
||||
<path d="M0 0h24v24H0V0z" fill="none" />
|
||||
<path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z" />
|
||||
</svg>
|
||||
<h4>Redeem request sent</h4>
|
||||
<h4>Withdraw request sent</h4>
|
||||
<p>Balance may take upto 30mins to reflect in your FLO address</p>
|
||||
</div>
|
||||
<div class="grid gap-0-5 hidden justify-center text-center">
|
||||
@ -748,7 +748,7 @@
|
||||
<span class="value net-value" style="color: var(--green)">${formatAmount(netValue[preferredCurrency], preferredCurrency)}</span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="button fund-investor__redeem" ?disabled=${!isRedeemable}>Redeem</button>
|
||||
<button class="button fund-investor__redeem" ?disabled=${!isRedeemable}>Withdraw</button>
|
||||
</li>
|
||||
`
|
||||
},
|
||||
@ -816,7 +816,7 @@
|
||||
<span class="value net-value" style="color: var(--green)">${formatAmount(netValue[preferredCurrency], preferredCurrency)}</span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="button fund-investor__redeem" ?disabled=${!isRedeemable}>Redeem</button>
|
||||
<button class="button fund-investor__redeem" ?disabled=${!isRedeemable}>Withdraw</button>
|
||||
</li>
|
||||
`
|
||||
},
|
||||
@ -1171,7 +1171,6 @@
|
||||
allowsEarlyWithdrawal,
|
||||
}
|
||||
total_invested += amount;
|
||||
total_net += netVal;
|
||||
if (closed) {
|
||||
console.log(closed)
|
||||
/* TODO: UI: render closing data
|
||||
@ -1186,6 +1185,7 @@
|
||||
i: index of the txid (of closing tx) ie, funds[k][i].txid
|
||||
}
|
||||
*/
|
||||
total_net += closed.amountFinal;
|
||||
obj.finalAmount = {
|
||||
inr: closed.amountFinal.toFixed(2),
|
||||
usd: (closed.amountFinal / closed.USD_net).toFixed(2),
|
||||
@ -1193,6 +1193,7 @@
|
||||
investorsFrag.push(render.closedInvestmentCard({ ...obj, ...closed }))
|
||||
floGlobals.investments[`${k}_${investor}`] = { amountInvested: obj.amountInvested, netValue: obj.finalAmount }
|
||||
} else {
|
||||
total_net += netVal;
|
||||
investorsFrag.push(render.investmentCard(obj))
|
||||
floGlobals.investments[`${k}_${investor}`] = { amountInvested: obj.amountInvested, netValue: obj.netValue }
|
||||
}
|
||||
@ -1317,6 +1318,11 @@
|
||||
floExchangeAPI.closeBobsFundInvestment(fundId, investorId, privKey).then(result => {
|
||||
console.log(result)
|
||||
showChildElement(getRef('redeem_process'), 1, { entry: slideInLeft, exit: slideOutLeft });
|
||||
const redeemButton = document.getElementById(floGlobals.redeemId.join('_'))?.querySelector('.fund-investor__redeem')
|
||||
if (redeemButton) {
|
||||
redeemButton.textContent = 'Redeemed'
|
||||
redeemButton.disabled = true
|
||||
}
|
||||
}).catch(error => {
|
||||
getRef('redeem_failed_message').textContent = error.message
|
||||
showChildElement(getRef('redeem_process'), 2, { entry: slideInLeft, exit: slideOutLeft });
|
||||
|
||||
Loading…
Reference in New Issue
Block a user