Merge pull request #511 from knorrium/improve_scrolling_between_routes

Improve scrolling between routes

frontend/src/app/app-routing.module.ts

@@ -298,7 +298,9 @@ if (browserWindowEnv && browserWindowEnv.OFFICIAL_BISQ_MARKETS) {
 
 @NgModule({
   imports: [RouterModule.forRoot(routes, {
-    initialNavigation: 'enabled'
+    initialNavigation: 'enabled',
+    scrollPositionRestoration: 'enabled',
+    anchorScrolling: 'enabled'
 })],
   exports: [RouterModule]
 })

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

@@ -1,6 +1,6 @@
 <div class="container-xl">
 
-  <div class="title-block">
+  <div class="title-block" id="block">
     <h1><ng-template [ngIf]="blockHeight === 0" i18n="block.genesis">Genesis </ng-template><ng-template [ngIf]="blockHeight" i18n="block.block">Block <a [routerLink]="['/block/' | relativeUrl, blockHash]">{{ blockHeight }}</a></ng-template></h1>
     <button [routerLink]="['/' | relativeUrl]" class="btn btn-sm">&#10005;</button>
   </div>
@@ -80,7 +80,7 @@
       </div>
     </div>
 
-    <div [hidden]="!showDetails">
+    <div [hidden]="!showDetails" id="details">
       <br>
 
       <div class="box">

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

@@ -192,6 +192,7 @@ export class BlockComponent implements OnInit, OnDestroy {
         relativeTo: this.route,
         queryParams: { showDetails: false },
         queryParamsHandling: 'merge',
+        fragment: 'block'
       });
     } else {
       this.showDetails = true;
@@ -199,6 +200,7 @@ export class BlockComponent implements OnInit, OnDestroy {
         relativeTo: this.route,
         queryParams: { showDetails: true },
         queryParamsHandling: 'merge',
+        fragment: 'details'
       });
     }
   }