diff --git a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html index c8b4cdf29..a60e1db0a 100644 --- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html +++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html @@ -60,12 +60,11 @@
- + {{ block.extras.pool.name}}
-
@@ -86,6 +85,8 @@ +
diff --git a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.scss b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.scss index 40a13aa67..b8de4f2ca 100644 --- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.scss +++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.scss @@ -123,20 +123,14 @@ } #arrow-up { - position: absolute; - left: calc(var(--block-size) * 0.3); - top: calc(var(--block-size) * 1); + position: relative; + left: calc(var(--block-size) * 0.6); + top: calc(var(--block-size) * 1.28); width: 0; height: 0; border-left: calc(var(--block-size) * 0.2) solid transparent; border-right: calc(var(--block-size) * 0.2) solid transparent; border-bottom: calc(var(--block-size) * 0.2) solid var(--fg); - opacity: 0; - transition: opacity 500ms; - - &.arrow-visible { - opacity: 1; - } } .flashing { @@ -164,14 +158,6 @@ top: 15px; z-index: 101; color: #FFF; - - &.animate { - transition: transform 500ms; - } - - &.selectedBlock { - transform: translateY(20px); - } } .pool-logo { diff --git a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts index 71504050c..1a7598079 100644 --- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts +++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts @@ -5,7 +5,6 @@ import { specialBlocks } from '../../app.constants'; import { BlockExtended } from '../../interfaces/node-api.interface'; import { Location } from '@angular/common'; import { CacheService } from '../../services/cache.service'; -import { nextTick } from 'process'; interface BlockchainBlock extends BlockExtended { placeholder?: boolean; @@ -59,7 +58,6 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy { arrowLeftPx = 30; blocksFilled = false; arrowTransition = '1s'; - animatePoolTag = false; timeLtrSubscription: Subscription; timeLtr: boolean; @@ -188,9 +186,6 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy { .subscribe((state) => { this.markHeight = undefined; if (state.blockHeight !== undefined) { - nextTick(() => { - this.animatePoolTag = true; - }); this.markHeight = state.blockHeight; } this.moveArrowToPosition(false); diff --git a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.html b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.html index 65f531a22..24f229598 100644 --- a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.html +++ b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.html @@ -51,7 +51,7 @@ -
+
diff --git a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.scss b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.scss index 2bf150739..2e829b21e 100644 --- a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.scss +++ b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.scss @@ -114,12 +114,12 @@ #arrow-up { position: relative; right: calc(var(--block-size) * 0.6); - top: calc(var(--block-size) * 1); + top: calc(var(--block-size) * 1.20); width: 0; height: 0; - border-left: calc(var(--block-size) * 0.2) solid transparent; - border-right: calc(var(--block-size) * 0.2) solid transparent; - border-bottom: calc(var(--block-size) * 0.2) solid var(--fg); + border-left: calc(var(--block-size) * 0.3) solid transparent; + border-right: calc(var(--block-size) * 0.3) solid transparent; + border-bottom: calc(var(--block-size) * 0.3) solid var(--fg); } .blockLink {