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

improve preview block hash truncation

Browse Source
This commit is contained in:
Mononaut 2022-09-11 01:17:46 +00:00
parent 0ac3352835
commit a74811cb7e
No known key found for this signature in database
GPG Key ID: 61B952CAF4838F94
2 changed files with 23 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/app/components/block/block-preview.component.html
View File

@ -10,11 +10,10 @@
<ng-template [ngIf]="blockHeight === 0"><ng-container i18n="@@2303359202781425764">Genesis</ng-container></ng-template> <ng-template [ngIf]="blockHeight === 0"><ng-container i18n="@@2303359202781425764">Genesis</ng-container></ng-template>
<ng-template [ngIf]="blockHeight" i18n="shared.block-title">{{ blockHeight }}</ng-template> <ng-template [ngIf]="blockHeight" i18n="shared.block-title">{{ blockHeight }}</ng-template>
</h1> </h1>
<h2 class="subtitle" *ngIf="blockHash"> <div class="blockhash" *ngIf="blockHash">
{{ blockHash.slice(0,20) }} <h2 class="truncate right">{{ blockHash.slice(0,32) }}</h2>
<br> <h2 class="truncate left">{{ blockHash.slice(32) }}</h2>
…{{ blockHash.slice(-19) }} </div>
</h2>
</div> </div>
</div> </div>
<table class="table table-borderless table-striped"> <table class="table table-borderless table-striped">

25
frontend/src/app/components/block/block-preview.component.scss
View File

@ -18,16 +18,29 @@
.title { .title {
flex-shrink: 0; flex-shrink: 0;
flex-grow: 0; flex-grow: 0;
margin-right: 8px; margin-right: 30px;
font-size: 62px; font-size: 64px;
} }
.subtitle { .blockhash {
width: 0;
flex-grow: 1;
flex-shrink: 1; flex-shrink: 1;
font-family: Consolas,Liberation Mono,Courier New,monospace; font-family: Consolas,Liberation Mono,Courier New,monospace;
font-size: 31px; font-size: 32px;
overflow: hidden; text-align: right;
text-overflow: clip;
.truncate {
max-width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin: 0;
&.left {
direction: rtl;
}
}
} }
} }