machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improvments to responsiveness

Browse Source
This commit is contained in:
softsimon
2020-03-03 17:47:01 +07:00
parent 2fe7af0c22
commit c1a8863861
12 changed files with 76 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/src/app/components/footer/footer.component.html
View File

@@ -1,18 +1,19 @@
<footer class="footer">
<div class="container">
<div class="container-lg">
<div class="row text-center" *ngIf="memPoolInfo">
<div class="col">
<span class="txPerSecond">Tx weight per second:</span>&nbsp;
<div class="progress">
<span class="txPerSecond">Tx weight per second:</span>
<div class="progress sub-text">
<div class="progress-bar {{ progressClass }}" role="progressbar" [ngStyle]="{'width': progressWidth}">{{ memPoolInfo?.vBytesPerSecond | ceil | number }} vBytes/s</div>
</div>
</div>
<div class="col">
<span class="unconfirmedTx">Unconfirmed transactions:</span>&nbsp;<b>{{ memPoolInfo?.memPoolInfo?.size | number }}</b>
<span class="unconfirmedTx">Unconfirmed<span class="extra-text"> transactions</span>:</span>
<div class="sub-text">{{ memPoolInfo?.memPoolInfo?.size | number }}</div>
</div>
<div class="col">
<span class="mempoolSize">Mempool size:</span>&nbsp;<b>{{ mempoolSize | bytes }} ({{ mempoolBlocks }} block<span [hidden]="mempoolBlocks <= 1">s</span>)</b>
<span class="mempoolSize">Mempool size:</span>
<div class="sub-text">{{ mempoolSize | bytes }} ({{ mempoolBlocks }} block<span [hidden]="mempoolBlocks <= 1">s</span>)</div>
</div>
</div>
</div>

25
frontend/src/app/components/footer/footer.component.scss
View File

@@ -7,8 +7,29 @@
box-shadow: 15px 15px 15px 15px #000;
}
.footer > .container {
margin-top: 17px;
.sub-text {
display: block;
font-weight: bold;
}
.footer > div {
margin-top: 3px;
}
@media (min-width: 1200px) {
.footer > div {
margin-top: 17px;
}
.sub-text {
margin-left: 5px;
display: inline-block;
}
}
@media (max-width: 767.98px) {
.extra-text {
display: none;
}
}
.txPerSecond {