Create top 100 oldest nodes full page

This commit is contained in:
nymkappa 2022-08-17 21:29:04 +02:00
parent 9c8fd6431e
commit 350aedd934
No known key found for this signature in database
GPG Key ID: E155910B16E8BD04
5 changed files with 21 additions and 12 deletions

View File

@ -52,6 +52,13 @@ const routes: Routes = [
type: 'channels' type: 'channels'
}, },
}, },
{
path: 'nodes/oldest',
component: NodesRanking,
data: {
type: 'oldest'
},
},
{ {
path: '**', path: '**',
redirectTo: '' redirectTo: ''

View File

@ -2,4 +2,6 @@
</app-top-nodes-per-capacity> </app-top-nodes-per-capacity>
<app-top-nodes-per-channels [nodes$]="null" [widget]="false" *ngIf="type === 'channels'"> <app-top-nodes-per-channels [nodes$]="null" [widget]="false" *ngIf="type === 'channels'">
</app-top-nodes-per-channels> </app-top-nodes-per-channels>
<app-oldest-nodes [widget]="false" *ngIf="type === 'oldest'"></app-oldest-nodes>

View File

@ -1,6 +1,6 @@
<div [class]="!widget ? 'container-xl full-height' : ''"> <div [class]="!widget ? 'container-xl full-height' : ''">
<h1 *ngIf="!widget" class="float-left" i18n="lightning.top-100-capacity"> <h1 *ngIf="!widget" class="float-left" i18n="lightning.top-100-oldest-nodes">
<span>Top 100 nodes by capacity</span> <span>Top 100 oldest lightning nodes</span>
</h1> </h1>
<div [class]="widget ? 'widget' : 'full'"> <div [class]="widget ? 'widget' : 'full'">
@ -8,7 +8,7 @@
<thead> <thead>
<th class="rank"></th> <th class="rank"></th>
<th class="alias text-left" i18n="nodes.alias">Alias</th> <th class="alias text-left" i18n="nodes.alias">Alias</th>
<th class="timestamp-first text-left" i18n="lightning.first_seen">First seen</th> <th class="timestamp-first text-right" i18n="lightning.first_seen">First seen</th>
<th *ngIf="!widget" class="capacity text-right" i18n="node.capacity">Capacity</th> <th *ngIf="!widget" class="capacity text-right" i18n="node.capacity">Capacity</th>
<th *ngIf="!widget" class="channels text-right" i18n="lightning.channels">Channels</th> <th *ngIf="!widget" class="channels text-right" i18n="lightning.channels">Channels</th>
<th *ngIf="!widget" class="timestamp-update text-left" i18n="lightning.last_update">Last update</th> <th *ngIf="!widget" class="timestamp-update text-left" i18n="lightning.last_update">Last update</th>
@ -22,7 +22,7 @@
<td class="alias text-left"> <td class="alias text-left">
<a [routerLink]="['/lightning/node' | relativeUrl, node.publicKey]">{{ node.alias }}</a> <a [routerLink]="['/lightning/node' | relativeUrl, node.publicKey]">{{ node.alias }}</a>
</td> </td>
<td class="timestamp-first text-left"> <td class="timestamp-first text-right">
&lrm;{{ node.firstSeen * 1000 | date: 'yyyy-MM-dd' }} &lrm;{{ node.firstSeen * 1000 | date: 'yyyy-MM-dd' }}
</td> </td>
<td *ngIf="!widget" class="capacity text-right"> <td *ngIf="!widget" class="capacity text-right">

View File

@ -45,9 +45,12 @@
.full .capacity { .full .capacity {
width: 10%; width: 10%;
@media (max-width: 767.98px) {
display: none;
}
} }
.widget .capacity { .widget .capacity {
width: 32%; width: 10%;
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
padding-left: 0px; padding-left: 0px;
padding-right: 0px; padding-right: 0px;
@ -63,14 +66,11 @@
} }
.full .timestamp-first { .full .timestamp-first {
width: 50%; width: 10%;
@media (max-width: 767.98px) {
display: none;
}
} }
.full .timestamp-update { .full .timestamp-update {
width: 15%; width: 20%;
@media (max-width: 767.98px) { @media (max-width: 767.98px) {
display: none; display: none;
} }

View File

@ -32,7 +32,7 @@
<div class="col"> <div class="col">
<div class="card"> <div class="card">
<div class="card-body"> <div class="card-body">
<a class="title-link" href="" [routerLink]="['/lightning/nodes/top-channels' | relativeUrl]"> <a class="title-link" href="" [routerLink]="['/lightning/nodes/oldest' | relativeUrl]">
<h5 class="card-title d-inline" i18n="lightning.top-channels-age">Oldest nodes</h5> <h5 class="card-title d-inline" i18n="lightning.top-channels-age">Oldest nodes</h5>
<span>&nbsp;</span> <span>&nbsp;</span>
<fa-icon [icon]="['fas', 'external-link-alt']" [fixedWidth]="true" <fa-icon [icon]="['fas', 'external-link-alt']" [fixedWidth]="true"