diff --git a/frontend/src/app/components/start/start.component.html b/frontend/src/app/components/start/start.component.html
index c3277cb9a..621cd959d 100644
--- a/frontend/src/app/components/start/start.component.html
+++ b/frontend/src/app/components/start/start.component.html
@@ -8,12 +8,17 @@
0" class="warning-label">{{ eventName }} in {{ countdown | number }} block{{ countdown === 1 ? '' : 's' }}!
-
-
+
diff --git a/frontend/src/app/components/start/start.component.scss b/frontend/src/app/components/start/start.component.scss
index 9a55855b1..f23235035 100644
--- a/frontend/src/app/components/start/start.component.scss
+++ b/frontend/src/app/components/start/start.component.scss
@@ -12,6 +12,43 @@
display: none;
}
+.blockchain-wrapper {
+ position: relative;
+
+ .reset-scroll {
+ position: absolute;
+ top: 50%;
+ transform: translateY(-50%);
+ font-size: 50px;
+ z-index: 10;
+ cursor: pointer;
+ opacity: 0.8;
+ transition: opacity 500ms;
+ background: radial-gradient(#1d1f31 0%, transparent 50%);
+
+ &:hover {
+ opacity: 1;
+ transition: opacity 300ms;
+ }
+
+ &.hidden {
+ opacity: 0;
+ cursor: inherit;
+ pointer-events: none;
+ transition: opacity 500ms;
+ }
+ }
+
+ &.time-ltr .reset-scroll{
+ right: 10px;
+ transform: translateY(-50%) rotateZ(180deg);
+ }
+
+ &.time-rtl .reset-scroll {
+ left: 10px;
+ }
+}
+
.warning-label {
position: relative;
text-align: center;
diff --git a/frontend/src/app/components/start/start.component.ts b/frontend/src/app/components/start/start.component.ts
index 558e6f909..f61a780a5 100644
--- a/frontend/src/app/components/start/start.component.ts
+++ b/frontend/src/app/components/start/start.component.ts
@@ -250,6 +250,10 @@ export class StartComponent implements OnInit, OnDestroy {
};
}
+ resetScroll(): void {
+ this.scrollToBlock(this.chainTip);
+ }
+
getPageIndexOf(height: number): number {
const delta = this.chainTip - 8 - height;
return Math.max(0, Math.floor(delta / this.blocksPerPage) + 1);
diff --git a/frontend/src/app/shared/shared.module.ts b/frontend/src/app/shared/shared.module.ts
index 458eb2c8c..d82f03493 100644
--- a/frontend/src/app/shared/shared.module.ts
+++ b/frontend/src/app/shared/shared.module.ts
@@ -4,7 +4,7 @@ import { NgbCollapseModule, NgbTypeaheadModule } from '@ng-bootstrap/ng-bootstra
import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome';
import { faFilter, faAngleDown, faAngleUp, faAngleRight, faAngleLeft, faBolt, faChartArea, faCogs, faCubes, faHammer, faDatabase, faExchangeAlt, faInfoCircle,
faLink, faList, faSearch, faCaretUp, faCaretDown, faTachometerAlt, faThList, faTint, faTv, faAngleDoubleDown, faSortUp, faAngleDoubleUp, faChevronDown,
- faFileAlt, faRedoAlt, faArrowAltCircleRight, faExternalLinkAlt, faBook, faListUl, faDownload, faQrcode, faArrowRightArrowLeft, faArrowsRotate } from '@fortawesome/free-solid-svg-icons';
+ faFileAlt, faRedoAlt, faArrowAltCircleRight, faExternalLinkAlt, faBook, faListUl, faDownload, faQrcode, faArrowRightArrowLeft, faArrowsRotate, faCircleLeft } from '@fortawesome/free-solid-svg-icons';
import { InfiniteScrollModule } from 'ngx-infinite-scroll';
import { MasterPageComponent } from '../components/master-page/master-page.component';
import { PreviewTitleComponent } from '../components/master-page-preview/preview-title.component';
@@ -290,6 +290,7 @@ export class SharedModule {
library.addIcons(faRedoAlt);
library.addIcons(faArrowAltCircleRight);
library.addIcons(faArrowsRotate);
+ library.addIcons(faCircleLeft);
library.addIcons(faExternalLinkAlt);
library.addIcons(faSortUp);
library.addIcons(faCaretUp);