UI improvements
This commit is contained in:
parent
9d63e36e23
commit
9a72ffa7db
10
css/main.css
10
css/main.css
@ -872,7 +872,7 @@ h3 {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 64rem) {
|
||||
@media screen and (min-width: 40rem) {
|
||||
h1 {
|
||||
font-size: 3vw;
|
||||
}
|
||||
@ -882,6 +882,11 @@ h3 {
|
||||
.popup__header {
|
||||
padding: 1.5rem 1.5rem 0 0.75rem;
|
||||
}
|
||||
#request_loan_popup {
|
||||
--width: 32rem;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 46rem) {
|
||||
#main_page {
|
||||
grid-template-columns: 18rem 1fr;
|
||||
}
|
||||
@ -891,9 +896,6 @@ h3 {
|
||||
top: 1rem;
|
||||
overflow-y: auto;
|
||||
}
|
||||
#request_loan_popup {
|
||||
--width: 32rem;
|
||||
}
|
||||
}
|
||||
@media (any-hover: hover) {
|
||||
::-webkit-scrollbar {
|
||||
|
||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -826,7 +826,7 @@ h3 {
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 64rem) {
|
||||
@media screen and (min-width: 40rem) {
|
||||
h1 {
|
||||
font-size: 3vw;
|
||||
}
|
||||
@ -836,6 +836,11 @@ h3 {
|
||||
.popup__header {
|
||||
padding: 1.5rem 1.5rem 0 0.75rem;
|
||||
}
|
||||
#request_loan_popup {
|
||||
--width: 32rem;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 46rem) {
|
||||
#main_page {
|
||||
grid-template-columns: 18rem 1fr;
|
||||
& > :first-child {
|
||||
@ -844,9 +849,6 @@ h3 {
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
#request_loan_popup {
|
||||
--width: 32rem;
|
||||
}
|
||||
}
|
||||
@media (any-hover: hover) {
|
||||
::-webkit-scrollbar {
|
||||
|
||||
24
index.html
24
index.html
@ -971,8 +971,8 @@
|
||||
My Loans
|
||||
${myLoanRequests.length ? html`<span class="badge">${myLoanRequests.length}</span>` : ''}
|
||||
</sm-chip>
|
||||
<sm-chip value="loan-requests" selected=${view === 'loan-requests'}>
|
||||
Loan requests
|
||||
<sm-chip value="lend" selected=${view === 'lend'}>
|
||||
Lend
|
||||
${loanRequests.length ? html`<span class="badge">${loanRequests.length}</span>` : ''}
|
||||
</sm-chip>
|
||||
</sm-chips>
|
||||
@ -993,20 +993,22 @@
|
||||
</div>
|
||||
`}
|
||||
`: ''}
|
||||
${view === 'loan-requests' ? html`
|
||||
${view === 'lend' ? html`
|
||||
<div class="grid gap-2 align-center justify-center" style="padding: 2vw 0;">
|
||||
<div class="grid">
|
||||
<h2>Earn interest on your USD tokens</h2>
|
||||
<p>Lend your USD tokens to earn interest assured by BTC collateral.</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
${loanRequests.length ? html`
|
||||
<ul id="loan_requests_list">
|
||||
${loanRequests.reverse().map(requestId => render.loanRequest(requestId, floGlobals.loanRequests[requestId]))}
|
||||
</ul>
|
||||
`: html`
|
||||
<div class="grid gap-2 align-center justify-center" style="padding: 2vw 0;">
|
||||
<div class="grid gap-0-5">
|
||||
<h1>Earn interest on your USD tokens</h1>
|
||||
<p>Lend your USD tokens to earn interest assured by BTC collateral.</p>
|
||||
</div>
|
||||
<strong>
|
||||
Borrower loan requests will appear here
|
||||
</strong>
|
||||
<strong>
|
||||
Loan requests will appear here
|
||||
</strong>
|
||||
`}
|
||||
`: ''}
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user