remove 'on'/UI changes per feedback

backend/src/utils/bitcoin-script.ts

@@ -220,7 +220,8 @@ export function parseDATUMTemplateCreator(coinbaseRaw: string): string[] | null
 
   const tagStart = tagLengthByte + 1;
   const tags = bytes.slice(tagStart, tagStart + tagsLength);
-  const tagString = String.fromCharCode(...tags);
+  let tagString = String.fromCharCode(...tags);
+  tagString = tagString.replace('\x00', '');
 
   return tagString.split('\x0f');
 }

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

@@ -185,7 +185,6 @@
             <div class="on-pool-container" *ngIf="block.extras.pool.minerNames != undefined && block.extras.pool.minerNames.length > 1 && block.extras.pool.minerNames[1] != ''; else centralisedPool">
               {{ block.extras.pool.minerNames[1] }}
               <div class="on-pool">
-                <span class="on-pool-text">on</span>
                 <img class="pool-logo" [src]="'/resources/mining-pools/' + block.extras.pool.slug + '.svg'" onError="this.src = '/resources/mining-pools/default.svg'" [alt]="'Logo of ' + block.extras.pool.name + ' mining pool'">
                 {{ block.extras.pool.name }}
               </div>

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

@@ -94,12 +94,6 @@ h1 {
   border-radius: .25rem;
 }
 
-.on-pool-text {
-  font-weight: normal;
-  color: gray;
-  padding-inline-end: 4px;
-}
-
 .pool-logo {
   width: 25px;
   height: 25px;

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

@@ -61,18 +61,21 @@
         </div>
         <div class="animated" *ngIf="block.extras?.pool != undefined && showPools">
           <a [attr.data-cy]="'bitcoin-block-' + offset + '-index-' + i + '-pool'" class="badge" [routerLink]="[('/mining/pool/' + block.extras.pool.slug) | relativeUrl]">
-            <div class="on-pool-container" *ngIf="block.extras.pool.minerNames != undefined && block.extras.pool.minerNames.length > 1 && block.extras.pool.minerNames[1] != ''; else centralisedPool">
+            <div *ngIf="block.extras.pool.minerNames != undefined && block.extras.pool.minerNames.length > 1 && block.extras.pool.minerNames[1] != ''; else centralisedPool">
+              <div class="on-pool-container" *ngIf="block.height != markHeight; else selectedDecentralisedPool">
                 {{ block.extras.pool.minerNames[1] }}
                 <div class="on-pool">
-                <span class="on-pool-text">on</span>
                   <img class="pool-logo faded" [src]="'/resources/mining-pools/' + block.extras.pool.slug + '.svg'" onError="this.src = '/resources/mining-pools/default.svg'" [alt]="'Logo of ' + block.extras.pool.name + ' mining pool'">
                   <span class="on-pool-name-text">{{ block.extras.pool.name }}</span>
                 </div>
               </div>
-            <ng-template #centralisedPool>
+              <ng-template #selectedDecentralisedPool>
-              <div class="pool-container">
+                <img class="pool-logo faded" [src]="'/resources/mining-pools/' + block.extras.pool.slug + '.svg'" onError="this.src = '/resources/mining-pools/default.svg'" [alt]="'Logo of ' + block.extras.pool.name + ' mining pool'">
-                <img class="pool-logo" [src]="'/resources/mining-pools/' + block.extras.pool.slug + '.svg'" onError="this.src = '/resources/mining-pools/default.svg'" [alt]="'Logo of ' + block.extras.pool.name + ' mining pool'"> {{ block.extras.pool.name }}
+                {{ block.extras.pool.minerNames[1] }}
+              </ng-template>
             </div>
+            <ng-template #centralisedPool>
+              <img class="pool-logo" [src]="'/resources/mining-pools/' + block.extras.pool.slug + '.svg'" onError="this.src = '/resources/mining-pools/default.svg'" [alt]="'Logo of ' + block.extras.pool.name + ' mining pool'"> {{ block.extras.pool.name }}
             </ng-template>
           </a>
         </div>

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

@@ -19,12 +19,6 @@
   pointer-events: none;
 }
 
-.on-pool-text {
-  font-weight: normal;
-  color: gray;
-  padding-inline-end: 4px;
-}
-
 .on-pool-name-text {
   display: inline-block;
   padding-top: 2px;
@@ -42,10 +36,17 @@
 }
 
 .on-pool-container {
+  align-items: center;
+  position: relative;
+  top: -8px;
   display: flex;
   flex-direction: column;
 }
 
+.on-pool-container.selected {
+  top: 0px;
+}
+
 .pool-container {
   margin-top: 12px;
 }
@@ -156,7 +157,7 @@
 #arrow-up {
   position: relative;
   left: calc(var(--block-size) * 0.6);
-  top: calc(var(--block-size) * 1.38);
+  top: calc(var(--block-size) * 1.28);
   width: 0;
   height: 0;
   border-left: calc(var(--block-size) * 0.2) solid transparent;
@@ -186,7 +187,7 @@
 
 .badge {
   position: relative;
-  top: 8px;
+  top: 15px;
   z-index: 101;
   color: #FFF;
 }

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

@@ -14,7 +14,7 @@
 }
 
 .blockchain-wrapper {
-  height: 272px;
+  height: 260px;
   -webkit-user-select: none; /* Safari */
   -moz-user-select: none; /* Firefox */
   -ms-user-select: none; /* IE10+/Edge */

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

@@ -687,7 +687,6 @@
               <div class="on-pool-container" *ngIf="pool.minerNames != undefined && pool.minerNames.length > 1 && pool.minerNames[1] != ''; else centralisedPool">
                 {{ pool.minerNames[1] }}
                 <div class="on-pool">
-                  <span class="on-pool-text">on</span>
                   <img class="pool-logo" [src]="'/resources/mining-pools/' + pool.slug + '.svg'" onError="this.src = '/resources/mining-pools/default.svg'" [alt]="'Logo of ' + pool.name + ' mining pool'">
                   {{ pool.name }}
                 </div>

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

@@ -73,12 +73,6 @@
   border-radius: .25rem;
 }
 
-.on-pool-text {
-  font-weight: normal;
-  color: gray;
-  padding-inline-end: 4px;
-}
-
 .pool-logo {
   width: 25px;
   height: 25px;

frontend/src/app/dashboard/dashboard.component.scss

@@ -1,6 +1,6 @@
 .dashboard-container {
   text-align: center;
-  margin-top: 1.0rem;
+  margin-top: 0.5rem;
   .col {
     margin-bottom: 1.5rem;
   }