Merge branch 'master' into nymkappa/feature/show-tor-node-page

frontend/src/app/lightning/node/node-preview.component.html

@@ -1,15 +1,17 @@
 <div class="box preview-box" *ngIf="(node$ | async) as node">
+  <h2 class="preview-header" i18n="lightning.node">lightning node</h2>
   <div class="row d-flex justify-content-between full-width-row">
-    <h1 class="title">
-      <span i18n="lightning.node">Node</span>:
-      <a [routerLink]="['/lightning/node' | relativeUrl, node.id]"> {{ node.alias }}</a>
-    </h1>
+    <h1 class="title"></h1>
+    <div class="title-wrapper">
+      <h1 class="title">{{ node.alias }}</h1>
+    </div>
     <div class="badges mb-2">
       <span class="badge rounded-pill badge-success" *ngFor="let socketType of socketTypes">{{ socketType }}</span>
     </div>
   </div>
   <div class="row">
     <div class="col-md">
+      <a class="subtitle" [routerLink]="['/lightning/node' | relativeUrl, node.public_key]">{{ node.public_key }}</a>
       <table class="table table-borderless table-striped">
         <tbody>
           <tr>

frontend/src/app/lightning/node/node-preview.component.scss

@@ -1,15 +1,17 @@
-.title {
-  font-size: 52px;
-  margin-bottom: 0;
-}
-
 .table {
-  margin-top: 48px;
+  margin-top: 6px;
   font-size: 32px;
 }
 
 .badges {
   font-size: 28px;
+  flex-shrink: 0;
+  flex-grow: 0;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: baseline;
+  justify-content: flex-end;
 
   ::ng-deep .badge {
     margin-left: 0.5em;
@@ -20,14 +22,14 @@
   flex-grow: 0;
   flex-shrink: 0;
   width: 470px;
-  height: 390px;
+  height: 408px;
   min-width: 470px;
-  min-height: 390px;
-  max-height: 390px;
+  min-height: 408px;
+  max-height: 408px;
   padding: 0;
   background: #181b2d;
   overflow: hidden;
-  margin-top: 18px;
+  margin-top: 6px;
 }
 
 .row {
@@ -36,6 +38,7 @@
 
 .full-width-row {
   padding-left: 15px;
+  flex-wrap: nowrap;
 }
 
 ::ng-deep .symbol {

frontend/src/app/lightning/node/node.component.html

@@ -126,7 +126,7 @@
   </div>
 
   <div *ngIf="!error">
-    <div class="row" *ngIf="node.as_number">
+    <div class="row" *ngIf="node.as_number && node.active_channel_count">
       <div class="col-sm">
         <app-nodes-channels-map [style]="'nodepage'" [publicKey]="node.public_key" [hasLocation]="!!node.as_number"></app-nodes-channels-map>
       </div>
@@ -134,7 +134,7 @@
         <app-node-statistics-chart [publicKey]="node.public_key"></app-node-statistics-chart>
       </div>
     </div>
-    <div *ngIf="!node.as_number">
+    <div *ngIf="!node.as_number || !node.active_channel_count">
       <app-node-statistics-chart [publicKey]="node.public_key"></app-node-statistics-chart>
     </div>