Liquid dashboard updates. About page link.

frontend/src/app/components/blockchain/blockchain.component.html

@@ -1,5 +1,5 @@
 <div class="text-center" class="blockchain-wrapper">
-  <div class="position-container">
+  <div class="position-container {{ network }}">
     <span>
       <app-mempool-blocks [isLoading$]="isLoading$"></app-mempool-blocks>
       <app-blockchain-blocks [isLoading$]="isLoading$"></app-blockchain-blocks>

frontend/src/app/components/blockchain/blockchain.component.scss

@@ -26,10 +26,17 @@
   top: 75px;
 }
 
+.position-container.liquid {
+  left: 15%;
+}
+
 @media (max-width: 767.98px) {
   .position-container {
     left: 95%;
   }
+  .position-container.liquid {
+    left: 50%;
+  }
   .position-container.loading {
     left: 50%;
   }

frontend/src/app/components/blockchain/blockchain.component.ts

@@ -1,6 +1,6 @@
-import { Component, OnInit, OnDestroy, ChangeDetectionStrategy } from '@angular/core';
+import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
 import { StateService } from 'src/app/services/state.service';
-import { Subscription, Observable } from 'rxjs';
+import { Observable } from 'rxjs';
 
 @Component({
   selector: 'app-blockchain',
@@ -10,6 +10,7 @@ import { Subscription, Observable } from 'rxjs';
 })
 export class BlockchainComponent implements OnInit {
   isLoading$: Observable<boolean>;
+  network: string;
 
   constructor(
     private stateService: StateService,
@@ -17,5 +18,6 @@ export class BlockchainComponent implements OnInit {
 
   ngOnInit() {
     this.isLoading$ = this.stateService.isLoadingWebSocket$;
+    this.network = this.stateService.network;
   }
 }