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

UI improvements

Browse Source
This commit is contained in:
sairaj mote 2023-09-04 04:06:20 +05:30
parent 9d63e36e23
commit 9a72ffa7db
4 changed files with 26 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
css/main.css
View File

@ -872,7 +872,7 @@ h3 {
display: none !important; display: none !important;
} }
} }
@media screen and (min-width: 64rem) { @media screen and (min-width: 40rem) {
h1 { h1 {
font-size: 3vw; font-size: 3vw;
} }
@ -882,6 +882,11 @@ h3 {
.popup__header { .popup__header {
padding: 1.5rem 1.5rem 0 0.75rem; padding: 1.5rem 1.5rem 0 0.75rem;
} }
#request_loan_popup {
--width: 32rem;
}
}
@media screen and (min-width: 46rem) {
#main_page { #main_page {
grid-template-columns: 18rem 1fr; grid-template-columns: 18rem 1fr;
} }
@ -891,9 +896,6 @@ h3 {
top: 1rem; top: 1rem;
overflow-y: auto; overflow-y: auto;
} }
#request_loan_popup {
--width: 32rem;
}
} }
@media (any-hover: hover) { @media (any-hover: hover) {
::-webkit-scrollbar { ::-webkit-scrollbar {

2
css/main.min.css vendored
View File

File diff suppressed because one or more lines are too long

10
css/main.scss
View File

@ -826,7 +826,7 @@ h3 {
} }
} }
@media screen and (min-width: 64rem) { @media screen and (min-width: 40rem) {
h1 { h1 {
font-size: 3vw; font-size: 3vw;
} }
@ -836,6 +836,11 @@ h3 {
.popup__header { .popup__header {
padding: 1.5rem 1.5rem 0 0.75rem; padding: 1.5rem 1.5rem 0 0.75rem;
} }
#request_loan_popup {
--width: 32rem;
}
}
@media screen and (min-width: 46rem) {
#main_page { #main_page {
grid-template-columns: 18rem 1fr; grid-template-columns: 18rem 1fr;
& > :first-child { & > :first-child {
@ -844,9 +849,6 @@ h3 {
overflow-y: auto; overflow-y: auto;
} }
} }
#request_loan_popup {
--width: 32rem;
}
} }
@media (any-hover: hover) { @media (any-hover: hover) {
::-webkit-scrollbar { ::-webkit-scrollbar {

24
index.html
View File

@ -971,8 +971,8 @@
My Loans My Loans
${myLoanRequests.length ? html`<span class="badge">${myLoanRequests.length}</span>` : ''} ${myLoanRequests.length ? html`<span class="badge">${myLoanRequests.length}</span>` : ''}
</sm-chip> </sm-chip>
<sm-chip value="loan-requests" selected=${view === 'loan-requests'}> <sm-chip value="lend" selected=${view === 'lend'}>
Loan requests Lend
${loanRequests.length ? html`<span class="badge">${loanRequests.length}</span>` : ''} ${loanRequests.length ? html`<span class="badge">${loanRequests.length}</span>` : ''}
</sm-chip> </sm-chip>
</sm-chips> </sm-chips>
@ -993,20 +993,22 @@
</div> </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` ${loanRequests.length ? html`
<ul id="loan_requests_list"> <ul id="loan_requests_list">
${loanRequests.reverse().map(requestId => render.loanRequest(requestId, floGlobals.loanRequests[requestId]))} ${loanRequests.reverse().map(requestId => render.loanRequest(requestId, floGlobals.loanRequests[requestId]))}
</ul> </ul>
`: html` `: html`
<div class="grid gap-2 align-center justify-center" style="padding: 2vw 0;"> <strong>
<div class="grid gap-0-5"> Loan requests will appear here
<h1>Earn interest on your USD tokens</h1> </strong>
<p>Lend your USD tokens to earn interest assured by BTC collateral.</p>
</div>
<strong>
Borrower loan requests will appear here
</strong>
`} `}
`: ''} `: ''}
</div> </div>