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

Merge pull request #2914 from mempool/mononaut/string-truncation

Browse Source 
dynamic CSS text truncation component
This commit is contained in:
softsimon
2023-01-16 17:47:40 +04:00
committed by GitHub
parent 0202fb68a0 c69f2f2bc2
commit 9b61e2bcb0
22 changed files with 171 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/app/lightning/channel/channel-box/channel-box.component.html
View File

@@ -2,9 +2,10 @@
<div class="box-left text-truncate">
<h3 class="mb-0 text-truncate">{{ channel.alias || '?' }}</h3>
<a [routerLink]="['/lightning/node' | relativeUrl, channel.public_key]" >
{{ channel.public_key | shortenString : 12 }}
<app-truncate [text]="channel.public_key" [lastChars]="6">
<app-clipboard [text]="channel.public_key"></app-clipboard>
</app-truncate>
</a>
<app-clipboard [text]="channel.public_key"></app-clipboard>
</div>
<div class="box-right">
<div class="second-line"><ng-container *ngTemplateOutlet="xChannels; context: {$implicit: channel.channels }"></ng-container></div>

5
frontend/src/app/lightning/channels-list/channels-list.component.html
View File

@@ -47,9 +47,10 @@
<div>{{ node.alias || '?' }}</div>
<div class="second-line">
<a [routerLink]="['/lightning/node' | relativeUrl, node.public_key]">
<span>{{ node.public_key | shortenString : publicKeySize }}</span>
<app-truncate [text]="node.public_key" [maxWidth]="200" [lastChars]="6">
<app-clipboard [text]="node.public_key" size="small"></app-clipboard>
</app-truncate>
</a>
<app-clipboard [text]="node.public_key" size="small"></app-clipboard>
</div>
</td>
<td class="alias text-left d-none d-md-table-cell">

8
frontend/src/app/lightning/node/node.component.html
View File

@@ -3,11 +3,11 @@
<div class="title-container mb-2" *ngIf="!error">
<h1 class="mb-0 text-truncate">{{ node.alias }}</h1>
<span class="tx-link">
<a [routerLink]="['/lightning/node' | relativeUrl, node.public_key]">
<span class="d-inline d-lg-none">{{ node.public_key | shortenString : 24 }}</span>
<span class="d-none d-lg-inline">{{ node.public_key }}</span>
<a class="node-id" [routerLink]="['/lightning/node' | relativeUrl, node.public_key]">
<app-truncate [text]="node.public_key" [lastChars]="8">
<app-clipboard [text]="node.public_key"></app-clipboard>
</app-truncate>
</a>
<app-clipboard [text]="node.public_key"></app-clipboard>
</span>
</div>

5
frontend/src/app/lightning/node/node.component.scss
View File

@@ -8,6 +8,11 @@
flex-wrap: wrap;
}
.node-id {
width: 0;
flex-grow: 1;
}
.qr-wrapper {
background-color: #FFF;
padding: 10px;