diff --git a/src/app/core-ui/side-nav/side-nav.component.html b/src/app/core-ui/side-nav/side-nav.component.html
index c4e6c8d8e6..2556505321 100644
--- a/src/app/core-ui/side-nav/side-nav.component.html
+++ b/src/app/core-ui/side-nav/side-nav.component.html
@@ -3,13 +3,13 @@
           routerLink="work-view"
           routerLinkActive="isActiveRoute">
     <mat-icon>wb_sunny</mat-icon>
-        {{T.MH.TASKS|translate}}
+    {{T.MH.TASKS|translate}}
   </button>
   <button mat-menu-item
           routerLink="schedule"
           routerLinkActive="isActiveRoute">
     <mat-icon>access_alarms</mat-icon>
-        {{T.MH.SCHEDULED|translate}}
+    {{T.MH.SCHEDULED|translate}}
   </button>
   <button mat-menu-item
           routerLink="worklog-and-calendar"
@@ -61,3 +61,7 @@
     <span class="text">{{T.MH.SETTINGS|translate}}</span>
   </button>
 </section>
+
+
+<!-- NOTE: needs to be here for mat menu styles always to be loaded -->
+<mat-menu></mat-menu>
diff --git a/src/app/core-ui/side-nav/side-nav.component.ts b/src/app/core-ui/side-nav/side-nav.component.ts
index d105de73d2..3535f767b0 100644
--- a/src/app/core-ui/side-nav/side-nav.component.ts
+++ b/src/app/core-ui/side-nav/side-nav.component.ts
@@ -1,4 +1,4 @@
-import {ChangeDetectionStrategy, Component} from '@angular/core';
+import {ChangeDetectionStrategy, Component, ViewEncapsulation} from '@angular/core';
 import {ProjectService} from '../../features/project/project.service';
 import {T} from '../../t.const';
 import {DialogCreateProjectComponent} from '../../features/project/dialogs/create-project/dialog-create-project.component';
@@ -10,7 +10,7 @@ import {THEME_COLOR_MAP} from '../../app.constants';
   selector: 'side-nav',
   templateUrl: './side-nav.component.html',
   styleUrls: ['./side-nav.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class SideNavComponent {
   T = T;