CSS updates.

frontend/src/app/blockchain-blocks/blockchain-blocks.component.html

@@ -1,26 +1,20 @@
 <div class="blocks-container" *ngIf="blocks.length">
-  
   <div *ngFor="let block of blocks; let i = index; trackBy: trackByBlocksFn" >
     <div (click)="openBlockModal(block);" class="text-center bitcoin-block mined-block" id="bitcoin-block-{{ block.height }}" [ngStyle]="getStyleForBlock(block)">
-      
       <div class="block-height">
         <a href="https://www.blockstream.info/block-height/{{ block.height }}" target="_blank">#{{ block.height }}</a>
       </div>
-
       <div class="block-body">
         <div class="fees">
           ~{{ block.medianFee | ceil }} sat/vB
           <br/>
           <span class="yellow-color">{{ block.minFee | ceil }} - {{ block.maxFee | ceil }} sat/vB</span>
         </div>
-
         <div class="block-size">{{ block.size | bytes: 2 }}</div>
         <div class="transaction-count">{{ block.nTx }} transactions</div>
         <br /><br />
         <div class="time-difference">{{ getTimeSinceMined(block) }} ago</div>
       </div>
-
     </div>
   </div>
-
-</div>
+</div>

frontend/src/app/blockchain-blocks/blockchain-blocks.component.scss

@@ -21,21 +21,10 @@
   left: 40px;
 }
 
-.projected-block {
-  position: absolute;
-  top: 0;
-}
-
 .block-body {
   text-align: center;
 }
 
-@keyframes opacityPulse {
-  0% {opacity: 0.7;}
-  50% {opacity: 1.0;}
-  100% {opacity: 0.7;}
-}
-
 .time-difference {
   position: absolute;
   bottom: 10px;
@@ -50,15 +39,6 @@
   margin-bottom: 2px;
 }
 
-.btcblockmiddle {
-  height: 18px;
-}
-
-.breakRow {
-  height: 30px;
-  margin-top: 20px;
-}
-
 .yellow-color { 
   color: #ffd800;
 }
@@ -111,14 +91,6 @@
     transform: skewY(50deg);
     transform-origin: top;     
   }
-
-  .projected-block.bitcoin-block::after {
-    background-color: #403834; 
-  }
-
-  .projected-block.bitcoin-block::before {
-    background-color: #2d2825; 
-  }
 }
 
 .black-background {

frontend/src/app/blockchain-projected-blocks/blockchain-projected-blocks.component.scss

@@ -55,15 +55,6 @@
   margin-bottom: 2px;
 }
 
-.btcblockmiddle {
-  height: 18px;
-}
-
-.breakRow {
-  height: 30px;
-  margin-top: 20px;
-}
-
 .yellow-color { 
   color: #ffd800;
 }
@@ -78,12 +69,6 @@
     left: -165px;
     top: -40px;
   }
-  .block-height {
-    bottom: 125px;
-    left: inherit;
-    text-shadow: inherit;
-    z-index: inherit;
-  }
 }
 
 @media (min-width: 768px) {

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

@@ -1,14 +1,3 @@
-.projected-block {
-  position: absolute;
-  top: 0;
-}
-
-@keyframes opacityPulse {
-  0% {opacity: 0.7;}
-  50% {opacity: 1.0;}
-  100% {opacity: 0.7;}
-}
-
 #divider {
   width: 3px;
   height: 3000px;

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

@@ -4,9 +4,6 @@ import { retryWhen, tap } from 'rxjs/operators';
 import { MemPoolService } from '../services/mem-pool.service';
 import { ApiService } from '../services/api.service';
 import { ActivatedRoute, ParamMap } from '@angular/router';
-import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
-import { BlockModalComponent } from '../blockchain-blocks/block-modal/block-modal.component';
-import { ProjectedBlockModalComponent } from '../blockchain-projected-blocks/projected-block-modal/projected-block-modal.component';
 
 @Component({
   selector: 'app-blockchain',