Merge branch 'master' into mononaut/fix-mobile-bottom-nav

This commit is contained in:
wiz
2023-01-27 03:49:07 +09:00
committed by GitHub
92 changed files with 37829 additions and 16586 deletions

View File

@@ -1,10 +1,9 @@
<div class="mb-2 box-top">
<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 }}
</a>
<app-clipboard [text]="channel.public_key"></app-clipboard>
<app-truncate [text]="channel.public_key" [lastChars]="6" [link]="['/lightning/node' | relativeUrl, channel.public_key]">
<app-clipboard [text]="channel.public_key"></app-clipboard>
</app-truncate>
</div>
<div class="box-right">
<div class="second-line"><ng-container *ngTemplateOutlet="xChannels; context: {$implicit: channel.channels }"></ng-container></div>

View File

@@ -2,7 +2,7 @@
display: flex;
flex-direction: row;
@media (max-width: 768px) {
@media (max-width: 767.98px) {
flex-direction: column;
}
}
@@ -10,16 +10,13 @@
.tx-link {
display: flex;
flex-grow: 1;
@media (min-width: 650px) {
@media (min-width: 768px) {
top: 1px;
position: relative;
align-self: end;
margin-left: 15px;
margin-top: 0px;
margin-bottom: -3px;
}
@media (min-width: 768px) {
margin-bottom: 4px;
top: 1px;
position: relative;
}
@media (max-width: 768px) {
order: 2;

View File

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

View File

@@ -56,7 +56,7 @@
<!-- Top nodes per capacity -->
<div class="col">
<div class="card" style="height: 409px">
<div class="card">
<div class="card-body">
<a class="title-link" href="" [routerLink]="['/lightning/nodes/rankings/liquidity' | relativeUrl]">
<h5 class="card-title d-inline" i18n="lightning.liquidity-ranking">Liquidity Ranking</h5>
@@ -70,7 +70,7 @@
<!-- Top nodes per channels -->
<div class="col">
<div class="card" style="height: 409px">
<div class="card">
<div class="card-body">
<a class="title-link" href="" [routerLink]="['/lightning/nodes/rankings/connectivity' | relativeUrl]">
<h5 class="card-title d-inline" i18n="lightning.connectivity-ranking">Connectivity Ranking</h5>

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>
<app-clipboard [text]="node.public_key"></app-clipboard>
<span class="node-id">
<app-truncate [text]="node.public_key" [lastChars]="8" [link]="['/lightning/node' | relativeUrl, node.public_key]">
<app-clipboard [text]="node.public_key"></app-clipboard>
</app-truncate>
</span>
</span>
</div>
@@ -215,7 +215,7 @@
</div>
<div *ngIf="hasDetails" class="text-right mt-3">
<button type="button" class="btn btn-outline-info btn-sm btn-details" (click)="toggleShowDetails()" i18n="node.details|Node Details">Details</button>
<button type="button" class="btn btn-outline-info btn-sm btn-details" (click)="toggleShowDetails()" i18n="transaction.details|Transaction Details">Details</button>
</div>
<div *ngIf="!error">

View File

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

View File

@@ -21,7 +21,7 @@
<div class="spinner-border text-light"></div>
</div>
<table class="table table-borderless text-center m-auto" style="max-width: 900px">
<table class="table table-borderless table-fixed text-center m-auto" style="max-width: 900px">
<thead>
<tr>
<th class="text-left rank" i18n="mining.rank">Rank</th>

View File

@@ -42,14 +42,14 @@
}
.rank {
width: 20%;
width: 8%;
@media (max-width: 576px) {
display: none
}
}
.name {
width: 20%;
width: 36%;
@media (max-width: 576px) {
width: 80%;
max-width: 150px;
@@ -59,21 +59,21 @@
}
.share {
width: 20%;
width: 15%;
@media (max-width: 576px) {
display: none
}
}
.nodes {
width: 20%;
width: 15%;
@media (max-width: 576px) {
width: 10%;
}
}
.capacity {
width: 20%;
width: 26%;
@media (max-width: 576px) {
width: 10%;
max-width: 100px;
@@ -91,3 +91,8 @@ a:hover .link {
.flag {
font-size: 20px;
}
.text-truncate .link {
overflow: hidden;
text-overflow: ellipsis;
}

View File

@@ -51,7 +51,7 @@
<app-toggle [textLeft]="'Sort by nodes'" [textRight]="'capacity'" [checked]="true" (toggleStatusChanged)="onGroupToggleStatusChanged($event)"></app-toggle>
</div>
<table class="table table-borderless text-center m-auto" style="max-width: 900px" *ngIf="!widget">
<table class="table table-borderless table-fixed text-center m-auto" style="max-width: 900px" *ngIf="!widget">
<thead>
<tr>
<th class="rank text-left pl-0" i18n="mining.rank">Rank</th>

View File

@@ -4,7 +4,7 @@
</h1>
<div [class]="widget ? 'widget' : 'full'">
<table class="table table-borderless">
<table class="table table-borderless table-fixed">
<thead>
<th class="rank"></th>
<th class="alias text-left" i18n="nodes.alias">Alias</th>
@@ -29,10 +29,10 @@
{{ node.channels | number }}
</td>
<td *ngIf="!widget" class="timestamp-first text-left">
<app-timestamp [customFormat]="'yyyy-MM-dd'" [unixTime]="node.firstSeen"></app-timestamp>
<app-timestamp [customFormat]="'yyyy-MM-dd'" [unixTime]="node.firstSeen" [hideTimeSince]="true"></app-timestamp>
</td>
<td *ngIf="!widget" class="timestamp-update text-left">
<app-timestamp [customFormat]="'yyyy-MM-dd'" [unixTime]="node.updatedAt"></app-timestamp>
<app-timestamp [customFormat]="'yyyy-MM-dd'" [unixTime]="node.updatedAt" [hideTimeSince]="true"></app-timestamp>
</td>
<td *ngIf="!widget" class="location text-right text-truncate">
<app-geolocation [data]="node.geolocation" [type]="'list-isp'"></app-geolocation>

View File

@@ -1,7 +1,7 @@
.container-xl {
max-width: 1400px;
padding-bottom: 100px;
@media (min-width: 767.98px) {
@media (min-width: 960px) {
padding-left: 50px;
padding-right: 50px;
}
@@ -15,40 +15,44 @@
width: 5%;
}
.widget .rank {
@media (min-width: 767.98px) {
@media (min-width: 960px) {
width: 13%;
}
@media (max-width: 767.98px) {
@media (max-width: 960px) {
padding-left: 0px;
padding-right: 0px;
}
}
.full .alias {
width: 10%;
width: 20%;
overflow: hidden;
text-overflow: ellipsis;
max-width: 350px;
@media (max-width: 767.98px) {
max-width: 175px;
@media (max-width: 960px) {
width: 40%;
max-width: 500px;
}
}
.widget .alias {
width: 55%;
width: 60%;
overflow: hidden;
text-overflow: ellipsis;
max-width: 350px;
@media (max-width: 767.98px) {
@media (max-width: 960px) {
max-width: 175px;
}
}
.full .capacity {
width: 10%;
@media (max-width: 960px) {
width: 30%;
}
}
.widget .capacity {
width: 32%;
@media (max-width: 767.98px) {
@media (max-width: 960px) {
padding-left: 0px;
padding-right: 0px;
}
@@ -57,28 +61,31 @@
.full .channels {
width: 15%;
padding-right: 50px;
@media (max-width: 767.98px) {
@media (max-width: 960px) {
display: none;
}
}
.full .timestamp-first {
width: 15%;
@media (max-width: 767.98px) {
width: 10%;
@media (max-width: 960px) {
display: none;
}
}
.full .timestamp-update {
width: 15%;
@media (max-width: 767.98px) {
width: 10%;
@media (max-width: 960px) {
display: none;
}
}
.full .location {
width: 10%;
@media (max-width: 767.98px) {
width: 15%;
@media (max-width: 960px) {
width: 30%;
}
@media (max-width: 600px) {
display: none;
}
}

View File

@@ -29,10 +29,10 @@
<app-amount [satoshis]="node.capacity" [digitsInfo]="'1.2-2'" [noFiat]="true"></app-amount>
</td>
<td *ngIf="!widget" class="timestamp-first text-left">
<app-timestamp [customFormat]="'yyyy-MM-dd'" [unixTime]="node.firstSeen"></app-timestamp>
<app-timestamp [customFormat]="'yyyy-MM-dd'" [unixTime]="node.firstSeen" [hideTimeSince]="true"></app-timestamp>
</td>
<td *ngIf="!widget" class="timestamp-update text-left">
<app-timestamp [customFormat]="'yyyy-MM-dd'" [unixTime]="node.updatedAt"></app-timestamp>
<app-timestamp [customFormat]="'yyyy-MM-dd'" [unixTime]="node.updatedAt" [hideTimeSince]="true"></app-timestamp>
</td>
<td *ngIf="!widget" class="location text-right text-truncate">
<app-geolocation [data]="node.geolocation" [type]="'list-isp'"></app-geolocation>

View File

@@ -1,7 +1,7 @@
.container-xl {
max-width: 1400px;
padding-bottom: 100px;
@media (min-width: 767.98px) {
@media (min-width: 960px) {
padding-left: 50px;
padding-right: 50px;
}
@@ -15,70 +15,77 @@
width: 5%;
}
.widget .rank {
@media (min-width: 767.98px) {
@media (min-width: 960px) {
width: 13%;
}
@media (max-width: 767.98px) {
@media (max-width: 960px) {
padding-left: 0px;
padding-right: 0px;
}
}
.full .alias {
width: 10%;
width: 20%;
overflow: hidden;
text-overflow: ellipsis;
max-width: 350px;
@media (max-width: 767.98px) {
max-width: 175px;
@media (max-width: 960px) {
width: 40%;
max-width: 500px;
}
}
.widget .alias {
width: 55%;
width: 60%;
overflow: hidden;
text-overflow: ellipsis;
max-width: 350px;
@media (max-width: 767.98px) {
@media (max-width: 960px) {
max-width: 175px;
}
}
.full .channels {
.full .capacity {
width: 10%;
@media (max-width: 960px) {
width: 30%;
}
}
.widget .channels {
.widget .capacity {
width: 32%;
@media (max-width: 767.98px) {
@media (max-width: 960px) {
padding-left: 0px;
padding-right: 0px;
}
}
.full .capacity {
.full .channels {
width: 15%;
padding-right: 50px;
@media (max-width: 767.98px) {
@media (max-width: 960px) {
display: none;
}
}
.full .timestamp-first {
width: 15%;
@media (max-width: 767.98px) {
width: 10%;
@media (max-width: 960px) {
display: none;
}
}
.full .timestamp-update {
width: 15%;
@media (max-width: 767.98px) {
width: 10%;
@media (max-width: 960px) {
display: none;
}
}
.full .location {
width: 10%;
@media (max-width: 767.98px) {
width: 15%;
@media (max-width: 960px) {
width: 30%;
}
@media (max-width: 600px) {
display: none;
}
}