Update block, address & tx preview layouts

frontend/src/app/components/transaction/transaction-preview.component.html

@@ -1,10 +1,9 @@
 <div class="box preview-box" *ngIf="tx && !error">
-
-  <div class="page-title">
-    <h1 i18n="shared.transaction">Transaction</h1>
-    <a class="tx-link" [routerLink]="['/tx/' | relativeUrl, txId]">
-      <span class="truncated">{{txId.slice(0,-4)}}</span><span class="last-four">{{txId.slice(-4)}}</span>
-    </a>
+  <h2 class="preview-header" i18n="shared.transaction">Transaction</h2>
+  <div class="row d-flex justify-content-between full-width-row">
+    <div class="title-wrapper">
+      <h1 class="title truncated"><span class="first">{{txId.slice(0,-4)}}</span><span class="last-four">{{txId.slice(-4)}}</span></h1>
+    </div>
     <div *ngIf="network !== 'liquid' && network !== 'liquidtestnet'" class="features">
       <app-tx-features [tx]="tx"></app-tx-features>
       <span *ngIf="cpfpInfo && cpfpInfo.bestDescendant" class="badge badge-primary mr-1">
@@ -15,7 +14,6 @@
       </span>
     </div>
   </div>
-
   <div class="top-data row">
     <span class="field col-sm-4 text-left">
       <ng-template [ngIf]="isLiquid && haveBlindedOutputValues(tx)" [ngIfElse]="defaultAmount" i18n="shared.confidential">Confidential</ng-template>

frontend/src/app/components/transaction/transaction-preview.component.scss

@@ -26,56 +26,9 @@
 	margin-top: 0px;
 }
 
-.page-title {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: baseline;
-  margin-bottom: 2px;
-  max-width: 100%;
-
-  h1 {
-    font-size: 52px;
-    margin: 0;
-    line-height: 1;
-  }
-
-  .features {
-    font-size: 24px;
-  }
-
-  & > * {
-    flex-grow: 0;
-    flex-shrink: 0;
-  }
-
-  .tx-link {
-    flex-grow: 1;
-    flex-shrink: 1;
-    margin: 0 1em;
-    overflow: hidden;
-    white-space: nowrap;
-    display: flex;
-    flex-direction: row;
-    align-items: baseline;
-
-    .truncated {
-      flex-grow: 1;
-      flex-shrink: 1;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      margin-right: -2px;
-    }
-
-    .last-four {
-      flex-shrink: 0;
-      flex-grow: 0;
-    }
-  }
-
-  .features {
-    align-self: center;
-  }
+.features {
+  font-size: 24px;
+  margin-left: 1em;
 }
 
 .top-data {