Merge pull request #4281 from mempool/nymkappa/fix-blockchain-width-liquid

[ui] don't add 120px to blockchain component on liquid

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

@@ -14,6 +14,7 @@
   <div id="blockchain-container" [dir]="timeLtr ? 'rtl' : 'ltr'" #blockchainContainer
     [class.menu-open]="menuOpen"
     [class.menu-closing]="menuSliding && !menuOpen"
+    [class.with-menu]="hasMenu"
     (mousedown)="onMouseDown($event)"
     (pointerdown)="onPointerDown($event)"
     (touchmove)="onTouchMove($event)"

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

@@ -6,7 +6,7 @@
   overflow-y: hidden;
   scrollbar-width: none;
   -ms-overflow-style: none;
-  width: calc(100% + 120px);
+  width: 100%;
 
   transform: translateX(0px);
   transition: transform 0;
@@ -20,6 +20,10 @@
     transform: translateX(0px);
     transition: transform 0.25s;
   }
+
+  &.with-menu {
+    width: calc(100% + 120px);
+  }
 }
 
 #blockchain-container::-webkit-scrollbar {

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

@@ -60,11 +60,16 @@ export class StartComponent implements OnInit, AfterViewChecked, OnDestroy {
   menuSliding: boolean = false;
   menuTimeout: number;
 
+  hasMenu = false;
+
   constructor(
     private stateService: StateService,
     private cd: ChangeDetectorRef,
   ) {
     this.isiOS = ['iPhone','iPod','iPad'].includes((navigator as any)?.userAgentData?.platform || navigator.platform);
+    if (this.stateService.network === '') {
+      this.hasMenu = true;
+    }
   }
 
   ngOnInit() {