From 225d82425b3074bca4c51b660520d6518146b3c9 Mon Sep 17 00:00:00 2001
From: Chris Witterholt <witterholt@gmail.com>
Date: Sun, 16 Jun 2024 04:28:56 +0000
Subject: [PATCH] Add new OpenLP dark theme based on Angular Material v3

---
 package.json                                  |  34 +-
 src/app/app.component.html                    | 634 +++++++++---------
 src/app/app.component.scss                    |  40 +-
 src/app/app.component.ts                      |  10 +-
 .../service-item/service-item.component.scss  |   5 -
 .../settings/settings.component.html          |  76 ++-
 .../settings/settings.component.scss          |   1 +
 .../slide-item/slide-item.component.html      |   2 +-
 .../slide-item/slide-item.component.scss      |   5 -
 .../components/themes/themes.component.scss   |  29 +-
 src/app/responses.ts                          |   3 +-
 src/app/settings.service.ts                   |   1 +
 src/assets/en.json                            |   1 +
 src/assets/i18n/af.json                       |   1 +
 src/assets/i18n/bg.json                       |   1 +
 src/assets/i18n/cs.json                       |   1 +
 src/assets/i18n/da.json                       |   1 +
 src/assets/i18n/de.json                       |   1 +
 src/assets/i18n/el.json                       |   1 +
 src/assets/i18n/en.json                       |   1 +
 src/assets/i18n/en_GB.json                    |   1 +
 src/assets/i18n/en_ZA.json                    |   1 +
 src/assets/i18n/es.json                       |   1 +
 src/assets/i18n/es_CL.json                    |   1 +
 src/assets/i18n/et.json                       |   1 +
 src/assets/i18n/fi.json                       |   1 +
 src/assets/i18n/fr.json                       |   1 +
 src/assets/i18n/hu.json                       |   1 +
 src/assets/i18n/id.json                       |   1 +
 src/assets/i18n/it.json                       |   1 +
 src/assets/i18n/it_CH.json                    |   1 +
 src/assets/i18n/it_IT.json                    |   1 +
 src/assets/i18n/ja.json                       |   1 +
 src/assets/i18n/ko.json                       |   1 +
 src/assets/i18n/lt.json                       |   1 +
 src/assets/i18n/nb.json                       |   1 +
 src/assets/i18n/nl.json                       |   1 +
 src/assets/i18n/pl.json                       |   1 +
 src/assets/i18n/pt_BR.json                    |   1 +
 src/assets/i18n/ro.json                       |   1 +
 src/assets/i18n/ru.json                       |   1 +
 src/assets/i18n/sk.json                       |   1 +
 src/assets/i18n/sl.json                       |   1 +
 src/assets/i18n/sv.json                       |   1 +
 src/assets/i18n/ta_LK.json                    |   1 +
 src/assets/i18n/th_TH.json                    |   1 +
 src/assets/i18n/vi_VN.json                    |   1 +
 src/assets/i18n/zh_CN.json                    |   1 +
 src/assets/i18n/zh_TW.json                    |   1 +
 src/assets/themes/_fast-switcher-theme.scss   |  13 +
 src/assets/themes/_slide-item-theme.scss      |  14 +
 src/assets/themes/openlp-dark-theme.scss      | 144 ++++
 src/styles.scss                               |  45 +-
 yarn.lock                                     | 545 +++++++--------
 54 files changed, 909 insertions(+), 729 deletions(-)
 create mode 100644 src/assets/themes/_fast-switcher-theme.scss
 create mode 100644 src/assets/themes/_slide-item-theme.scss
 create mode 100644 src/assets/themes/openlp-dark-theme.scss

diff --git a/package.json b/package.json
index 18fbef5..2635c4a 100644
--- a/package.json
+++ b/package.json
@@ -25,16 +25,16 @@
     "tx": "node scripts/tx.js"
   },
   "dependencies": {
-    "@angular/animations": "^18.0.2",
-    "@angular/cdk": "^18.0.2",
-    "@angular/common": "^18.0.2",
-    "@angular/compiler": "^18.0.2",
-    "@angular/core": "^18.0.2",
-    "@angular/forms": "^18.0.2",
-    "@angular/material": "^18.0.2",
-    "@angular/platform-browser": "^18.0.2",
-    "@angular/platform-browser-dynamic": "^18.0.2",
-    "@angular/router": "^18.0.2",
+    "@angular/animations": "^18.0.3",
+    "@angular/cdk": "^18.0.3",
+    "@angular/common": "^18.0.3",
+    "@angular/compiler": "^18.0.3",
+    "@angular/core": "^18.0.3",
+    "@angular/forms": "^18.0.3",
+    "@angular/material": "^18.0.3",
+    "@angular/platform-browser": "^18.0.3",
+    "@angular/platform-browser-dynamic": "^18.0.3",
+    "@angular/router": "^18.0.3",
     "@fontsource/roboto": "^5.0.13",
     "@ngx-translate/core": "^15.0.0",
     "@ngx-translate/http-loader": "^8.0.0",
@@ -44,17 +44,17 @@
     "zone.js": "^0.14.7"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^18.0.3",
-    "@angular-devkit/core": "^18.0.3",
-    "@angular-devkit/schematics": "^18.0.3",
+    "@angular-devkit/build-angular": "^18.0.4",
+    "@angular-devkit/core": "^18.0.4",
+    "@angular-devkit/schematics": "^18.0.4",
     "@angular-eslint/builder": "^18.0.1",
     "@angular-eslint/eslint-plugin": "^18.0.1",
     "@angular-eslint/eslint-plugin-template": "^18.0.1",
     "@angular-eslint/schematics": "^18.0.1",
     "@angular-eslint/template-parser": "^18.0.1",
-    "@angular/cli": "~18.0.3",
-    "@angular/compiler-cli": "^18.0.2",
-    "@angular/language-service": "^18.0.2",
+    "@angular/cli": "~18.0.4",
+    "@angular/compiler-cli": "^18.0.3",
+    "@angular/language-service": "^18.0.3",
     "@chiragrupani/karma-chromium-edge-launcher": "^2.4.1",
     "@transifex/api": "^7.1.1",
     "@types/jasmine": "~5.1.4",
@@ -69,7 +69,7 @@
     "browserslist-useragent-regexp": "^4.1.3",
     "eslint": "^8.57.0",
     "eslint-plugin-import": "~2.29.1",
-    "eslint-plugin-jsdoc": "~48.2.9",
+    "eslint-plugin-jsdoc": "~48.2.12",
     "eslint-plugin-prefer-arrow": "~1.2.3",
     "jasmine-core": "~5.1.2",
     "jasmine-spec-reporter": "~7.0.0",
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 92162fe..d514f79 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,317 +1,321 @@
-<mat-toolbar class="header">
-  <mat-toolbar-row>
-    <button mat-icon-button class="header" (click)="menu.toggle()">
-      <mat-icon>menu</mat-icon>
-    </button>
-    <span class="page-title">{{ pageTitle | translate | titlecase }}</span>
-    <span class="spacer"></span>
-    @if (showLogin) {
-      <button 
-        mat-raised-button
-        (click)="login()">
-        {{ 'LOGIN' | translate | titlecase }}
+<div [ngClass]="{'dark-theme': darkTheme, 'light-theme': !darkTheme}">
+  <mat-toolbar class="header">
+    <mat-toolbar-row>
+      <button mat-icon-button class="header" (click)="menu.toggle()">
+        <mat-icon>menu</mat-icon>
       </button>
-    }
-    @if (webSocketOpen) {
-      <button
-        mat-icon-button
-        (click)="forceWebSocketReconnection()"
-        class="header connection-status"
-        matTooltip="{{ ('CONNECTED_TO_OPENLP' | translate | titlecase).replace('Openlp', 'OpenLP') }}">
-        <mat-icon>link</mat-icon>
-      </button>
-    }
-    @else {
-      <button
-        mat-icon-button
-        (click)="forceWebSocketReconnection()"
-        class="header connection-status"
-        matTooltip="{{ 'DISCONNECTED' | translate | titlecase }}">
-        <mat-icon>link_off</mat-icon>
-      </button>
-    }
-    <span class="app-version">v{{appVersion}}</span>
-  </mat-toolbar-row>
-</mat-toolbar>
-<mat-sidenav-container>
-  <mat-sidenav #menu mode="over">
-    <mat-nav-list>
-      <a mat-list-item
-        (click)="menu.close()"
-        routerLink="/service"
-        routerLinkActive #serviceRoute="routerLinkActive"
-        [activated]="serviceRoute.isActive">
-        <mat-icon>list</mat-icon>  {{ 'SERVICE' | translate | titlecase }}
-      </a>
-      <a mat-list-item
-        (click)="menu.close()"
-        routerLink="/slides"
-        routerLinkActive #slidesRoute="routerLinkActive"
-        [activated]="slidesRoute.isActive">
-        <mat-icon>collections</mat-icon>  {{ 'SLIDES' | translate | titlecase }}
-      </a>
-      <a mat-list-item
-        (click)="menu.close()"
-        routerLink="/alerts"
-        routerLinkActive #alertsRoute="routerLinkActive"
-        [activated]="alertsRoute.isActive">
-        <mat-icon>error</mat-icon>  {{ 'ALERTS' | translate | titlecase }}
-      </a>
-      <a mat-list-item
-        (click)="menu.close()"
-        routerLink="/search"
-        routerLinkActive #searchRoute="routerLinkActive"
-        [activated]="searchRoute.isActive">
-        <mat-icon>search</mat-icon>  {{ 'SEARCH' | translate | titlecase }}
-      </a>
-      <a mat-list-item
-        (click)="menu.close()"
-        routerLink="/themes"
-        routerLinkActive #themesRoute="routerLinkActive"
-        [activated]="themesRoute.isActive">
-        <mat-icon>image</mat-icon>  {{ 'THEMES' | translate | titlecase }}
-      </a>
-      <mat-divider></mat-divider>
-      <a mat-list-item
-        (click)="menu.close()"
-        routerLink="/main">
-        {{ 'MAIN_VIEW' | translate | titlecase }}
-      </a>
-      <a mat-list-item
-        (click)="menu.close()"
-        routerLink="/stage">
-        {{ 'STAGE_VIEW' | translate | titlecase }}
-      </a>
-      <a mat-list-item
-        (click)="menu.close()"
-        routerLink="/chords">
-        {{ 'CHORD_VIEW' | translate | titlecase }}
-      </a>
-      <mat-divider></mat-divider>
-      <a mat-list-item (click)="menu.close()"
-        routerLink="/settings"
-        routerLinkActive #settingsRoute="routerLinkActive"
-        [activated]="settingsRoute.isActive">
-        <mat-icon>settings</mat-icon>  {{ 'SETTINGS' | translate | titlecase }}
-      </a>
-    </mat-nav-list>
-  </mat-sidenav>
-  <mat-sidenav-content>
-    <main class="content">
-      <mat-tab-nav-panel #tabPanel>
-        <router-outlet></router-outlet>
-      </mat-tab-nav-panel>
-    </main>
-    <!-- These two toolbars are for padding the content so the real toolbars do not block content when scrolled down -->
-    <mat-toolbar class="toolbar-padding"></mat-toolbar>
-    @if (fastSwitching) {
-      <mat-toolbar class="toolbar-padding"></mat-toolbar>
-    }
-    <footer>
-      <mat-toolbar class="footer">
-        @if (bigDisplayButtons) {
-          <button
-            mat-fab color="primary"
-            (click)="previousItem()"
-            matTooltip="{{ 'PREVIOUS_ITEM' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>first_page</mat-icon>
-          </button>
-          <button
-            mat-fab color="primary"
-            (click)="nextItem()"
-            matTooltip="{{ 'NEXT_ITEM' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>last_page</mat-icon>
-          </button>
-          <button
-            mat-fab color="primary"
-            (click)="previousSlide()"
-            matTooltip="{{ 'PREVIOUS_SLIDE' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>navigate_before</mat-icon>
-          </button>
-          <button
-            mat-fab color="primary"
-            (click)="nextSlide()"
-            matTooltip="{{ 'NEXT_SLIDE' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>navigate_next</mat-icon>
-          </button>
-          <button
-            mat-fab color="primary"
-            #squashedDisplayButton
-            (click)="openDisplayModeSelector()"
-            class="squashed-display-button"
-            matTooltip="{{ 'CHANGE_DISPLAY_MODE' | translate | titlecase }}"
-            matTooltipPosition="above">
-            @if (state.blank) {
-              <mat-icon>videocam_off</mat-icon>
-            }
-            @else if (state.theme) {
-              <mat-icon>wallpaper</mat-icon>
-            }
-            @else if (state.display) {
-              <mat-icon>desktop_windows</mat-icon>
-            }
-            @else if (state.live()) {
-              <mat-icon>videocam</mat-icon>
-            }
-          </button>
-          <button
-            mat-fab color="primary"
-            (click)="blankDisplay()"
-            class="displayButton"
-            [class.active]="state.blank"
-            [disabled]="state.blank"
-            matTooltip="{{ 'SHOW_BLACK' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>videocam_off</mat-icon>
-          </button>
-          <button
-            mat-fab color="primary"
-            (click)="themeDisplay()"
-            class="displayButton"
-            [class.active]="state.theme"
-            [disabled]="state.theme"
-            matTooltip="{{ 'SHOW_BACKGROUND' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>wallpaper</mat-icon>
-          </button>
-          <button
-            mat-fab color="primary"
-            (click)="desktopDisplay()"
-            class="displayButton"
-            [class.active]="state.display"
-            [disabled]="state.display"
-            matTooltip="{{ 'SHOW_DESKTOP' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>desktop_windows</mat-icon>
-          </button>
-          <button
-            mat-fab color="primary"
-            (click)="showDisplay()"
-            class="displayButton"
-            [class.active]="state.display"
-            [disabled]="state.live()"
-            matTooltip="{{ 'SHOW_PRESENTATION' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>videocam</mat-icon>
-          </button>
-        }
-        @else {
-          <button
-            mat-icon-button
-            (click)="previousItem()"
-            matTooltip="{{ 'PREVIOUS_ITEM' | translate | titlecase }}"
-            matTooltipPosition="above"> 
-            <mat-icon>first_page</mat-icon>
-          </button>
-          <button
-            mat-icon-button
-            (click)="nextItem()"
-            matTooltip="{{ 'NEXT_ITEM' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>last_page</mat-icon>
-          </button>
-          <button
-            mat-icon-button (click)="previousSlide()"
-            matTooltip="{{ 'PREVIOUS_SLIDE' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>navigate_before</mat-icon>
-          </button>
-          <button
-            mat-icon-button (click)="nextSlide()"
-            matTooltip="{{ 'NEXT_SLIDE' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>navigate_next</mat-icon>
-          </button>
-          <button
-            mat-icon-button
-            #squashedDisplayButton
-            (click)="openDisplayModeSelector()"
-            class="squashed-display-button"
-            matTooltip="{{ 'CHANGE_DISPLAY_MODE' | translate | titlecase }}"
-            matTooltipPosition="above">
-            @if (state.blank) {
-              <mat-icon>videocam_off</mat-icon>
-            }
-            @else if (state.theme) {
-              <mat-icon>wallpaper</mat-icon>
-            }
-            @else if (state.display) {
-              <mat-icon>desktop_windows</mat-icon>
-            }
-            @else if (state.live()) {
-              <mat-icon>videocam</mat-icon>
-            }
-          </button>
-          <button
-            mat-icon-button (click)="blankDisplay()"
-            class="displayButton"
-            [class.active]="state.blank"
-            [disabled]="state.blank"
-            matTooltip="{{ 'SHOW_BLACK' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>videocam_off</mat-icon>
-          </button>
-          <button
-            mat-icon-button
-            (click)="themeDisplay()"
-            class="displayButton"
-            [class.active]="state.theme"
-            [disabled]="state.theme"
-            matTooltip="{{ 'SHOW_BACKGROUND' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>wallpaper</mat-icon>
-          </button>
-          <button
-            mat-icon-button (click)="desktopDisplay()"
-            class="displayButton"
-            [class.active]="state.display"
-            [disabled]="state.display"
-            matTooltip="{{ 'SHOW_DESKTOP' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>desktop_windows</mat-icon>
-          </button>
-          <button
-            mat-icon-button (click)="showDisplay()"
-            class="displayButton"
-            [class.active]="state.display"
-            [disabled]="state.live()"
-            matTooltip="{{ 'SHOW_PRESENTATION' | translate | titlecase }}"
-            matTooltipPosition="above">
-            <mat-icon>videocam</mat-icon>
-          </button>
-        }
-      </mat-toolbar>
-      @if (fastSwitching) {
-        <nav
-          mat-tab-nav-bar mat-stretch-tabs
-          class="fast-switcher"
-          [tabPanel]="tabPanel">
-          <a mat-tab-link
-            routerLink="/service"
-            routerLinkActive #serviceRoute="routerLinkActive"
-            [active]="serviceRoute.isActive"><mat-icon>list</mat-icon></a>
-          <a mat-tab-link
-            routerLink="/slides"
-            routerLinkActive #slidesRoute="routerLinkActive"
-            [active]="slidesRoute.isActive"><mat-icon>collections</mat-icon></a>
-          <a mat-tab-link
-            routerLink="/alerts"
-            routerLinkActive #alertsRoute="routerLinkActive"
-            [active]="alertsRoute.isActive"><mat-icon>error</mat-icon></a>
-          <a mat-tab-link
-            routerLink="/search"
-            routerLinkActive #searchRoute="routerLinkActive"
-            [active]="searchRoute.isActive"><mat-icon>search</mat-icon></a>
-          <a mat-tab-link
-            routerLink="/themes"
-            routerLinkActive #themesRoute="routerLinkActive"
-            [active]="themesRoute.isActive"><mat-icon>image</mat-icon></a>
-        </nav>
+      <span class="page-title">{{ pageTitle | translate | titlecase }}</span>
+      <span class="spacer"></span>
+      @if (showLogin) {
+        <button 
+          mat-raised-button
+          (click)="login()">
+          {{ 'LOGIN' | translate | titlecase }}
+        </button>
       }
-    </footer>
-  </mat-sidenav-content>
-</mat-sidenav-container>
+      @if (webSocketOpen) {
+        <button
+          mat-icon-button
+          (click)="forceWebSocketReconnection()"
+          class="header connection-status"
+          matTooltip="{{ ('CONNECTED_TO_OPENLP' | translate | titlecase).replace('Openlp', 'OpenLP') }}">
+          <mat-icon>link</mat-icon>
+        </button>
+      }
+      @else {
+        <button
+          mat-icon-button
+          (click)="forceWebSocketReconnection()"
+          class="header connection-status"
+          matTooltip="{{ 'DISCONNECTED' | translate | titlecase }}">
+          <mat-icon>link_off</mat-icon>
+        </button>
+      }
+      <span class="app-version">v{{appVersion}}</span>
+    </mat-toolbar-row>
+  </mat-toolbar>
+  <mat-sidenav-container>
+    <mat-sidenav #menu
+      mode="over"
+      autoFocus="false">
+      <mat-nav-list>
+        <a mat-list-item
+          (click)="menu.close()"
+          routerLink="/service"
+          routerLinkActive #serviceRoute="routerLinkActive"
+          [activated]="serviceRoute.isActive">
+          <mat-icon>list</mat-icon>  {{ 'SERVICE' | translate | titlecase }}
+        </a>
+        <a mat-list-item
+          (click)="menu.close()"
+          routerLink="/slides"
+          routerLinkActive #slidesRoute="routerLinkActive"
+          [activated]="slidesRoute.isActive">
+          <mat-icon>collections</mat-icon>  {{ 'SLIDES' | translate | titlecase }}
+        </a>
+        <a mat-list-item
+          (click)="menu.close()"
+          routerLink="/alerts"
+          routerLinkActive #alertsRoute="routerLinkActive"
+          [activated]="alertsRoute.isActive">
+          <mat-icon>error</mat-icon>  {{ 'ALERTS' | translate | titlecase }}
+        </a>
+        <a mat-list-item
+          (click)="menu.close()"
+          routerLink="/search"
+          routerLinkActive #searchRoute="routerLinkActive"
+          [activated]="searchRoute.isActive">
+          <mat-icon>search</mat-icon>  {{ 'SEARCH' | translate | titlecase }}
+        </a>
+        <a mat-list-item
+          (click)="menu.close()"
+          routerLink="/themes"
+          routerLinkActive #themesRoute="routerLinkActive"
+          [activated]="themesRoute.isActive">
+          <mat-icon>image</mat-icon>  {{ 'THEMES' | translate | titlecase }}
+        </a>
+        <mat-divider></mat-divider>
+        <a mat-list-item
+          (click)="menu.close()"
+          routerLink="/main">
+          {{ 'MAIN_VIEW' | translate | titlecase }}
+        </a>
+        <a mat-list-item
+          (click)="menu.close()"
+          routerLink="/stage">
+          {{ 'STAGE_VIEW' | translate | titlecase }}
+        </a>
+        <a mat-list-item
+          (click)="menu.close()"
+          routerLink="/chords">
+          {{ 'CHORD_VIEW' | translate | titlecase }}
+        </a>
+        <mat-divider></mat-divider>
+        <a mat-list-item (click)="menu.close()"
+          routerLink="/settings"
+          routerLinkActive #settingsRoute="routerLinkActive"
+          [activated]="settingsRoute.isActive">
+          <mat-icon>settings</mat-icon>  {{ 'SETTINGS' | translate | titlecase }}
+        </a>
+      </mat-nav-list>
+    </mat-sidenav>
+    <mat-sidenav-content>
+      <main class="content">
+        <mat-tab-nav-panel #tabPanel>
+          <router-outlet></router-outlet>
+        </mat-tab-nav-panel>
+      </main>
+      <!-- These two toolbars are for padding the content so the real toolbars do not block content when scrolled down -->
+      <mat-toolbar class="toolbar-padding"></mat-toolbar>
+      @if (fastSwitching) {
+        <mat-toolbar class="toolbar-padding"></mat-toolbar>
+      }
+      <footer>
+        <mat-toolbar class="footer">
+          @if (bigDisplayButtons) {
+            <button
+              mat-fab color="primary"
+              (click)="previousItem()"
+              matTooltip="{{ 'PREVIOUS_ITEM' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>first_page</mat-icon>
+            </button>
+            <button
+              mat-fab color="primary"
+              (click)="nextItem()"
+              matTooltip="{{ 'NEXT_ITEM' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>last_page</mat-icon>
+            </button>
+            <button
+              mat-fab color="primary"
+              (click)="previousSlide()"
+              matTooltip="{{ 'PREVIOUS_SLIDE' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>navigate_before</mat-icon>
+            </button>
+            <button
+              mat-fab color="primary"
+              (click)="nextSlide()"
+              matTooltip="{{ 'NEXT_SLIDE' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>navigate_next</mat-icon>
+            </button>
+            <button
+              mat-fab color="primary"
+              #squashedDisplayButton
+              (click)="openDisplayModeSelector()"
+              class="squashed-display-button"
+              matTooltip="{{ 'CHANGE_DISPLAY_MODE' | translate | titlecase }}"
+              matTooltipPosition="above">
+              @if (state.blank) {
+                <mat-icon>videocam_off</mat-icon>
+              }
+              @else if (state.theme) {
+                <mat-icon>wallpaper</mat-icon>
+              }
+              @else if (state.display) {
+                <mat-icon>desktop_windows</mat-icon>
+              }
+              @else if (state.live()) {
+                <mat-icon>videocam</mat-icon>
+              }
+            </button>
+            <button
+              mat-fab color="primary"
+              (click)="blankDisplay()"
+              class="displayButton"
+              [class.active]="state.blank"
+              [disabled]="state.blank"
+              matTooltip="{{ 'SHOW_BLACK' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>videocam_off</mat-icon>
+            </button>
+            <button
+              mat-fab color="primary"
+              (click)="themeDisplay()"
+              class="displayButton"
+              [class.active]="state.theme"
+              [disabled]="state.theme"
+              matTooltip="{{ 'SHOW_BACKGROUND' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>wallpaper</mat-icon>
+            </button>
+            <button
+              mat-fab color="primary"
+              (click)="desktopDisplay()"
+              class="displayButton"
+              [class.active]="state.display"
+              [disabled]="state.display"
+              matTooltip="{{ 'SHOW_DESKTOP' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>desktop_windows</mat-icon>
+            </button>
+            <button
+              mat-fab color="primary"
+              (click)="showDisplay()"
+              class="displayButton"
+              [class.active]="state.display"
+              [disabled]="state.live()"
+              matTooltip="{{ 'SHOW_PRESENTATION' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>videocam</mat-icon>
+            </button>
+          }
+          @else {
+            <button
+              mat-icon-button
+              (click)="previousItem()"
+              matTooltip="{{ 'PREVIOUS_ITEM' | translate | titlecase }}"
+              matTooltipPosition="above"> 
+              <mat-icon>first_page</mat-icon>
+            </button>
+            <button
+              mat-icon-button
+              (click)="nextItem()"
+              matTooltip="{{ 'NEXT_ITEM' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>last_page</mat-icon>
+            </button>
+            <button
+              mat-icon-button (click)="previousSlide()"
+              matTooltip="{{ 'PREVIOUS_SLIDE' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>navigate_before</mat-icon>
+            </button>
+            <button
+              mat-icon-button (click)="nextSlide()"
+              matTooltip="{{ 'NEXT_SLIDE' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>navigate_next</mat-icon>
+            </button>
+            <button
+              mat-icon-button
+              #squashedDisplayButton
+              (click)="openDisplayModeSelector()"
+              class="squashed-display-button"
+              matTooltip="{{ 'CHANGE_DISPLAY_MODE' | translate | titlecase }}"
+              matTooltipPosition="above">
+              @if (state.blank) {
+                <mat-icon>videocam_off</mat-icon>
+              }
+              @else if (state.theme) {
+                <mat-icon>wallpaper</mat-icon>
+              }
+              @else if (state.display) {
+                <mat-icon>desktop_windows</mat-icon>
+              }
+              @else if (state.live()) {
+                <mat-icon>videocam</mat-icon>
+              }
+            </button>
+            <button
+              mat-icon-button (click)="blankDisplay()"
+              class="displayButton"
+              [class.active]="state.blank"
+              [disabled]="state.blank"
+              matTooltip="{{ 'SHOW_BLACK' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>videocam_off</mat-icon>
+            </button>
+            <button
+              mat-icon-button
+              (click)="themeDisplay()"
+              class="displayButton"
+              [class.active]="state.theme"
+              [disabled]="state.theme"
+              matTooltip="{{ 'SHOW_BACKGROUND' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>wallpaper</mat-icon>
+            </button>
+            <button
+              mat-icon-button (click)="desktopDisplay()"
+              class="displayButton"
+              [class.active]="state.display"
+              [disabled]="state.display"
+              matTooltip="{{ 'SHOW_DESKTOP' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>desktop_windows</mat-icon>
+            </button>
+            <button
+              mat-icon-button (click)="showDisplay()"
+              class="displayButton"
+              [class.active]="state.display"
+              [disabled]="state.live()"
+              matTooltip="{{ 'SHOW_PRESENTATION' | translate | titlecase }}"
+              matTooltipPosition="above">
+              <mat-icon>videocam</mat-icon>
+            </button>
+          }
+        </mat-toolbar>
+        @if (fastSwitching) {
+          <nav
+            mat-tab-nav-bar mat-stretch-tabs
+            class="fast-switcher"
+            [tabPanel]="tabPanel">
+            <a mat-tab-link
+              routerLink="/service"
+              routerLinkActive #serviceRoute="routerLinkActive"
+              [active]="serviceRoute.isActive"><mat-icon>list</mat-icon></a>
+            <a mat-tab-link
+              routerLink="/slides"
+              routerLinkActive #slidesRoute="routerLinkActive"
+              [active]="slidesRoute.isActive"><mat-icon>collections</mat-icon></a>
+            <a mat-tab-link
+              routerLink="/alerts"
+              routerLinkActive #alertsRoute="routerLinkActive"
+              [active]="alertsRoute.isActive"><mat-icon>error</mat-icon></a>
+            <a mat-tab-link
+              routerLink="/search"
+              routerLinkActive #searchRoute="routerLinkActive"
+              [active]="searchRoute.isActive"><mat-icon>search</mat-icon></a>
+            <a mat-tab-link
+              routerLink="/themes"
+              routerLinkActive #themesRoute="routerLinkActive"
+              [active]="themesRoute.isActive"><mat-icon>image</mat-icon></a>
+          </nav>
+        }
+      </footer>
+    </mat-sidenav-content>
+  </mat-sidenav-container>
+</div>
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index 5ffeefc..fc13e07 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -1,10 +1,28 @@
+div.light-theme,
+div.dark-theme {
+  display: flex;
+  flex-direction: column;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
 $small-toolbar-breakpoint: 500px;
 
-// To allow the inner overlay (and other items) to use z-indexes greater than 1
+// To allow the inner overlay (and other items) to use z-indexes greater than 1.
 .mat-sidenav {
   &-container, &-content {
     z-index: auto;
   }
+  // This rule is to avoid the left menu scrolling with the page itself.
+  position: fixed;
+  padding-top: 64px;
+  @media screen and (max-width: 600px) {
+    padding-top: 56px; 
+  }
+  width: 12rem;
 }
 
 mat-toolbar {
@@ -13,16 +31,12 @@ mat-toolbar {
   top: 0;
   z-index: 1020;
 
-  /* Fix icon button alignment on some Firefox configurations */
+  // Fix icon button alignment on some Firefox configurations.
   [mat-icon-button] {
     line-height: 1;
   }
 }
 
-mat-divider {
-  border-color: rgb(175, 175, 175);
-}
-
 mat-toolbar-row .spacer {
   flex: 1 1 auto;
 }
@@ -31,15 +45,11 @@ mat-toolbar-row .spacer {
   font-size: 70%;
 }
 
-mat-sidenav {
-  background: white;
-}
-
 mat-sidenav-container {
   flex: 1;
 }
 
-/* Align icons with text */
+// Align icons with text.
 mat-sidenav-container .mat-icon {
   vertical-align: text-top;
 }
@@ -58,10 +68,6 @@ mat-sidenav-container .mat-icon {
   margin-right: 1rem;
 }
 
-.fast-switcher {
-  background-color: whitesmoke;
-}
-
 .fast-switcher a.mat-mdc-tab-link > span.text {
   margin-left: 0.3rem;
 }
@@ -85,9 +91,7 @@ mat-sidenav-container .mat-icon {
   }
 }
 
-/*
- * Make the Component injected by Router Outlet full height:
- */
+// Make the Component injected by Router Outlet full height.
 main {
   display: flex;
   flex-direction: column;
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index dc21f61..cfefe1a 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -33,6 +33,7 @@ export class AppComponent implements OnInit {
   webSocketOpen = false;
   fastSwitching = false;
   bigDisplayButtons = false;
+  darkTheme = false;
   useShortcutsFromOpenlp = false;
   useLanguageFromOpenlp = false;
 
@@ -72,9 +73,11 @@ export class AppComponent implements OnInit {
       }
     );
     this.fastSwitching = this.settingsService.get('fastSwitching');
-    this.settingsService.onPropertyChanged('fastSwitching').subscribe(value => this.fastSwitching = value);
+    this.settingsService.onPropertyChanged('fastSwitching').subscribe((value: boolean) => this.fastSwitching = value);
     this.bigDisplayButtons = this.settingsService.get('bigDisplayButtons');
-    this.settingsService.onPropertyChanged('bigDisplayButtons').subscribe(value => this.bigDisplayButtons = value);
+    this.darkTheme = this.settingsService.get('darkTheme');
+    this.settingsService.onPropertyChanged('bigDisplayButtons').subscribe((value: boolean) => this.bigDisplayButtons = value);
+    this.settingsService.onPropertyChanged('darkTheme').subscribe((value: boolean) => this.darkTheme = value);
   }
 
   addShortcuts(shortcuts: Shortcuts): void {
@@ -125,8 +128,9 @@ export class AppComponent implements OnInit {
 
   openDisplayModeSelector(): void {
     const display = new Display();
-    display.displayMode = this.state.displayMode;
     display.bigDisplayButtons = this.bigDisplayButtons;
+    display.darkTheme = this.darkTheme;
+    display.displayMode = this.state.displayMode;
     const selectorRef = this.bottomSheet.open(
       DisplayModeSelectorComponent,
       {
diff --git a/src/app/components/service/service-item/service-item.component.scss b/src/app/components/service/service-item/service-item.component.scss
index e5bf4a8..8e232c2 100644
--- a/src/app/components/service/service-item/service-item.component.scss
+++ b/src/app/components/service/service-item/service-item.component.scss
@@ -1,8 +1,3 @@
-.selected {
-    background-color: rgb(235, 235, 235);
-    font-weight: 700;
-}
-
 /* Align icons with text */
 .mat-icon {
   line-height: inherit !important;
diff --git a/src/app/components/settings/settings.component.html b/src/app/components/settings/settings.component.html
index 7aff63f..538c64b 100644
--- a/src/app/components/settings/settings.component.html
+++ b/src/app/components/settings/settings.component.html
@@ -13,42 +13,50 @@
         </mat-slide-toggle>
       </div>
       <div class="settings-item">
-         <mat-slide-toggle
-            color="primary"
-            [checked]="settings.bigDisplayButtons"
-            (change)="setSetting('bigDisplayButtons', $event.checked)">
-            {{ 'ENABLE_BIG_DISPLAY_BUTTONS' | translate | sentencecase }}
-          </mat-slide-toggle>
-        </div>
-      </mat-card-content>
-    </mat-card>
-    <mat-card>
-      <mat-card-header>
-        {{ 'STAGE_AND_CHORDS_APPEARANCE' | translate | sentencecase }}
-      </mat-card-header>
-      <mat-card-content>
-        <mat-tab-group>
-          <mat-tab label="{{ 'STAGE' | translate | titlecase }}">
-             <ng-template matTabContent>
-                <ng-container>
-                   <openlp-stage-chord-preview stageType="stage">
-                   </openlp-stage-chord-preview>
-                   <ng-container *ngTemplateOutlet="stageSettings; context: {prefix: 'stage'}">
-                   </ng-container>
-                 </ng-container>
-             </ng-template>
-          </mat-tab>
-          <mat-tab label="{{ 'CHORDS' | translate | titlecase }}">
-            <ng-template matTabContent>
-              <openlp-stage-chord-preview stageType="chords">
+        <mat-slide-toggle
+          color="primary"
+          [checked]="settings.bigDisplayButtons"
+          (change)="setSetting('bigDisplayButtons', $event.checked)">
+          {{ 'ENABLE_BIG_DISPLAY_BUTTONS' | translate | sentencecase }}
+        </mat-slide-toggle>
+      </div>
+      <div class="settings-item">
+        <mat-slide-toggle
+          color="primary"
+          [checked]="settings.darkTheme"
+          (change)="setSetting('darkTheme', $event.checked)">
+          {{ 'ENABLE_DARK_THEME' | translate | sentencecase }}
+        </mat-slide-toggle>
+      </div>
+    </mat-card-content>
+  </mat-card>
+  <mat-card>
+    <mat-card-header>
+      {{ 'STAGE_AND_CHORDS_APPEARANCE' | translate | sentencecase }}
+    </mat-card-header>
+    <mat-card-content>
+      <mat-tab-group>
+        <mat-tab label="{{ 'STAGE' | translate | titlecase }}">
+          <ng-template matTabContent>
+            <ng-container>
+              <openlp-stage-chord-preview stageType="stage">
               </openlp-stage-chord-preview>
-              <ng-container *ngTemplateOutlet="stageSettings; context: {prefix: 'chords'}">
+              <ng-container *ngTemplateOutlet="stageSettings; context: {prefix: 'stage'}">
               </ng-container>
-            </ng-template>
-          </mat-tab>
-        </mat-tab-group>
-      </mat-card-content>
-    </mat-card>
+            </ng-container>
+          </ng-template>
+        </mat-tab>
+        <mat-tab label="{{ 'CHORDS' | translate | titlecase }}">
+          <ng-template matTabContent>
+            <openlp-stage-chord-preview stageType="chords">
+            </openlp-stage-chord-preview>
+            <ng-container *ngTemplateOutlet="stageSettings; context: {prefix: 'chords'}">
+            </ng-container>
+          </ng-template>
+        </mat-tab>
+      </mat-tab-group>
+    </mat-card-content>
+  </mat-card>
 </div>
 <ng-template
   #stageSettings
diff --git a/src/app/components/settings/settings.component.scss b/src/app/components/settings/settings.component.scss
index 6b6afd7..e6cc049 100644
--- a/src/app/components/settings/settings.component.scss
+++ b/src/app/components/settings/settings.component.scss
@@ -9,6 +9,7 @@
 
 .settings-item {
     font-size: 1rem;
+    margin: 1rem;
     
     &:first-child {
         margin-top: 1em;
diff --git a/src/app/components/slides/slide-item/slide-item.component.html b/src/app/components/slides/slide-item/slide-item.component.html
index 6c48a24..d145126 100644
--- a/src/app/components/slides/slide-item/slide-item.component.html
+++ b/src/app/components/slides/slide-item/slide-item.component.html
@@ -4,7 +4,7 @@
   (click)="onSlideSelected(slide)"
   [class.selected]="selected">
   <mat-card-header>
-    <mat-card-subtitle class="slide-title">{{ slide?.tag }}</mat-card-subtitle>
+    <mat-card-subtitle class="slide-title" [class.selected]="selected">{{ slide?.tag }}</mat-card-subtitle>
   </mat-card-header>
   @if (slide?.img) {
     <img mat-card-image src="{{ slide?.img }}" alt="{{ slide?.tag }}" />
diff --git a/src/app/components/slides/slide-item/slide-item.component.scss b/src/app/components/slides/slide-item/slide-item.component.scss
index 09e833f..258fe2b 100644
--- a/src/app/components/slides/slide-item/slide-item.component.scss
+++ b/src/app/components/slides/slide-item/slide-item.component.scss
@@ -4,11 +4,6 @@
   white-space: pre-wrap;
 }
 
-.selected {
-  background-color: rgb(235, 235, 235);
-  font-weight: 700;
-}
-
 .slide-title {
   margin-bottom: 1rem;
 }
diff --git a/src/app/components/themes/themes.component.scss b/src/app/components/themes/themes.component.scss
index 4351d84..c65bd67 100644
--- a/src/app/components/themes/themes.component.scss
+++ b/src/app/components/themes/themes.component.scss
@@ -1,32 +1,27 @@
 
 img {
-    width: 100%;
-}
-  
-.selected {
-    background-color: rgb(235, 235, 235);
-    font-weight: 700;
+  width: 100%;
 }
 
 .theme-container {
-    display: grid;
-    justify-content: space-evenly;
-    grid-template-columns: repeat(auto-fill, min(220px, 100%));
-    gap: 1rem;
+  display: grid;
+  justify-content: space-evenly;
+  grid-template-columns: repeat(auto-fill, min(220px, 100%));
+  gap: 1rem;
 }
 
 .theme-card {
-    cursor: pointer;
-    justify-content: center;
+  cursor: pointer;
+  justify-content: center;
 }
 
 .theme-title {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .theme-title:hover {
-    overflow: visible;
-    white-space: pre-wrap;
+  overflow: visible;
+  white-space: pre-wrap;
 }
diff --git a/src/app/responses.ts b/src/app/responses.ts
index 11b55bc..01db0b6 100644
--- a/src/app/responses.ts
+++ b/src/app/responses.ts
@@ -30,8 +30,9 @@ export class State {
 }
 
 export class Display {
-  displayMode: DisplayMode;
   bigDisplayButtons: boolean;
+  darkTheme: boolean;
+  displayMode: DisplayMode;
 }
 
 export enum DisplayMode {
diff --git a/src/app/settings.service.ts b/src/app/settings.service.ts
index ce2269c..a0605f5 100644
--- a/src/app/settings.service.ts
+++ b/src/app/settings.service.ts
@@ -6,6 +6,7 @@ export class SettingsProperties {
     stageFontScale = 100;
     chordsFontScale = 100;
     bigDisplayButtons = false;
+    darkTheme = false;
 }
 
 export interface SettingsPropertiesItem<SP extends keyof SettingsProperties, SV = SettingsProperties[SP]> {
diff --git a/src/assets/en.json b/src/assets/en.json
index 6496abe..510104b 100644
--- a/src/assets/en.json
+++ b/src/assets/en.json
@@ -13,6 +13,7 @@
   "CONNECTED_TO_OPENLP": "Connected to OpenLP",
   "DISCONNECTED": "Disconnected",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Enable Big Display Buttons",
+  "ENABLE_DARK_THEME": "Enable Dark Theme",
   "ENABLE_FAST_SWITCHING_PANEL": "Enable Fast Switching Panel",
   "FONT_SCALE": "Font Scale",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/af.json b/src/assets/i18n/af.json
index dfa942f..3175bbf 100644
--- a/src/assets/i18n/af.json
+++ b/src/assets/i18n/af.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Gekoppel aan OpenLP",
   "DISCONNECTED": "Ontkoppel",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Aktiveer Grootskermknoppies",
+  "ENABLE_DARK_THEME": "Aktiveer Donker Tema",
   "ENABLE_FAST_SWITCHING_PANEL": "Aktiveer Vinnige Skakelpaneel",
   "FONT_SCALE": "Lettertipe Skaal",
   "GLOBAL": "Globale",
diff --git a/src/assets/i18n/bg.json b/src/assets/i18n/bg.json
index 24ff0bf..c23d8d9 100644
--- a/src/assets/i18n/bg.json
+++ b/src/assets/i18n/bg.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Свързан с OpenLP",
   "DISCONNECTED": "Разкачен",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Включи големи бутони на дисплея",
+  "ENABLE_DARK_THEME": "Разреши тъмна тема",
   "ENABLE_FAST_SWITCHING_PANEL": "Включи бърз панел за превключване",
   "FONT_SCALE": "Мащаб на шрифта",
   "GLOBAL": "Глобално",
diff --git a/src/assets/i18n/cs.json b/src/assets/i18n/cs.json
index 66edb7f..d7720f6 100644
--- a/src/assets/i18n/cs.json
+++ b/src/assets/i18n/cs.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Připojeno k OpenLP",
   "DISCONNECTED": "Odpojeno",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Povolit Velká Tlačítka na Displeji",
+  "ENABLE_DARK_THEME": "Povolit Tmavý Motiv",
   "ENABLE_FAST_SWITCHING_PANEL": "ovolit Rychlý Přepínač Panelu",
   "FONT_SCALE": "Měřítko Písma",
   "GLOBAL": "Globální",
diff --git a/src/assets/i18n/da.json b/src/assets/i18n/da.json
index f2460a2..bb68e15 100644
--- a/src/assets/i18n/da.json
+++ b/src/assets/i18n/da.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Tilsluttet OpenLP",
   "DISCONNECTED": "Frakoblet",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Aktivér Store Skærmknapper",
+  "ENABLE_DARK_THEME": "Aktivér Mørkt Tema",
   "ENABLE_FAST_SWITCHING_PANEL": "Aktivér Hurtig Skiftepanel",
   "FONT_SCALE": "Skriftstørrelse",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/de.json b/src/assets/i18n/de.json
index 4c48aa4..b7ad942 100644
--- a/src/assets/i18n/de.json
+++ b/src/assets/i18n/de.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Mit OpenLP Verbunden",
   "DISCONNECTED": "Getrennt",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Große Anzeige-Schaltflächen Aktivieren",
+  "ENABLE_DARK_THEME": "Dunkles Design Aktivieren",
   "ENABLE_FAST_SWITCHING_PANEL": "Schnelles Umschalten Aktivieren",
   "FONT_SCALE": "Schriftgrad",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/el.json b/src/assets/i18n/el.json
index b8a6783..1945214 100644
--- a/src/assets/i18n/el.json
+++ b/src/assets/i18n/el.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Συνδέθηκε στο OpenLP",
   "DISCONNECTED": "Αποσυνδέθηκε",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Ενεργοποίηση μεγάλων κουμπιών εμφάνισης",
+  "ENABLE_DARK_THEME": "Ενεργοποίηση σκούρου θέματος",
   "ENABLE_FAST_SWITCHING_PANEL": "Ενεργοποίηση γρήγορου πίνακα μετάβασης",
   "FONT_SCALE": "Κλίμακα γραμματοσειράς",
   "GLOBAL": "Καθολικό",
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index d0dbe22..a07f70c 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Connected to OpenLP",
   "DISCONNECTED": "Disconnected",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Enable Big Display Buttons",
+  "ENABLE_DARK_THEME": "Enable Dark Theme",
   "ENABLE_FAST_SWITCHING_PANEL": "Enable Fast Switching Panel",
   "FONT_SCALE": "Font Scale",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/en_GB.json b/src/assets/i18n/en_GB.json
index f618df1..6bc5cc7 100644
--- a/src/assets/i18n/en_GB.json
+++ b/src/assets/i18n/en_GB.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Connected to OpenLP",
   "DISCONNECTED": "Disconnected",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Enable Big Display Buttons",
+  "ENABLE_DARK_THEME": "Enable Dark Theme",
   "ENABLE_FAST_SWITCHING_PANEL": "Enable Fast Switching Panel",
   "FONT_SCALE": "Font Scale",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/en_ZA.json b/src/assets/i18n/en_ZA.json
index f618df1..6bc5cc7 100644
--- a/src/assets/i18n/en_ZA.json
+++ b/src/assets/i18n/en_ZA.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Connected to OpenLP",
   "DISCONNECTED": "Disconnected",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Enable Big Display Buttons",
+  "ENABLE_DARK_THEME": "Enable Dark Theme",
   "ENABLE_FAST_SWITCHING_PANEL": "Enable Fast Switching Panel",
   "FONT_SCALE": "Font Scale",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/es.json b/src/assets/i18n/es.json
index 9855fa7..46eca2f 100644
--- a/src/assets/i18n/es.json
+++ b/src/assets/i18n/es.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Conectado a OpenLP",
   "DISCONNECTED": "Desconectado",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Habilitar Botones de Pantalla Grande",
+  "ENABLE_DARK_THEME": "Habilitar Tema Oscuro",
   "ENABLE_FAST_SWITCHING_PANEL": "Habilitar Panel de Cambio Rápido",
   "FONT_SCALE": "Escala de Fuente",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/es_CL.json b/src/assets/i18n/es_CL.json
index 9855fa7..46eca2f 100644
--- a/src/assets/i18n/es_CL.json
+++ b/src/assets/i18n/es_CL.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Conectado a OpenLP",
   "DISCONNECTED": "Desconectado",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Habilitar Botones de Pantalla Grande",
+  "ENABLE_DARK_THEME": "Habilitar Tema Oscuro",
   "ENABLE_FAST_SWITCHING_PANEL": "Habilitar Panel de Cambio Rápido",
   "FONT_SCALE": "Escala de Fuente",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/et.json b/src/assets/i18n/et.json
index 3f70c5a..d8a1e6f 100644
--- a/src/assets/i18n/et.json
+++ b/src/assets/i18n/et.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Ühendatud OpenLP-ga",
   "DISCONNECTED": "Lahti",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Luba Suured Kuvanupud",
+  "ENABLE_DARK_THEME": "Luba Tume Teema",
   "ENABLE_FAST_SWITCHING_PANEL": "Luba Kiire Lülituspaneel",
   "FONT_SCALE": "Fondi Mastaap",
   "GLOBAL": "Ülemaailmne",
diff --git a/src/assets/i18n/fi.json b/src/assets/i18n/fi.json
index a6fa6ce..8ec1a71 100644
--- a/src/assets/i18n/fi.json
+++ b/src/assets/i18n/fi.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Yhdistetty OpenLP:hen",
   "DISCONNECTED": "Hajanainen",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Ota Käyttöön Suuret Näyttöpainikkeet",
+  "ENABLE_DARK_THEME": "Ota tumma Teema Käyttöön",
   "ENABLE_FAST_SWITCHING_PANEL": "Ota Nopea Kytkentäpaneeli Käyttöön",
   "FONT_SCALE": "Fontin Asteikko",
   "GLOBAL": "Yleinen",
diff --git a/src/assets/i18n/fr.json b/src/assets/i18n/fr.json
index beb4819..10616d6 100644
--- a/src/assets/i18n/fr.json
+++ b/src/assets/i18n/fr.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Connecté à OpenLP",
   "DISCONNECTED": "Déconnecté",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Activer les Gros Boutons d’Afichage",
+  "ENABLE_DARK_THEME": "Activer le Thème Sombre",
   "ENABLE_FAST_SWITCHING_PANEL": "Activer le Panneau de Commutation Rapide",
   "FONT_SCALE": "Échelle de Police",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/hu.json b/src/assets/i18n/hu.json
index e94fab4..8ab7f1e 100644
--- a/src/assets/i18n/hu.json
+++ b/src/assets/i18n/hu.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "OpenLP-hez Csatlakoztatva",
   "DISCONNECTED": "Elválasztott",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Nagy Kijelzőgombok Engedélyezése",
+  "ENABLE_DARK_THEME": "Sötét Téma Engedélyezése",
   "ENABLE_FAST_SWITCHING_PANEL": "Gyors Váltás Engedélyezése Panel",
   "FONT_SCALE": "Betűméret",
   "GLOBAL": "Globális",
diff --git a/src/assets/i18n/id.json b/src/assets/i18n/id.json
index 472f4b0..2801ddb 100644
--- a/src/assets/i18n/id.json
+++ b/src/assets/i18n/id.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Terhubung ke OpenLP",
   "DISCONNECTED": "Terputus",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Aktifkan Tombol Tampilan Besar",
+  "ENABLE_DARK_THEME": "Mengaktifkan Tema Gelap",
   "ENABLE_FAST_SWITCHING_PANEL": "Aktifkan Panel Peralihan Cepat",
   "FONT_SCALE": "Skala Font",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/it.json b/src/assets/i18n/it.json
index e90d5f0..62e55ff 100644
--- a/src/assets/i18n/it.json
+++ b/src/assets/i18n/it.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Collegato a OpenLP",
   "DISCONNECTED": "Disconnesso",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Abilita i Grandi Pulsanti di Visualizzazione",
+  "ENABLE_DARK_THEME": "Abilita il Tema Scuro",
   "ENABLE_FAST_SWITCHING_PANEL": "Abilita il Pannello di Commutazione Rapida",
   "FONT_SCALE": "Scala del Carattere",
   "GLOBAL": "Globale",
diff --git a/src/assets/i18n/it_CH.json b/src/assets/i18n/it_CH.json
index e90d5f0..62e55ff 100644
--- a/src/assets/i18n/it_CH.json
+++ b/src/assets/i18n/it_CH.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Collegato a OpenLP",
   "DISCONNECTED": "Disconnesso",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Abilita i Grandi Pulsanti di Visualizzazione",
+  "ENABLE_DARK_THEME": "Abilita il Tema Scuro",
   "ENABLE_FAST_SWITCHING_PANEL": "Abilita il Pannello di Commutazione Rapida",
   "FONT_SCALE": "Scala del Carattere",
   "GLOBAL": "Globale",
diff --git a/src/assets/i18n/it_IT.json b/src/assets/i18n/it_IT.json
index e90d5f0..62e55ff 100644
--- a/src/assets/i18n/it_IT.json
+++ b/src/assets/i18n/it_IT.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Collegato a OpenLP",
   "DISCONNECTED": "Disconnesso",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Abilita i Grandi Pulsanti di Visualizzazione",
+  "ENABLE_DARK_THEME": "Abilita il Tema Scuro",
   "ENABLE_FAST_SWITCHING_PANEL": "Abilita il Pannello di Commutazione Rapida",
   "FONT_SCALE": "Scala del Carattere",
   "GLOBAL": "Globale",
diff --git a/src/assets/i18n/ja.json b/src/assets/i18n/ja.json
index 47bd6f1..9afdf6d 100644
--- a/src/assets/i18n/ja.json
+++ b/src/assets/i18n/ja.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "OpenLPに接続済み",
   "DISCONNECTED": "切断されました",
   "ENABLE_BIG_DISPLAY_BUTTONS": "大きな表示ボタンを有効にする",
+  "ENABLE_DARK_THEME": "ダークテーマを有効にする",
   "ENABLE_FAST_SWITCHING_PANEL": "高速切り替えパネルを有効にする",
   "FONT_SCALE": "フォントスケール",
   "GLOBAL": "グローバル",
diff --git a/src/assets/i18n/ko.json b/src/assets/i18n/ko.json
index 9d384a8..4f0a618 100644
--- a/src/assets/i18n/ko.json
+++ b/src/assets/i18n/ko.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "OpenLP에 연결됨",
   "DISCONNECTED": "연결이 끊어짐",
   "ENABLE_BIG_DISPLAY_BUTTONS": "큰 디스플레이 버튼 활성화",
+  "ENABLE_DARK_THEME": "어두운 테마 사용",
   "ENABLE_FAST_SWITCHING_PANEL": "빠른 전환 패널 활성화",
   "FONT_SCALE": "글꼴 크기",
   "GLOBAL": " 전역",
diff --git a/src/assets/i18n/lt.json b/src/assets/i18n/lt.json
index 79c1937..07b1cbc 100644
--- a/src/assets/i18n/lt.json
+++ b/src/assets/i18n/lt.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Prisijungta prie OpenLP",
   "DISCONNECTED": "Atjungta",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Įjungti Didelius Rodymo Mygtukus",
+  "ENABLE_DARK_THEME": "Įgalinti Tamsiąją Temą",
   "ENABLE_FAST_SWITCHING_PANEL": "Įjungti Greito Perjungimo Skydelį",
   "FONT_SCALE": "Šrifto Mastelis",
   "GLOBAL": "Visuotinis",
diff --git a/src/assets/i18n/nb.json b/src/assets/i18n/nb.json
index 056468d..8642a6b 100644
--- a/src/assets/i18n/nb.json
+++ b/src/assets/i18n/nb.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Koblet til OpenLP",
   "DISCONNECTED": "Frakoblet",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Aktiver Store Visningsknapper",
+  "ENABLE_DARK_THEME": "Aktiver Mørkt Tema",
   "ENABLE_FAST_SWITCHING_PANEL": "Aktiver Rask Byttepanel",
   "FONT_SCALE": "Skriftstørrelse",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/nl.json b/src/assets/i18n/nl.json
index 0c032dc..de2394d 100644
--- a/src/assets/i18n/nl.json
+++ b/src/assets/i18n/nl.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Verbonden met OpenLP",
   "DISCONNECTED": "Niet Verbonden",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Activeer Grote Beeldschermknoppen",
+  "ENABLE_DARK_THEME": "Activeer Donker Thema",
   "ENABLE_FAST_SWITCHING_PANEL": "Activeer Snel Wisselpaneel",
   "FONT_SCALE": "Schaal Lettertype",
   "GLOBAL": "Globaal",
diff --git a/src/assets/i18n/pl.json b/src/assets/i18n/pl.json
index df484ba..8a0f601 100644
--- a/src/assets/i18n/pl.json
+++ b/src/assets/i18n/pl.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Połączono z OpenLP",
   "DISCONNECTED": "Rozłączono",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Włącz Duże Przyciski Wyświetlania",
+  "ENABLE_DARK_THEME": "Włącz Ciemny Motyw",
   "ENABLE_FAST_SWITCHING_PANEL": "Włącz Szybki Panel Przełączania",
   "FONT_SCALE": "Skala Czcionki",
   "GLOBAL": "Globalny",
diff --git a/src/assets/i18n/pt_BR.json b/src/assets/i18n/pt_BR.json
index 7c62469..cc48356 100644
--- a/src/assets/i18n/pt_BR.json
+++ b/src/assets/i18n/pt_BR.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Conectado ao OpenLP",
   "DISCONNECTED": "Desconectado",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Ativar Botões de Tela Grande",
+  "ENABLE_DARK_THEME": "Ativar Tema Escuro",
   "ENABLE_FAST_SWITCHING_PANEL": "Ativar Painel de Troca Rápida",
   "FONT_SCALE": "Escala de Fonte",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/ro.json b/src/assets/i18n/ro.json
index 6913baf..61ca031 100644
--- a/src/assets/i18n/ro.json
+++ b/src/assets/i18n/ro.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Conectat la OpenLP",
   "DISCONNECTED": "Deconectat",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Activați Butoanele de Afișare Mare",
+  "ENABLE_DARK_THEME": "Activați Tema întunecată",
   "ENABLE_FAST_SWITCHING_PANEL": "Activați Panoul de Comutare Rapidă",
   "FONT_SCALE": "Scară Font",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/ru.json b/src/assets/i18n/ru.json
index 796666f..98e22e8 100644
--- a/src/assets/i18n/ru.json
+++ b/src/assets/i18n/ru.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Подключено к OpenLP",
   "DISCONNECTED": "Отключено",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Включить большие кнопки отображения",
+  "ENABLE_DARK_THEME": "Включить темную тему",
   "ENABLE_FAST_SWITCHING_PANEL": "Включить панель быстрого переключения",
   "FONT_SCALE": "Масштаб шрифта",
   "GLOBAL": "Глобальный",
diff --git a/src/assets/i18n/sk.json b/src/assets/i18n/sk.json
index 5aa8922..909cc79 100644
--- a/src/assets/i18n/sk.json
+++ b/src/assets/i18n/sk.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Pripojené k OpenLP",
   "DISCONNECTED": "Odpojené",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Povoliť Veľké Tlačidlá na Displeji",
+  "ENABLE_DARK_THEME": "Povolenie Tmavého Motívu",
   "ENABLE_FAST_SWITCHING_PANEL": "Povoliť Rýchle Prepínanie Panelov",
   "FONT_SCALE": "Veľkosť Písma",
   "GLOBAL": "Celosvetové",
diff --git a/src/assets/i18n/sl.json b/src/assets/i18n/sl.json
index ddef6c7..9e5e26c 100644
--- a/src/assets/i18n/sl.json
+++ b/src/assets/i18n/sl.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Povezano z OpenLP",
   "DISCONNECTED": "Nepovezan",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Omogoči Velike Gumbe",
+  "ENABLE_DARK_THEME": "Omogočanje Temne Teme",
   "ENABLE_FAST_SWITCHING_PANEL": "Omogoči Priročno Vrstico",
   "FONT_SCALE": "Velikost Pisave",
   "GLOBAL": "Obče",
diff --git a/src/assets/i18n/sv.json b/src/assets/i18n/sv.json
index e30530f..2bab83d 100644
--- a/src/assets/i18n/sv.json
+++ b/src/assets/i18n/sv.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Ansluten till OpenLP",
   "DISCONNECTED": "Frånkopplad",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Aktivera Stora Visningsknappar",
+  "ENABLE_DARK_THEME": "Aktivera Mörkt Tema",
   "ENABLE_FAST_SWITCHING_PANEL": "Aktivera Sabbväxlingspanel",
   "FONT_SCALE": "Teckensnittsskala",
   "GLOBAL": "Global",
diff --git a/src/assets/i18n/ta_LK.json b/src/assets/i18n/ta_LK.json
index 7b143db..b60299a 100644
--- a/src/assets/i18n/ta_LK.json
+++ b/src/assets/i18n/ta_LK.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "OpenLP க்கு இணைக்கப்பட்டது",
   "DISCONNECTED": "இணைக்கப்படவில்லை",
   "ENABLE_BIG_DISPLAY_BUTTONS": "பெரிய காட்சி பொத்தான்களை இயக்கு",
+  "ENABLE_DARK_THEME": "இருண்ட கருப்பொருளை இயக்கவும்",
   "ENABLE_FAST_SWITCHING_PANEL": "விரைவு மாற்று பேனலை இயக்கு",
   "FONT_SCALE": "எழுத்துரு அளவு",
   "GLOBAL": "உலகளாவிய",
diff --git a/src/assets/i18n/th_TH.json b/src/assets/i18n/th_TH.json
index a1e912b..e6fc92b 100644
--- a/src/assets/i18n/th_TH.json
+++ b/src/assets/i18n/th_TH.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": " เชื่อมต่อกับ OpenLP",
   "DISCONNECTED": "ตัดการเชื่อมต่อ",
   "ENABLE_BIG_DISPLAY_BUTTONS": "เปิดใช้งานปุ่มแสดงผลขนาดใหญ่",
+  "ENABLE_DARK_THEME": "เปิดใช้งานธีมสีเข้ม",
   "ENABLE_FAST_SWITCHING_PANEL": "เปิดใช้งานแผงสลับรวดเร็ว",
   "FONT_SCALE": "ขนาดตัวอักษร",
   "GLOBAL": "ระดับโลก",
diff --git a/src/assets/i18n/vi_VN.json b/src/assets/i18n/vi_VN.json
index 9d2db0b..5f18d84 100644
--- a/src/assets/i18n/vi_VN.json
+++ b/src/assets/i18n/vi_VN.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "Đã kết nối với OpenLP",
   "DISCONNECTED": "Đã ngắt kết nối",
   "ENABLE_BIG_DISPLAY_BUTTONS": "Bật nút Hiển thị lớn",
+  "ENABLE_DARK_THEME": "Bật giao diện tối",
   "ENABLE_FAST_SWITCHING_PANEL": "Bật bảng chuyển đổi nhanh",
   "FONT_SCALE": "Tỷ lệ phông chữ",
   "GLOBAL": "Toàn cầu",
diff --git a/src/assets/i18n/zh_CN.json b/src/assets/i18n/zh_CN.json
index fdcf680..4543a2d 100644
--- a/src/assets/i18n/zh_CN.json
+++ b/src/assets/i18n/zh_CN.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "已连接到 OpenLP",
   "DISCONNECTED": "断开连接",
   "ENABLE_BIG_DISPLAY_BUTTONS": "启用大显示按钮",
+  "ENABLE_DARK_THEME": "启用深色主题",
   "ENABLE_FAST_SWITCHING_PANEL": "启用快速切换面板",
   "FONT_SCALE": "字体缩放",
   "GLOBAL": "全局",
diff --git a/src/assets/i18n/zh_TW.json b/src/assets/i18n/zh_TW.json
index 66d5be4..4cb59f6 100644
--- a/src/assets/i18n/zh_TW.json
+++ b/src/assets/i18n/zh_TW.json
@@ -12,6 +12,7 @@
   "CONNECTED_TO_OPENLP": "已連接至 OpenLP",
   "DISCONNECTED": "已斷開連線",
   "ENABLE_BIG_DISPLAY_BUTTONS": "啟用大型顯示按鈕",
+  "ENABLE_DARK_THEME": "啟用深色主題",
   "ENABLE_FAST_SWITCHING_PANEL": "啟用快速切換面板",
   "FONT_SCALE": "字型縮放",
   "GLOBAL": "全域",
diff --git a/src/assets/themes/_fast-switcher-theme.scss b/src/assets/themes/_fast-switcher-theme.scss
new file mode 100644
index 0000000..e2b7027
--- /dev/null
+++ b/src/assets/themes/_fast-switcher-theme.scss
@@ -0,0 +1,13 @@
+@use '@angular/material' as mat;
+
+@mixin color($theme) {
+  .fast-switcher {
+    background-color: mat.get-theme-color($theme, primary, 70);
+  }
+}
+
+@mixin theme($theme) {
+  @if mat.theme-has($theme, color) {
+    @include color($theme);
+  }
+}
diff --git a/src/assets/themes/_slide-item-theme.scss b/src/assets/themes/_slide-item-theme.scss
new file mode 100644
index 0000000..9879635
--- /dev/null
+++ b/src/assets/themes/_slide-item-theme.scss
@@ -0,0 +1,14 @@
+@use '@angular/material' as mat;
+
+@mixin color($theme) {
+  .selected {
+    color: mat.get-theme-color($theme, secondary, 0);
+    background-color: mat.get-theme-color($theme, secondary, 80);
+  }
+}
+
+@mixin theme($theme) {
+  @if mat.theme-has($theme, color) {
+    @include color($theme);
+  }
+}
diff --git a/src/assets/themes/openlp-dark-theme.scss b/src/assets/themes/openlp-dark-theme.scss
new file mode 100644
index 0000000..da0411c
--- /dev/null
+++ b/src/assets/themes/openlp-dark-theme.scss
@@ -0,0 +1,144 @@
+// This file was generated by running 'ng generate @angular/material:m3-theme'.
+// Proceed with caution if making changes to this file.
+
+@use 'sass:map';
+@use '@angular/material' as mat;
+
+// Note: Color palettes are generated from primary: #1E468C
+$_palettes: (
+  primary: (
+    0: #000000,
+    10: #001a43,
+    20: #002d6c,
+    25: #003882,
+    30: #15448f,
+    35: #26509b,
+    40: #345ca8,
+    50: #4f75c3,
+    60: #6a8fdf,
+    70: #85aafc,
+    80: #afc6ff,
+    90: #d9e2ff,
+    95: #edf0ff,
+    98: #faf9ff,
+    99: #fefbff,
+    100: #ffffff,
+  ),
+  secondary: (
+    0: #000000,
+    10: #141b2c,
+    20: #293042,
+    25: #343b4d,
+    30: #3f4759,
+    35: #4b5265,
+    40: #575e71,
+    50: #70778b,
+    60: #8990a5,
+    70: #a4abc0,
+    80: #bfc6dc,
+    90: #dbe2f9,
+    95: #edf0ff,
+    98: #faf9ff,
+    99: #fefbff,
+    100: #ffffff,
+  ),
+  tertiary: (
+    0: #000000,
+    10: #2a132d,
+    20: #402843,
+    25: #4c324e,
+    30: #583e5a,
+    35: #654966,
+    40: #725573,
+    50: #8c6d8c,
+    60: #a786a7,
+    70: #c3a0c2,
+    80: #dfbbde,
+    90: #fcd7fb,
+    95: #ffebfb,
+    98: #fff7fa,
+    99: #fffbff,
+    100: #ffffff,
+  ),
+  neutral: (
+    0: #000000,
+    10: #1b1b1f,
+    20: #303034,
+    25: #3b3b3f,
+    30: #46464a,
+    35: #525256,
+    40: #5e5e62,
+    50: #77777a,
+    60: #919094,
+    70: #acabaf,
+    80: #c7c6ca,
+    90: #e3e2e6,
+    95: #f2f0f4,
+    98: #fbf8fd,
+    99: #fefbff,
+    100: #ffffff,
+    4: #0d0e11,
+    6: #121316,
+    12: #1f1f23,
+    17: #292a2d,
+    22: #343538,
+    24: #38393c,
+    87: #dbd9dd,
+    92: #e9e7ec,
+    94: #efedf1,
+    96: #f5f3f7,
+  ),
+  neutral-variant: (
+    0: #000000,
+    10: #191b23,
+    20: #2e3038,
+    25: #393b43,
+    30: #44474f,
+    35: #50525a,
+    40: #5c5e67,
+    50: #757780,
+    60: #8f9099,
+    70: #a9abb4,
+    80: #c5c6d0,
+    90: #e1e2ec,
+    95: #eff0fa,
+    98: #faf9ff,
+    99: #fefbff,
+    100: #ffffff,
+  ),
+  error: (
+    0: #000000,
+    10: #410002,
+    20: #690005,
+    25: #7e0007,
+    30: #93000a,
+    35: #a80710,
+    40: #ba1a1a,
+    50: #de3730,
+    60: #ff5449,
+    70: #ff897d,
+    80: #ffb4ab,
+    90: #ffdad6,
+    95: #ffedea,
+    98: #fff8f7,
+    99: #fffbff,
+    100: #ffffff,
+  ),
+);
+
+$_rest: (
+  secondary: map.get($_palettes, secondary),
+  neutral: map.get($_palettes, neutral),
+  neutral-variant: map.get($_palettes,  neutral-variant),
+  error: map.get($_palettes, error),
+);
+$_primary: map.merge(map.get($_palettes, primary), $_rest);
+$_tertiary: map.merge(map.get($_palettes, tertiary), $_rest);
+
+$dark-theme: mat.define-theme((
+  color: (
+    theme-type: dark,
+    primary: $_primary,
+    tertiary: $_tertiary,
+  ),
+));
\ No newline at end of file
diff --git a/src/styles.scss b/src/styles.scss
index 7b7b969..019b0dd 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -1,7 +1,10 @@
 /* You can add global styles to this file, and also import other style files */
 @use '@angular/material' as mat;
 @use './assets/themes/openlp-light-theme.scss';
+@use './assets/themes/openlp-dark-theme.scss';
 @use './assets/themes/_header-theme.scss' as header;
+@use './assets/themes/_fast-switcher-theme.scss' as fast-switcher;
+@use './assets/themes/_slide-item-theme.scss' as slide-item;
 @include mat.core();
 
 * {
@@ -9,10 +12,18 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
-body {
+.dark-theme {
+  @include mat.all-component-colors(openlp-dark-theme.$dark-theme);
+  @include header.theme(openlp-dark-theme.$dark-theme);
+  @include fast-switcher.theme(openlp-dark-theme.$dark-theme);
+  @include slide-item.theme(openlp-dark-theme.$dark-theme);
+}
+
+html {
   @include mat.all-component-themes(openlp-light-theme.$light-theme);
   @include header.theme(openlp-light-theme.$light-theme);
-  font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif;
+  @include fast-switcher.theme(openlp-light-theme.$light-theme);
+  @include slide-item.theme(openlp-light-theme.$light-theme);
 }
 
 html,
@@ -21,20 +32,16 @@ body {
   padding: 0;
 }
 
+body {
+  font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif;
+}
+
 app-root {
   display: flex;
   flex-direction: column;
   min-height: 100vh;
 }
 
-mat-sidenav-layout {
-  background: rgba(0, 0, 0, 0.03);
-}
-
-mat-sidenav {
-  width: 12rem;
-}
-
 .mat-mdc-card {
   margin-bottom: 1rem;
 }
@@ -44,10 +51,6 @@ mat-sidenav {
   cursor: pointer;
 }
 
-.displayButton .active {
-  background: 'teal';
-}
-
 .page-title {
   margin-left: 1rem;
 }
@@ -61,6 +64,7 @@ footer {
   bottom: 0;
   left: 0;
   right: 0;
+  z-index: 1;
 }
 
 .chordline {
@@ -113,16 +117,3 @@ footer {
     z-index: 1200;
   }
 }
-
-footer {
-  z-index: 1;
-}
-
-// This rule is to avoid the left menu scrolling with the page itself.
-.mat-drawer.mat-sidenav {
-  position: fixed;
-  padding-top: 64px;
-  @media screen and (max-width: 600px) {
-    padding-top: 56px; 
-  }
-}
diff --git a/yarn.lock b/yarn.lock
index 08ccb3e..f2ed980 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10,24 +10,24 @@
     "@jridgewell/gen-mapping" "^0.3.5"
     "@jridgewell/trace-mapping" "^0.3.24"
 
-"@angular-devkit/architect@0.1800.3":
-  version "0.1800.3"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/architect/-/architect-0.1800.3.tgz#00a8819f35d15220c50b13b35addf7ab547f4745"
-  integrity sha512-ZoQuvCN/Ft4XJ+/XouYFKGoyEYTfZ8I5yI1M4t19lkRb3MwpQribWcZu4PP+SNnS6/9qnW7guxiQGS+CVlqnDg==
+"@angular-devkit/architect@0.1800.4":
+  version "0.1800.4"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/architect/-/architect-0.1800.4.tgz#b7654608b656dad19c1c1028370f02a20fd0f1f7"
+  integrity sha512-82TKhYnSO8aGIBo5TxPtyUQnZFcbV+qB2bIIYOAKsJgxAVxLeFD6QA6gTmHOZPXw5pBEPUO/+PUwq+Uk5xesgw==
   dependencies:
-    "@angular-devkit/core" "18.0.3"
+    "@angular-devkit/core" "18.0.4"
     rxjs "7.8.1"
 
-"@angular-devkit/build-angular@^18.0.3":
-  version "18.0.3"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/build-angular/-/build-angular-18.0.3.tgz#9af701596c4e8ab7d20034af25ebee6dd8f24848"
-  integrity sha512-TTYPtQPqpI7V5H44oBqpPCYjwycWplOfhx/rjxDcrdGITYJF18rzwJs6mFx2QMBZl+99YYhxDajRCq05UDRQrw==
+"@angular-devkit/build-angular@^18.0.4":
+  version "18.0.4"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/build-angular/-/build-angular-18.0.4.tgz#4f9b7577fc3409422574a05aff7fe4a7bdae55ee"
+  integrity sha512-lFu1NDEUPIUxY+CmZJ3JspqVZDesrvdae5RbqQXCl87RfSy+ZDIa7rOtQxyBQtt2BuQIB9pWQSzCMii5kTHd6w==
   dependencies:
     "@ampproject/remapping" "2.3.0"
-    "@angular-devkit/architect" "0.1800.3"
-    "@angular-devkit/build-webpack" "0.1800.3"
-    "@angular-devkit/core" "18.0.3"
-    "@angular/build" "18.0.3"
+    "@angular-devkit/architect" "0.1800.4"
+    "@angular-devkit/build-webpack" "0.1800.4"
+    "@angular-devkit/core" "18.0.4"
+    "@angular/build" "18.0.4"
     "@babel/core" "7.24.5"
     "@babel/generator" "7.24.5"
     "@babel/helper-annotate-as-pure" "7.22.5"
@@ -38,7 +38,7 @@
     "@babel/preset-env" "7.24.5"
     "@babel/runtime" "7.24.5"
     "@discoveryjs/json-ext" "0.5.7"
-    "@ngtools/webpack" "18.0.3"
+    "@ngtools/webpack" "18.0.4"
     "@vitejs/plugin-basic-ssl" "1.1.0"
     ansi-colors "4.1.3"
     autoprefixer "10.4.19"
@@ -90,18 +90,18 @@
   optionalDependencies:
     esbuild "0.21.3"
 
-"@angular-devkit/build-webpack@0.1800.3":
-  version "0.1800.3"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/build-webpack/-/build-webpack-0.1800.3.tgz#a4d606a5b7000b6a2689066f6697e2a52b55a91b"
-  integrity sha512-qasDZI28gNsYTOWwJHoFZlVAyw47qlCXbPEma0VDCukZe5XX8RoZnN5ZA9nC8xpqKQ5pzJnPk7rAqa0dsEt9Xg==
+"@angular-devkit/build-webpack@0.1800.4":
+  version "0.1800.4"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/build-webpack/-/build-webpack-0.1800.4.tgz#b6c35cf8c3fb89ce58e17d6a7b9c5227614bfed2"
+  integrity sha512-EtWyWH3Hb7Rh8u0Jb4cWJKRxlqiUo4qhHKjU+62E8XplWlajbuld3ltL50a3t8lkZQYYgl7nPt53E5kM/zFVrw==
   dependencies:
-    "@angular-devkit/architect" "0.1800.3"
+    "@angular-devkit/architect" "0.1800.4"
     rxjs "7.8.1"
 
-"@angular-devkit/core@18.0.3", "@angular-devkit/core@^18.0.3":
-  version "18.0.3"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-18.0.3.tgz#952c984609f7062529bf9bc6dddd0224edc3d697"
-  integrity sha512-nTs1KbNSVCVooPdDaeTh1YbggNVaqexbQjXNIvJJzRB8qPkWNPxm0pQeFjU7kWUBg2+aBXN4/CNwU1YHwxfiSQ==
+"@angular-devkit/core@18.0.4", "@angular-devkit/core@^18.0.4":
+  version "18.0.4"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-18.0.4.tgz#d23d242a7affad900a7682e89a1951bb963a06dc"
+  integrity sha512-8vYvJ5FF2NjFUia00hv8KWakOjOZ+09PbnNqd+lntJBekIg1lHDOF/vNMlVHtU5LiE1aNi9P/69/VXTckPfU9g==
   dependencies:
     ajv "8.13.0"
     ajv-formats "3.0.1"
@@ -110,12 +110,12 @@
     rxjs "7.8.1"
     source-map "0.7.4"
 
-"@angular-devkit/schematics@18.0.3", "@angular-devkit/schematics@^18.0.3":
-  version "18.0.3"
-  resolved "https://registry.yarnpkg.com/@angular-devkit/schematics/-/schematics-18.0.3.tgz#2ce071a8cdaac5fefcba5a90b5fdb38ca5cdcc59"
-  integrity sha512-utKGk9KHTvLsxpga3aaGJ7HDggMhZtBOHFb8phFK/GXazaeEGDvm7Sin2it2uw/i9xvu79RQ/IrWvebhanwU1g==
+"@angular-devkit/schematics@18.0.4", "@angular-devkit/schematics@^18.0.4":
+  version "18.0.4"
+  resolved "https://registry.yarnpkg.com/@angular-devkit/schematics/-/schematics-18.0.4.tgz#467e877ef0b72eea999947eb2eb31aed6065288f"
+  integrity sha512-hCHmuu/Z1teOQPx1AMJa/gcK6depk+XgU5dIpEvflC+ApW3hglNe2QKaqajDZ+34s+PKAVWa86M8IOV7o/mHuA==
   dependencies:
-    "@angular-devkit/core" "18.0.3"
+    "@angular-devkit/core" "18.0.4"
     jsonc-parser "3.2.1"
     magic-string "0.30.10"
     ora "5.4.1"
@@ -180,20 +180,20 @@
   dependencies:
     "@angular-eslint/bundled-angular-compiler" "18.0.1"
 
-"@angular/animations@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/animations/-/animations-18.0.2.tgz#8a3e91c4501418a69fe9dcd2df0f9bdf1c860d23"
-  integrity sha512-WhsotLl74UlRZZE9R7X3BXeNm1YOD1hUMOuGCa20pvUZ8X6ayz5c8B7tc/BZ0ua/9UkyZzbdMTEDi8JPDPPTew==
+"@angular/animations@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/animations/-/animations-18.0.3.tgz#cd7153fb1d3fd3cde4a4ba8feae229a74bde0e0c"
+  integrity sha512-Wlll6y7euIXYsOHpTh0hvVTBs7lVnbKDHiyd4Dz7kAMSeE2zyQo6OcRN+FFH3GH9BUi5UooAICNX8dJDfps6Mw==
   dependencies:
     tslib "^2.3.0"
 
-"@angular/build@18.0.3":
-  version "18.0.3"
-  resolved "https://registry.yarnpkg.com/@angular/build/-/build-18.0.3.tgz#3ab2c45c8ff5865e8a4f84f42de1c53b837f4409"
-  integrity sha512-AvyySRuNkmnMxKcoPs6NuddLaCVUWnoGnPmqqd1YY3mT/yxShorIZyrJ1loxzveIcgFJ65qDPGPhIfK7KxysYQ==
+"@angular/build@18.0.4":
+  version "18.0.4"
+  resolved "https://registry.yarnpkg.com/@angular/build/-/build-18.0.4.tgz#cbdda7a1713096bd5b7d25cd3fdd270446470f2f"
+  integrity sha512-70HQQnbCOXFT5F3ROyWNNfS9A63Fzts5ANJKJY1MJLrn+dgNEG7jdIWjTtvohL3RZz97rlzSq3qRZnfxqf1lsQ==
   dependencies:
     "@ampproject/remapping" "2.3.0"
-    "@angular-devkit/architect" "0.1800.3"
+    "@angular-devkit/architect" "0.1800.4"
     "@babel/core" "7.24.5"
     "@babel/helper-annotate-as-pure" "7.22.5"
     "@babel/helper-split-export-declaration" "7.24.5"
@@ -218,24 +218,24 @@
     vite "5.2.11"
     watchpack "2.4.1"
 
-"@angular/cdk@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/cdk/-/cdk-18.0.2.tgz#2c21b4546885f65f783efae3135fe191232a30d3"
-  integrity sha512-KQTfi17PV/DYg8UcsoF9Jxfz+3nCPImm5eY1Mq7wGK8qUOlw9Y8fZ3eNU9ZH4hdg2FcKXJrAJqSA7I2nqdSX7w==
+"@angular/cdk@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/cdk/-/cdk-18.0.3.tgz#498dfd79bc6e846bc6cfb348d967a3a1b7354fc0"
+  integrity sha512-F6kXAoIWUbvhvbSGnMxrKJZsI7rhGKDXVFFf9m+ZQAbqboSyDbbszux7Em4CEh27LaXYNFltUcKdCQ3hdp7Kig==
   dependencies:
     tslib "^2.3.0"
   optionalDependencies:
     parse5 "^7.1.2"
 
-"@angular/cli@~18.0.3":
-  version "18.0.3"
-  resolved "https://registry.yarnpkg.com/@angular/cli/-/cli-18.0.3.tgz#05e6c68b3af3e81b55a6216ae1198c2bf77a2dcd"
-  integrity sha512-1i51QeLwLpIdBbwOANSLFAuqXOGRpvSHCuZo1SojkvZ1COZ5jJZoCaKRZzCFsA/16gv/jcTEfBGpoAXLC2lRog==
+"@angular/cli@~18.0.4":
+  version "18.0.4"
+  resolved "https://registry.yarnpkg.com/@angular/cli/-/cli-18.0.4.tgz#c1da24fedf79303cebd1895028c9f80badc7bb44"
+  integrity sha512-i7DLVIc4HN0CFZZKbEeVeQSADRG1Dt2CwXh/wTUzglRLu/tE7Q+WMrqJ2+lGTT2edZp2KKysM4Gxp+ATAzP8AQ==
   dependencies:
-    "@angular-devkit/architect" "0.1800.3"
-    "@angular-devkit/core" "18.0.3"
-    "@angular-devkit/schematics" "18.0.3"
-    "@schematics/angular" "18.0.3"
+    "@angular-devkit/architect" "0.1800.4"
+    "@angular-devkit/core" "18.0.4"
+    "@angular-devkit/schematics" "18.0.4"
+    "@schematics/angular" "18.0.4"
     "@yarnpkg/lockfile" "1.1.0"
     ansi-colors "4.1.3"
     ini "4.1.2"
@@ -250,19 +250,19 @@
     symbol-observable "4.0.0"
     yargs "17.7.2"
 
-"@angular/common@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/common/-/common-18.0.2.tgz#b4a3297718096465093faafddc9d43f609e1b2d1"
-  integrity sha512-7CK5sFptUFWE3ZrKl8MjgoKjYKC20SN089F4xQIYtP2qM3IoJH/X7qa+5Eidk4PovS1SuCJHrB5AoREWwtWJHA==
+"@angular/common@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/common/-/common-18.0.3.tgz#5f72d9fc55f549a30fee8bfd758ad6827db94164"
+  integrity sha512-lmT9QbWHduqzpsB0osQFHeSwvQB1iUeNwTVUyMtcs6i46l4qOPtAt2/9DvHUWEUp01EBDxyi385ZI3vD+FHH/w==
   dependencies:
     tslib "^2.3.0"
 
-"@angular/compiler-cli@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/compiler-cli/-/compiler-cli-18.0.2.tgz#3d130d13ae89976d347dcc2865826ae7b1b9a2ff"
-  integrity sha512-+HIYJ0WIAg75mS30KzCN9gO2SeZXF4A8CeKOwBKhIvlq9kkaTpgmpDkVx814e9z3OeIqCEUn10qebJTwZgtZDA==
+"@angular/compiler-cli@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/compiler-cli/-/compiler-cli-18.0.3.tgz#ab2c5981d4fa5920976e43203d5d118fa812be6a"
+  integrity sha512-mxwQEeP94YBM6C9A2YfkV7ug1sHgh0fU/TSBpQcm5ni4cZiVPu6q/+Ft7hyFTKe2p3tKQme33+xVjsWhtOCx0A==
   dependencies:
-    "@babel/core" "7.24.4"
+    "@babel/core" "7.24.7"
     "@jridgewell/sourcemap-codec" "^1.4.14"
     chokidar "^3.0.0"
     convert-source-map "^1.5.1"
@@ -271,36 +271,36 @@
     tslib "^2.3.0"
     yargs "^17.2.1"
 
-"@angular/compiler@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/compiler/-/compiler-18.0.2.tgz#a71dff6ed00e9ad6c09052be2b62586befb703d1"
-  integrity sha512-9PKi++yKq3SvsTteZAhAJsiueEWzl64SpIBwooWRaSav6Jfl9Y2+b46SXTdAIuNdcGNW7ZeDZbPK3RPtxsROrA==
+"@angular/compiler@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/compiler/-/compiler-18.0.3.tgz#814653d412e1dd6948f97f24d6506b3bd0f9af47"
+  integrity sha512-wrXxgBsZX4yTrj/oZ8PDGmvhqj9S2TZfcuivaUitprNC2uBWTVb1UcOS45Qw9YlLB0sYa2AmBudICDqYpb8lfw==
   dependencies:
     tslib "^2.3.0"
 
-"@angular/core@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/core/-/core-18.0.2.tgz#b9f14ac3458f978f7a6f6ae4072d179f291099d7"
-  integrity sha512-5VtFaYz97X9sQpxRuFUBKu2gqgFVU/Obgk/Q8ZRw+TBhFnU4e9NFod7dtAJH9scCOWZYnU07+aeI6ChiRSKrZw==
+"@angular/core@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/core/-/core-18.0.3.tgz#9de529e9a25e0197bb8aa1ac8d74439bad71e942"
+  integrity sha512-376hijhEqNpeA+qKncpVTIaZXRdBT6RctEBnFhJ2l57aHPH5S3oaSBQu1k3TEi07FlKOD4XF1+NzX9dvdup1eg==
   dependencies:
     tslib "^2.3.0"
 
-"@angular/forms@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/forms/-/forms-18.0.2.tgz#b5c7b0f8d2cdf9c9f979cbee9e9b69df920f6031"
-  integrity sha512-AGuQVav7wbX6pRhjeE6c45dlWnhb+93ZHHBRT02Wg1PRyrgmebpoLAtiUmAR/YhR45zD6Q9o7fg/076+bnIcdQ==
+"@angular/forms@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/forms/-/forms-18.0.3.tgz#3f3c66fb90d35a6140efa82c8b3fa6140414c967"
+  integrity sha512-+CjDiooUi5FkTP3YQmdO8YRbjZicgLGZonvCdz3mSucLrTY6w3oBocNs6+Kc7fLuO1NKSkFmAfYApBwK3fKBMg==
   dependencies:
     tslib "^2.3.0"
 
-"@angular/language-service@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/language-service/-/language-service-18.0.2.tgz#c57b493a517b4115ae483290f28300d66734cca0"
-  integrity sha512-A1M7yhahQyO/SX7yoAMwJfhxQP4OisKh9wuq/Hqqzquxpmvfuibt5DejlUfHzvFjWjJsuQJa2h+zIb4QYZLWDQ==
+"@angular/language-service@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/language-service/-/language-service-18.0.3.tgz#f95567843b28facc62f0ea6125c96c186e053cdc"
+  integrity sha512-urENnMjhSO4Jia7CnbchqN236dOIU6TC3CazwsQoj1Odch9x+iSFkx9Y0jXsiR5r/suK4uqKpK5N8MJ1PxDG1g==
 
-"@angular/material@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/material/-/material-18.0.2.tgz#d2183aabe2425c141e0cde84fc0094678d2a58cb"
-  integrity sha512-bns6X6HAonBnj+I0QkbqfD4u5ehs8HZP3ateb19ZbfhVLJEu0MB/AJfeM3cinPrQnTMdYBjIDTtIyQWh//EFiw==
+"@angular/material@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/material/-/material-18.0.3.tgz#9760a332badd9140464278822825f12b396f8a52"
+  integrity sha512-VIlK+0CxreAkDmr05TKelTr11I7yUtGPwRTFaWfQtXNkYEwGE1iuZGz3Iz8otxvHsTLC74Er4vMSYndwJvMyjQ==
   dependencies:
     "@material/animation" "15.0.0-canary.7f224ddd4.0"
     "@material/auto-init" "15.0.0-canary.7f224ddd4.0"
@@ -352,24 +352,24 @@
     "@material/typography" "15.0.0-canary.7f224ddd4.0"
     tslib "^2.3.0"
 
-"@angular/platform-browser-dynamic@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/platform-browser-dynamic/-/platform-browser-dynamic-18.0.2.tgz#0da556fcba7db0044c75b1a043d2281a6c78345b"
-  integrity sha512-wQlw3TgUEs5uZRT6mPIKFHCgOBDE4joar9b/0bjZv5SOUvJNkED+roNlRKxjQDIagOMAUlcD3OnynlNr6le6YA==
+"@angular/platform-browser-dynamic@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/platform-browser-dynamic/-/platform-browser-dynamic-18.0.3.tgz#5f5854a31691519a2e6bf032135ebe5c1f3f82a8"
+  integrity sha512-+kHMn7P552YKk1gkVQNO1QXzHVaIeFiVa1rV1MNvX4DvumKT3puknx1SzcmtxZTX+9ee22OuPuyLNSAKREDAQQ==
   dependencies:
     tslib "^2.3.0"
 
-"@angular/platform-browser@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/platform-browser/-/platform-browser-18.0.2.tgz#ef10cb33b13e2e8fc962e0f8e13adc3fdb049973"
-  integrity sha512-IdNyRMFtM5GCvueNFrXmwA1C5LUMi6aSccdA1fpsTFAGDleeT5oiKU82iIcVmdj+Kse233KQFU0HFyijy4W2/Q==
+"@angular/platform-browser@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/platform-browser/-/platform-browser-18.0.3.tgz#be94b2e3a9afedc06559de0f3177c926facdf6d7"
+  integrity sha512-1fl/oJOca8BLxLxN0EjwxQZ3xzn3PCCN96ytM54bjdEMiELz+0AcQe5GNKcVjXlwMkibRLl1BP5GIdvnQYqJRA==
   dependencies:
     tslib "^2.3.0"
 
-"@angular/router@^18.0.2":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@angular/router/-/router-18.0.2.tgz#d1917e903791ab88f3c321e237dfd69c59caa996"
-  integrity sha512-eIualVChd3bMA8GjKfAKL9wv7zKWx85Cu3b1qhUxrG3XyT40X1ud2GRHBKCuklUITcAR8HjUKnWuOjUDkhTT4Q==
+"@angular/router@^18.0.3":
+  version "18.0.3"
+  resolved "https://registry.yarnpkg.com/@angular/router/-/router-18.0.3.tgz#f467a7d6dafec21f54dd82f640ea239067344f31"
+  integrity sha512-/cglLev0USxUNMc4M+EBFGrqw1EpKq87LUJL3+0Ztr012sVSeOU38ad41fs6pPcMBePBDZIw7KmSXypvUJJFMA==
   dependencies:
     tslib "^2.3.0"
 
@@ -386,27 +386,6 @@
   resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.24.7.tgz#d23bbea508c3883ba8251fb4164982c36ea577ed"
   integrity sha512-qJzAIcv03PyaWqxRgO4mSU3lihncDT296vnyuE2O8uA4w3UHWI4S3hgeZd1L8W1Bft40w9JxJ2b412iDUFFRhw==
 
-"@babel/core@7.24.4":
-  version "7.24.4"
-  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.24.4.tgz#1f758428e88e0d8c563874741bc4ffc4f71a4717"
-  integrity sha512-MBVlMXP+kkl5394RBLSxxk/iLTeVGuXTV3cIDXavPpMMqnSnt6apKgan/U8O3USWZCWZT/TbgfEpKa4uMgN4Dg==
-  dependencies:
-    "@ampproject/remapping" "^2.2.0"
-    "@babel/code-frame" "^7.24.2"
-    "@babel/generator" "^7.24.4"
-    "@babel/helper-compilation-targets" "^7.23.6"
-    "@babel/helper-module-transforms" "^7.23.3"
-    "@babel/helpers" "^7.24.4"
-    "@babel/parser" "^7.24.4"
-    "@babel/template" "^7.24.0"
-    "@babel/traverse" "^7.24.1"
-    "@babel/types" "^7.24.0"
-    convert-source-map "^2.0.0"
-    debug "^4.1.0"
-    gensync "^1.0.0-beta.2"
-    json5 "^2.2.3"
-    semver "^6.3.1"
-
 "@babel/core@7.24.5":
   version "7.24.5"
   resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.24.5.tgz#15ab5b98e101972d171aeef92ac70d8d6718f06a"
@@ -428,7 +407,7 @@
     json5 "^2.2.3"
     semver "^6.3.1"
 
-"@babel/core@^7.12.3":
+"@babel/core@7.24.7", "@babel/core@^7.12.3":
   version "7.24.7"
   resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.24.7.tgz#b676450141e0b52a3d43bc91da86aa608f950ac4"
   integrity sha512-nykK+LEK86ahTkX/3TgauT0ikKoNCfKHEaZYTUVupJdTLzGNvrblu4u6fa7DhZONAltdf8e662t/abY8idrd/g==
@@ -459,7 +438,7 @@
     "@jridgewell/trace-mapping" "^0.3.25"
     jsesc "^2.5.1"
 
-"@babel/generator@^7.24.4", "@babel/generator@^7.24.5", "@babel/generator@^7.24.7":
+"@babel/generator@^7.24.5", "@babel/generator@^7.24.7":
   version "7.24.7"
   resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.24.7.tgz#1654d01de20ad66b4b4d99c135471bc654c55e6d"
   integrity sha512-oipXieGC3i45Y1A41t4tAqpnEZWgB/lC6Ehh6+rOviR5XWpTtMmLN+fGjz9vOiNRt0p6RtO6DtD0pdU3vpqdSA==
@@ -575,7 +554,7 @@
     "@babel/traverse" "^7.24.7"
     "@babel/types" "^7.24.7"
 
-"@babel/helper-module-transforms@^7.23.3", "@babel/helper-module-transforms@^7.24.5", "@babel/helper-module-transforms@^7.24.7":
+"@babel/helper-module-transforms@^7.24.5", "@babel/helper-module-transforms@^7.24.7":
   version "7.24.7"
   resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.24.7.tgz#31b6c9a2930679498db65b685b1698bfd6c7daf8"
   integrity sha512-1fuJEwIrp+97rM4RWdO+qrRsZlAeL1lQJoPqtCYWv0NL115XM93hIH4CSRln2w52SqvmY5hqdtauB6QFCDiZNQ==
@@ -671,7 +650,7 @@
     "@babel/traverse" "^7.24.7"
     "@babel/types" "^7.24.7"
 
-"@babel/helpers@^7.24.4", "@babel/helpers@^7.24.5", "@babel/helpers@^7.24.7":
+"@babel/helpers@^7.24.5", "@babel/helpers@^7.24.7":
   version "7.24.7"
   resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.24.7.tgz#aa2ccda29f62185acb5d42fb4a3a1b1082107416"
   integrity sha512-NlmJJtvcw72yRJRcnCmGvSi+3jDEg8qFu3z0AFoymmzLx5ERVWyzd9kVXr7Th9/8yIJi2Zc6av4Tqz3wFs8QWg==
@@ -689,7 +668,7 @@
     js-tokens "^4.0.0"
     picocolors "^1.0.0"
 
-"@babel/parser@^7.14.7", "@babel/parser@^7.24.4", "@babel/parser@^7.24.5", "@babel/parser@^7.24.7":
+"@babel/parser@^7.14.7", "@babel/parser@^7.24.5", "@babel/parser@^7.24.7":
   version "7.24.7"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.24.7.tgz#9a5226f92f0c5c8ead550b750f5608e766c8ce85"
   integrity sha512-9uUYRm6OqQrCqQdG1iCBwBPZgN8ciDBro2nIOFaiRz1/BCxaI7CNvQbDHvsArAC7Tw9Hda/B3U+6ui9u4HWXPw==
@@ -1400,7 +1379,7 @@
     "@babel/parser" "^7.24.7"
     "@babel/types" "^7.24.7"
 
-"@babel/traverse@^7.24.1", "@babel/traverse@^7.24.5", "@babel/traverse@^7.24.7":
+"@babel/traverse@^7.24.5", "@babel/traverse@^7.24.7":
   version "7.24.7"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.24.7.tgz#de2b900163fa741721ba382163fe46a936c40cf5"
   integrity sha512-yb65Ed5S/QAcewNPh0nZczy9JdYXkkAbIsEo+P7BE7yO3txAY30Y/oPa3QkQ5It3xVG2kpKMg9MsdxZaO31uKA==
@@ -1416,7 +1395,7 @@
     debug "^4.3.1"
     globals "^11.1.0"
 
-"@babel/types@^7.22.5", "@babel/types@^7.24.0", "@babel/types@^7.24.5", "@babel/types@^7.24.7", "@babel/types@^7.4.4":
+"@babel/types@^7.22.5", "@babel/types@^7.24.5", "@babel/types@^7.24.7", "@babel/types@^7.4.4":
   version "7.24.7"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.24.7.tgz#6027fe12bc1aa724cd32ab113fb7f1988f1f66f2"
   integrity sha512-XEFXSlxiG5td2EJRe8vOmRbaXVgfcBlszKujvVmWIK/UpywWljQCfzAv3RQCGujWQ1RD4YYWEAqDXfuJiy8f5Q==
@@ -2646,10 +2625,10 @@
   resolved "https://registry.yarnpkg.com/@msgpackr-extract/msgpackr-extract-win32-x64/-/msgpackr-extract-win32-x64-3.0.3.tgz#0aa5502d547b57abfc4ac492de68e2006e417242"
   integrity sha512-x0fWaQtYp4E6sktbsdAqnehxDgEc/VwM7uLsRCYWaiGu0ykYdZPiS8zCWdnjHwyiumousxfBm4SO31eXqwEZhQ==
 
-"@ngtools/webpack@18.0.3":
-  version "18.0.3"
-  resolved "https://registry.yarnpkg.com/@ngtools/webpack/-/webpack-18.0.3.tgz#431726434c1e85bd646b9f074fa23f50c65ef8ea"
-  integrity sha512-wYskgAomDgyBJ8fsP+jfb0rt1t5OpNx4EXEzZo37Nxb04P5CkW+9yQ/xuhPMF8hO/dfKL1k/BKAKUeOOUQmAIA==
+"@ngtools/webpack@18.0.4":
+  version "18.0.4"
+  resolved "https://registry.yarnpkg.com/@ngtools/webpack/-/webpack-18.0.4.tgz#38abce438484a56adec602629a21baf7bf85c94d"
+  integrity sha512-eWQkAuHEnLme01Ey4Z0FoG6upJHYhnJfsCTBnyEB2LTfdyBUk+PC0gwPXInK8oltWjFfiMnCwxrUQvQsvPW7Hg==
 
 "@ngx-translate/core@^15.0.0":
   version "15.0.0"
@@ -2764,27 +2743,27 @@
     proc-log "^4.0.0"
     which "^4.0.0"
 
-"@nrwl/devkit@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nrwl/devkit/-/devkit-19.2.2.tgz#64bad4d05408f9e12055691ae4bc8d8493d97fee"
-  integrity sha512-NWB3OAm6/oHaF2h7isUXpK9J2XF097mfaiENHj1GzH9JwjB2YoFaD7v033er6+Hb6FEZtOPZpVH1kEQjVaYJLA==
+"@nrwl/devkit@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nrwl/devkit/-/devkit-19.3.0.tgz#7520d658218df89d33792813e5d03546b72b8a12"
+  integrity sha512-WRcph/7U37HkTLIRzQ2oburZVfEFkPHJUn7vmo46gCq+N2cAKy3qwONO0RbthhjFIsG94YPXqFWFlV6k4nXpxA==
   dependencies:
-    "@nx/devkit" "19.2.2"
+    "@nx/devkit" "19.3.0"
 
-"@nrwl/tao@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nrwl/tao/-/tao-19.2.2.tgz#c1d2ce76d640c382e09f7833e1bd61705d46b6f1"
-  integrity sha512-G/m3EGXf3m9rM2sQQGpRPD40gfaWR6jFVCsZW66/6FXDo1dMUH5/U5JOBnD6vBdug8txKA1ceWHM74NkAB1QEg==
+"@nrwl/tao@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nrwl/tao/-/tao-19.3.0.tgz#3acd1f957af975655fbea7ecfc5ade8409e97e15"
+  integrity sha512-MyGYeHbh9O4Tv9xmz3Du+/leY5sKUHaPy4ancfNyShHgYi21hemX0/YYjzzoYHi44D8GzSc1XG2rAuwba7Kilw==
   dependencies:
-    nx "19.2.2"
+    nx "19.3.0"
     tslib "^2.3.0"
 
-"@nx/devkit@19.2.2", "@nx/devkit@^19.0.6":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/devkit/-/devkit-19.2.2.tgz#ddc2dfbccd0f160e935d83ed82fe401567b7b91b"
-  integrity sha512-6y+th5m1qVc+B0lXmKb3WRcfwNYD2B/bqGn1HiKLu8g6DDVJFn0mT+a872e4OtvgHyubZQm3HnPfjXobChpRuw==
+"@nx/devkit@19.3.0", "@nx/devkit@^19.0.6":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/devkit/-/devkit-19.3.0.tgz#d26abf0ff4a875cfdfdd6292e9a7abad3c57066b"
+  integrity sha512-Natya5nzvHH0qTOIL1w/EZtwMgDx87Dgz0LgeY7te2fULaNFcj5fVrP+mUKEJZR+NccO7GPumT2RPhuEl9rPnQ==
   dependencies:
-    "@nrwl/devkit" "19.2.2"
+    "@nrwl/devkit" "19.3.0"
     ejs "^3.1.7"
     enquirer "~2.3.6"
     ignore "^5.0.4"
@@ -2794,55 +2773,55 @@
     tslib "^2.3.0"
     yargs-parser "21.1.1"
 
-"@nx/nx-darwin-arm64@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/nx-darwin-arm64/-/nx-darwin-arm64-19.2.2.tgz#d643b79e1e2181f369f5449f62bd2a67cee7162d"
-  integrity sha512-AgvsZ0iDA0rklH0TqOIiTrbJysn7WfFFzhLYd1JnxS2Z3GAFPRoE6TxRSSqpTBmFqskrZhZyrjHllOoBD5odFQ==
+"@nx/nx-darwin-arm64@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/nx-darwin-arm64/-/nx-darwin-arm64-19.3.0.tgz#1bebc5c820af797768cd38dd859f3adab73d763a"
+  integrity sha512-TMTxjrN7Y/UsKFjmz0YfhVItLTGWqvud8cmQchw5NEjdNakfjXk0mREufO5/5PwoiRIsen6MbThoTprLpjOUiQ==
 
-"@nx/nx-darwin-x64@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/nx-darwin-x64/-/nx-darwin-x64-19.2.2.tgz#231a83ae12be56f1ae93803b87ebd2abe08513bb"
-  integrity sha512-YPd9Kmn5/YPYolBVYoficQmp8LFTe/PAI3dQ3NebOGFYw49PFmV0cdB8+4m0q70WCBMwyqo1x6a6MO9CvENkTg==
+"@nx/nx-darwin-x64@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/nx-darwin-x64/-/nx-darwin-x64-19.3.0.tgz#fb5773076633bb9767686eeb63c31b5fa935e8dd"
+  integrity sha512-GH2L6ftnzdIs7JEdv7ZPCdbpAdB5sW6NijK07riYZSONzq5fEruD1yDWDkyZbYBb8RTxsparUWJnq8q1qxEPHQ==
 
-"@nx/nx-freebsd-x64@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/nx-freebsd-x64/-/nx-freebsd-x64-19.2.2.tgz#e47331e2f27a4230032cad624b76967e4a13e717"
-  integrity sha512-43hMzFmYyi0aEiGa/VNXChzotL6nFG9hLSZhtpXAO6qyibSqKwlU5PjNyly/7y5gUGl7YfmdpwWwlOIYPSQoVw==
+"@nx/nx-freebsd-x64@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/nx-freebsd-x64/-/nx-freebsd-x64-19.3.0.tgz#16b9a12a3cf31c3496d336fbd30ba809c26885a3"
+  integrity sha512-1ow7Xku1yyjHviCKsWiuHCAnTd3fD+5O5c+e4DXHVthT8wnadKSotvBIWf38DMbMthl7na82e72OzxcdSbrVqQ==
 
-"@nx/nx-linux-arm-gnueabihf@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/nx-linux-arm-gnueabihf/-/nx-linux-arm-gnueabihf-19.2.2.tgz#79517e1a7bfdedbdb9c6bc4195b34bd8e097ec0b"
-  integrity sha512-locP8QQWI4NFb7kVe8Fflkpdnf9kw5o/WMROILJLFWlTy59K+NBQkpxRIhoUghJ6yckDxk1Kf2kmvV+xuX4f8Q==
+"@nx/nx-linux-arm-gnueabihf@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/nx-linux-arm-gnueabihf/-/nx-linux-arm-gnueabihf-19.3.0.tgz#387defff2e730512934ff318db1a35870d40650f"
+  integrity sha512-mYQMIUvNr2gww8vbg766uk/C1RxoC1fwioeP87bmV5NRUKSzJ8WEJVxAsqc9RGhAOUaNXOgEuKYrMcVhKyIKJQ==
 
-"@nx/nx-linux-arm64-gnu@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/nx-linux-arm64-gnu/-/nx-linux-arm64-gnu-19.2.2.tgz#ccc57e8319600330808b212af5f04b131fe0a4fc"
-  integrity sha512-uQUZs+56yplEjokgCC3Pv/nUr4v+/bCurc1v/juUH4byqCdvi+Cny7jqws49UELS+QkcTkWGBtajvf8U3JZEbQ==
+"@nx/nx-linux-arm64-gnu@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/nx-linux-arm64-gnu/-/nx-linux-arm64-gnu-19.3.0.tgz#5a3c23cbfc622d31bececfc56025e1ced14a7bfb"
+  integrity sha512-rHL3eQ0RHkeAXnhHHu/NIyouN/ykiXvgyNU3TuCd50+2MZcAbjB+Xq3mwL0MwiP+BQuptiE+snTuxFUJp4ZH6A==
 
-"@nx/nx-linux-arm64-musl@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/nx-linux-arm64-musl/-/nx-linux-arm64-musl-19.2.2.tgz#12e947ce4739aceef7229d21a503fb12f4516b00"
-  integrity sha512-rU6l18ubh0Chv7lkxshgm6o4IKduB+jztUBRR4SuOuTOLJ6okm51AqzdY+vy7esicEL3HnHWSJP/U5PwoAaNsA==
+"@nx/nx-linux-arm64-musl@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/nx-linux-arm64-musl/-/nx-linux-arm64-musl-19.3.0.tgz#a3cd9bc62a234875738298923ae63e78defc7c52"
+  integrity sha512-im0+OgOD6ShpTkI9ZRz7BjzxhQ/Lk3xjYmmCu+PFGmaybEnkNNDFwsgS0iEVKMdWZ/EQoQvJrqOYsX125iIBuQ==
 
-"@nx/nx-linux-x64-gnu@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/nx-linux-x64-gnu/-/nx-linux-x64-gnu-19.2.2.tgz#44051ad02ec7254dbe4c3b568c68c5a6db30504a"
-  integrity sha512-rvGP3p0qmzHJu8cUcYnRDyJ1BkVExgmsWmtzyQrHl48+hvNrq805NrP3gTreOxqymRlBEXg7c22fRECI1CV1lA==
+"@nx/nx-linux-x64-gnu@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/nx-linux-x64-gnu/-/nx-linux-x64-gnu-19.3.0.tgz#75f8760fd9ee2330bbb92a16517fb04a12b22b07"
+  integrity sha512-k8q/d6WBSXOeUpBq6Mw69yMKL4n9LaX3o4LBNwBkVCEZ8p6s0njwKefLtjwnKlai0g/k5f0NcilU2zTwP/Ex8g==
 
-"@nx/nx-linux-x64-musl@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/nx-linux-x64-musl/-/nx-linux-x64-musl-19.2.2.tgz#bee4d004ea74b72982e993a81817bee27e1901f4"
-  integrity sha512-86pfT+z6SWKlJUoRy7MOMjRhrCPgSnAxbcH7jYCkqhokbCIDIv2IFWqMf0zdUqa8HqjRo13X6Jd6PhNYzWwJzw==
+"@nx/nx-linux-x64-musl@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/nx-linux-x64-musl/-/nx-linux-x64-musl-19.3.0.tgz#dafa78ec12101d83fb16fd4c5cb24c4d80e06a18"
+  integrity sha512-sahEV99glBlpGKG1TIQ5PkJ0QvpHp69wWsBFK2DKtCETxOtsWqwvIjemxTCXRirTqeHiP7BiR6VWsf2YqqqBdw==
 
-"@nx/nx-win32-arm64-msvc@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/nx-win32-arm64-msvc/-/nx-win32-arm64-msvc-19.2.2.tgz#7b5fe188144ee1fba1126f47f74a44d0f3c8783b"
-  integrity sha512-kJ3G0+nyAgBr5RTkNceC9zl2pekFEu0ec6ceLJ0tfcTwil76Ce3Xnlr0CFFNsre4T1v2RfFIDJL3EaRUXYep0w==
+"@nx/nx-win32-arm64-msvc@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/nx-win32-arm64-msvc/-/nx-win32-arm64-msvc-19.3.0.tgz#e9fe3306e917a40634ca2908536a318eb1132483"
+  integrity sha512-w03gFwLijStmhUji70QJHYo/U16ovybNczxGO7+5TT330X8/y+ihw9FCGHiIcujAjTAE88h0DKGn05WlNqRmfg==
 
-"@nx/nx-win32-x64-msvc@19.2.2":
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/@nx/nx-win32-x64-msvc/-/nx-win32-x64-msvc-19.2.2.tgz#644564b7ec476ad75adc70ef37d88e0c707b33c9"
-  integrity sha512-9KKGYFgWfc4jHzHjnIp+DJt750NyG1kA4Q+DWf/UcFA5917UWuAw9rribFPRsqYkcwbu++Uajw5bI5yMLP7ThA==
+"@nx/nx-win32-x64-msvc@19.3.0":
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/@nx/nx-win32-x64-msvc/-/nx-win32-x64-msvc-19.3.0.tgz#f451ba810a52d26c020e73d1d02d9110aef7e847"
+  integrity sha512-M7e2zXGfTjH8NLiwqKLdWC9VlfMSQDYlI4/SM4OSpPqhUTfPlRPa+wNKNTG7perKfDXxE9ei8yjocujknXJk/A==
 
 "@pkgjs/parseargs@^0.11.0":
   version "0.11.0"
@@ -2929,13 +2908,13 @@
   resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.18.0.tgz#5d694d345ce36b6ecf657349e03eb87297e68da4"
   integrity sha512-UOo5FdvOL0+eIVTgS4tIdbW+TtnBLWg1YBCcU2KWM7nuNwRz9bksDX1bekJJCpu25N1DVWaCwnT39dVQxzqS8g==
 
-"@schematics/angular@18.0.3":
-  version "18.0.3"
-  resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-18.0.3.tgz#d64dc55cee5b6553aeb22442e306dcd3fd78295d"
-  integrity sha512-ApiDJRmcl5Kc5862Ay9RWy96c8hlkf8ELjiBj+SQCAObXTne0NJH2596ckYTkqIRI9yC/8tfolDMJih5i1jwOA==
+"@schematics/angular@18.0.4":
+  version "18.0.4"
+  resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-18.0.4.tgz#51de3c596119c83ee6baa283fda44233ce1499e9"
+  integrity sha512-fN4whuym9ZmcQFdTfwLZr4j+NcZ4LzbdLk8XYrYdxt1z8c9ujs5LqJYn0LYc3UWiYl7z2RVc9NOxzNrkiXdwlw==
   dependencies:
-    "@angular-devkit/core" "18.0.3"
-    "@angular-devkit/schematics" "18.0.3"
+    "@angular-devkit/core" "18.0.4"
+    "@angular-devkit/schematics" "18.0.4"
     jsonc-parser "3.2.1"
 
 "@sigstore/bundle@^2.3.2":
@@ -3267,62 +3246,62 @@
   dependencies:
     "@types/yargs-parser" "*"
 
-"@typescript-eslint/eslint-plugin@7.12.0":
-  version "7.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.12.0.tgz#f87a32e8972b8a60024f2f8f12205e7c8108bc41"
-  integrity sha512-7F91fcbuDf/d3S8o21+r3ZncGIke/+eWk0EpO21LXhDfLahriZF9CGj4fbAetEjlaBdjdSm9a6VeXbpbT6Z40Q==
+"@typescript-eslint/eslint-plugin@7.13.0":
+  version "7.13.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.13.0.tgz#3cdeb5d44d051b21a9567535dd90702b2a42c6ff"
+  integrity sha512-FX1X6AF0w8MdVFLSdqwqN/me2hyhuQg4ykN6ZpVhh1ij/80pTvDKclX1sZB9iqex8SjQfVhwMKs3JtnnMLzG9w==
   dependencies:
     "@eslint-community/regexpp" "^4.10.0"
-    "@typescript-eslint/scope-manager" "7.12.0"
-    "@typescript-eslint/type-utils" "7.12.0"
-    "@typescript-eslint/utils" "7.12.0"
-    "@typescript-eslint/visitor-keys" "7.12.0"
+    "@typescript-eslint/scope-manager" "7.13.0"
+    "@typescript-eslint/type-utils" "7.13.0"
+    "@typescript-eslint/utils" "7.13.0"
+    "@typescript-eslint/visitor-keys" "7.13.0"
     graphemer "^1.4.0"
     ignore "^5.3.1"
     natural-compare "^1.4.0"
     ts-api-utils "^1.3.0"
 
-"@typescript-eslint/parser@7.12.0":
-  version "7.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-7.12.0.tgz#8761df3345528b35049353db80010b385719b1c3"
-  integrity sha512-dm/J2UDY3oV3TKius2OUZIFHsomQmpHtsV0FTh1WO8EKgHLQ1QCADUqscPgTpU+ih1e21FQSRjXckHn3txn6kQ==
+"@typescript-eslint/parser@7.13.0":
+  version "7.13.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-7.13.0.tgz#9489098d68d57ad392f507495f2b82ce8b8f0a6b"
+  integrity sha512-EjMfl69KOS9awXXe83iRN7oIEXy9yYdqWfqdrFAYAAr6syP8eLEFI7ZE4939antx2mNgPRW/o1ybm2SFYkbTVA==
   dependencies:
-    "@typescript-eslint/scope-manager" "7.12.0"
-    "@typescript-eslint/types" "7.12.0"
-    "@typescript-eslint/typescript-estree" "7.12.0"
-    "@typescript-eslint/visitor-keys" "7.12.0"
+    "@typescript-eslint/scope-manager" "7.13.0"
+    "@typescript-eslint/types" "7.13.0"
+    "@typescript-eslint/typescript-estree" "7.13.0"
+    "@typescript-eslint/visitor-keys" "7.13.0"
     debug "^4.3.4"
 
-"@typescript-eslint/scope-manager@7.12.0":
-  version "7.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-7.12.0.tgz#259c014362de72dd34f995efe6bd8dda486adf58"
-  integrity sha512-itF1pTnN6F3unPak+kutH9raIkL3lhH1YRPGgt7QQOh43DQKVJXmWkpb+vpc/TiDHs6RSd9CTbDsc/Y+Ygq7kg==
+"@typescript-eslint/scope-manager@7.13.0":
+  version "7.13.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-7.13.0.tgz#6927d6451537ce648c6af67a2327378d4cc18462"
+  integrity sha512-ZrMCe1R6a01T94ilV13egvcnvVJ1pxShkE0+NDjDzH4nvG1wXpwsVI5bZCvE7AEDH1mXEx5tJSVR68bLgG7Dng==
   dependencies:
-    "@typescript-eslint/types" "7.12.0"
-    "@typescript-eslint/visitor-keys" "7.12.0"
+    "@typescript-eslint/types" "7.13.0"
+    "@typescript-eslint/visitor-keys" "7.13.0"
 
-"@typescript-eslint/type-utils@7.12.0":
-  version "7.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-7.12.0.tgz#9dfaaa1972952f395ec5be4f5bbfc4d3cdc63908"
-  integrity sha512-lib96tyRtMhLxwauDWUp/uW3FMhLA6D0rJ8T7HmH7x23Gk1Gwwu8UZ94NMXBvOELn6flSPiBrCKlehkiXyaqwA==
+"@typescript-eslint/type-utils@7.13.0":
+  version "7.13.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-7.13.0.tgz#4587282b5227a23753ea8b233805ecafc3924c76"
+  integrity sha512-xMEtMzxq9eRkZy48XuxlBFzpVMDurUAfDu5Rz16GouAtXm0TaAoTFzqWUFPPuQYXI/CDaH/Bgx/fk/84t/Bc9A==
   dependencies:
-    "@typescript-eslint/typescript-estree" "7.12.0"
-    "@typescript-eslint/utils" "7.12.0"
+    "@typescript-eslint/typescript-estree" "7.13.0"
+    "@typescript-eslint/utils" "7.13.0"
     debug "^4.3.4"
     ts-api-utils "^1.3.0"
 
-"@typescript-eslint/types@7.12.0", "@typescript-eslint/types@^7.2.0":
-  version "7.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-7.12.0.tgz#bf208f971a8da1e7524a5d9ae2b5f15192a37981"
-  integrity sha512-o+0Te6eWp2ppKY3mLCU+YA9pVJxhUJE15FV7kxuD9jgwIAa+w/ycGJBMrYDTpVGUM/tgpa9SeMOugSabWFq7bg==
+"@typescript-eslint/types@7.13.0", "@typescript-eslint/types@^7.2.0":
+  version "7.13.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-7.13.0.tgz#0cca95edf1f1fdb0cfe1bb875e121b49617477c5"
+  integrity sha512-QWuwm9wcGMAuTsxP+qz6LBBd3Uq8I5Nv8xb0mk54jmNoCyDspnMvVsOxI6IsMmway5d1S9Su2+sCKv1st2l6eA==
 
-"@typescript-eslint/typescript-estree@7.12.0":
-  version "7.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-7.12.0.tgz#e6c1074f248b3db6573ab6a7c47a39c4cd498ff9"
-  integrity sha512-5bwqLsWBULv1h6pn7cMW5dXX/Y2amRqLaKqsASVwbBHMZSnHqE/HN4vT4fE0aFsiwxYvr98kqOWh1a8ZKXalCQ==
+"@typescript-eslint/typescript-estree@7.13.0":
+  version "7.13.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-7.13.0.tgz#4cc24fc155088ebf3b3adbad62c7e60f72c6de1c"
+  integrity sha512-cAvBvUoobaoIcoqox1YatXOnSl3gx92rCZoMRPzMNisDiM12siGilSM4+dJAekuuHTibI2hVC2fYK79iSFvWjw==
   dependencies:
-    "@typescript-eslint/types" "7.12.0"
-    "@typescript-eslint/visitor-keys" "7.12.0"
+    "@typescript-eslint/types" "7.13.0"
+    "@typescript-eslint/visitor-keys" "7.13.0"
     debug "^4.3.4"
     globby "^11.1.0"
     is-glob "^4.0.3"
@@ -3330,22 +3309,22 @@
     semver "^7.6.0"
     ts-api-utils "^1.3.0"
 
-"@typescript-eslint/utils@7.12.0":
-  version "7.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-7.12.0.tgz#c6e58fd7f724cdccc848f71e388ad80cbdb95dd0"
-  integrity sha512-Y6hhwxwDx41HNpjuYswYp6gDbkiZ8Hin9Bf5aJQn1bpTs3afYY4GX+MPYxma8jtoIV2GRwTM/UJm/2uGCVv+DQ==
+"@typescript-eslint/utils@7.13.0":
+  version "7.13.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-7.13.0.tgz#f84e7e8aeceae945a9a3f40d077fd95915308004"
+  integrity sha512-jceD8RgdKORVnB4Y6BqasfIkFhl4pajB1wVxrF4akxD2QPM8GNYjgGwEzYS+437ewlqqrg7Dw+6dhdpjMpeBFQ==
   dependencies:
     "@eslint-community/eslint-utils" "^4.4.0"
-    "@typescript-eslint/scope-manager" "7.12.0"
-    "@typescript-eslint/types" "7.12.0"
-    "@typescript-eslint/typescript-estree" "7.12.0"
+    "@typescript-eslint/scope-manager" "7.13.0"
+    "@typescript-eslint/types" "7.13.0"
+    "@typescript-eslint/typescript-estree" "7.13.0"
 
-"@typescript-eslint/visitor-keys@7.12.0":
-  version "7.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-7.12.0.tgz#c053b55a996679528beeedd8e565710ce1ae1ad3"
-  integrity sha512-uZk7DevrQLL3vSnfFl5bj4sL75qC9D6EdjemIdbtkuUmIheWpuiiylSY01JxJE7+zGrOWDZrp1WxOuDntvKrHQ==
+"@typescript-eslint/visitor-keys@7.13.0":
+  version "7.13.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-7.13.0.tgz#2eb7ce8eb38c2b0d4a494d1fe1908e7071a1a353"
+  integrity sha512-nxn+dozQx+MK61nn/JP+M4eCkHDSxSLDpgE3WcQo0+fkjEolnaB5jswvIKC4K56By8MMgIho7f1PVxERHEo8rw==
   dependencies:
-    "@typescript-eslint/types" "7.12.0"
+    "@typescript-eslint/types" "7.13.0"
     eslint-visitor-keys "^3.4.3"
 
 "@ungap/structured-clone@^1.2.0":
@@ -3533,14 +3512,16 @@ acorn-jsx@^5.3.2:
   integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
 
 acorn-walk@^8.1.1:
-  version "8.3.2"
-  resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-8.3.2.tgz#7703af9415f1b6db9315d6895503862e231d34aa"
-  integrity sha512-cjkyv4OtNCIeqhHrfS81QWXoCBPExR/J62oyEqepVw8WaQeSqpW2uhuLPh1m9eWhDuOo/jUXVTlifvesOWp/4A==
+  version "8.3.3"
+  resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-8.3.3.tgz#9caeac29eefaa0c41e3d4c65137de4d6f34df43e"
+  integrity sha512-MxXdReSRhGO7VlFe1bRG/oI7/mdLV9B9JJT0N8vZOhF7gFRR5l3M8W9G8JxmKV+JC5mGqJ0QvqfSOLsCPa4nUw==
+  dependencies:
+    acorn "^8.11.0"
 
-acorn@^8.4.1, acorn@^8.7.1, acorn@^8.8.2, acorn@^8.9.0:
-  version "8.11.3"
-  resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.11.3.tgz#71e0b14e13a4ec160724b38fb7b0f233b1b81d7a"
-  integrity sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==
+acorn@^8.11.0, acorn@^8.4.1, acorn@^8.7.1, acorn@^8.8.2, acorn@^8.9.0:
+  version "8.12.0"
+  resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.12.0.tgz#1627bfa2e058148036133b8d9b51a700663c294c"
+  integrity sha512-RTvkC4w+KNXrM39/lWCUaG0IbRkWdCv7W/IOW9oU6SawyxulvkQy5HQPVTKxEjczcUvapcrw3cFx/60VN/NRNw==
 
 adjust-sourcemap-loader@^4.0.0:
   version "4.0.0"
@@ -4061,9 +4042,9 @@ camelcase@^5.3.1:
   integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==
 
 caniuse-lite@^1.0.30001599, caniuse-lite@^1.0.30001629:
-  version "1.0.30001629"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001629.tgz#907a36f4669031bd8a1a8dbc2fa08b29e0db297e"
-  integrity sha512-c3dl911slnQhmxUIT4HhYzT7wnBK/XYpGnYLOj4nJBaRiw52Ibe7YxlDaAeRECvA786zCuExhxIUJ2K7nHMrBw==
+  version "1.0.30001634"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001634.tgz#aa563c8e7aeaf552f7ead60371bc8d803425deaa"
+  integrity sha512-fbBYXQ9q3+yp1q1gBk86tOFs4pyn/yxFm5ZNP18OXJDfA3txImOY9PhfxVggZ4vRHDqoU8NrKU81eN0OtzOgRA==
 
 chalk@^2.4.2:
   version "2.4.2"
@@ -4708,9 +4689,9 @@ ejs@^3.1.7:
     jake "^10.8.5"
 
 electron-to-chromium@^1.4.796:
-  version "1.4.796"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.796.tgz#48dd6ff634b7f7df6313bd27aaa713f3af4a2b29"
-  integrity sha512-NglN/xprcM+SHD2XCli4oC6bWe6kHoytcyLKCWXmRL854F0qhPhaYgUswUsglnPxYaNQIg2uMY4BvaomIf3kLA==
+  version "1.4.802"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.802.tgz#49b397eadc95a49b1ac33eebee146b8e5a93773f"
+  integrity sha512-TnTMUATbgNdPXVSHsxvNVSG0uEd6cSZsANjm8c9HbvflZVVn1yTRcmVXYT1Ma95/ssB/Dcd30AHweH2TE+dNpA==
 
 emoji-regex@^8.0.0:
   version "8.0.0"
@@ -5044,10 +5025,10 @@ eslint-plugin-import@~2.29.1:
     semver "^6.3.1"
     tsconfig-paths "^3.15.0"
 
-eslint-plugin-jsdoc@~48.2.9:
-  version "48.2.9"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-jsdoc/-/eslint-plugin-jsdoc-48.2.9.tgz#dd5e293bc584c94e24f0b2bc4a953252b3f96d70"
-  integrity sha512-ErpKyr2mEUEkcdZ4nwW/cvDjClvAcvJMEXkGGll0wf8sro8h6qeQ3qlZyp1vM1dRk8Ap6rMdke8FnP94QBIaVQ==
+eslint-plugin-jsdoc@~48.2.12:
+  version "48.2.12"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-jsdoc/-/eslint-plugin-jsdoc-48.2.12.tgz#e8411c87e55db3f21a288e04bf7e1fb5fa62dfa9"
+  integrity sha512-sO9sKkJx5ovWoRk9hV0YiNzXQ4Z6j27CqE/po2E3wddZVuy9wvKPSTiIhpxMTrP/qURvKayJIDB2+o9kyCW1Fw==
   dependencies:
     "@es-joy/jsdoccomment" "~0.43.1"
     are-docs-informative "^0.0.2"
@@ -5434,9 +5415,9 @@ for-each@^0.3.3:
     is-callable "^1.1.3"
 
 foreground-child@^3.1.0:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/foreground-child/-/foreground-child-3.1.1.tgz#1d173e776d75d2772fed08efe4a0de1ea1b12d0d"
-  integrity sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/foreground-child/-/foreground-child-3.2.0.tgz#5eb496c4ebf3bcc4572e8908a45a72f5a1d2d658"
+  integrity sha512-CrWQNaEl1/6WeZoarcM9LHupTo3RpZO2Pdk1vktwzPiQTsJnAKJmm3TACKeG5UZbWDfaH2AbvYxzP96y0MT7fA==
   dependencies:
     cross-spawn "^7.0.0"
     signal-exit "^4.0.1"
@@ -6391,9 +6372,9 @@ jest-worker@^27.4.5:
     supports-color "^8.0.0"
 
 jiti@^1.20.0:
-  version "1.21.3"
-  resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.3.tgz#b2adb07489d7629b344d59082bbedb8c21c5f755"
-  integrity sha512-uy2bNX5zQ+tESe+TiC7ilGRz8AtRGmnJH55NC5S0nSUjvvvM2hJHmefHErugGXN4pNv4Qx7vLsnNw9qJ9mtIsw==
+  version "1.21.6"
+  resolved "https://registry.yarnpkg.com/jiti/-/jiti-1.21.6.tgz#6c7f7398dd4b3142767f9a168af2f317a428d268"
+  integrity sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==
 
 js-tokens@^4.0.0:
   version "4.0.0"
@@ -6937,14 +6918,6 @@ minipass-flush@^1.0.5:
   dependencies:
     minipass "^3.0.0"
 
-minipass-json-stream@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/minipass-json-stream/-/minipass-json-stream-1.0.1.tgz#7edbb92588fbfc2ff1db2fc10397acb7b6b44aa7"
-  integrity sha512-ODqY18UZt/I8k+b7rl2AENgbWE8IDYam+undIJONvigAz8KR5GWblsFTEfQs0WODsjbSXWlm+JHEv8Gr6Tfdbg==
-  dependencies:
-    jsonparse "^1.3.1"
-    minipass "^3.0.0"
-
 minipass-pipeline@^1.2.4:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/minipass-pipeline/-/minipass-pipeline-1.2.4.tgz#68472f79711c084657c067c5c6ad93cddea8214c"
@@ -7220,15 +7193,15 @@ npm-pick-manifest@9.0.1, npm-pick-manifest@^9.0.0:
     semver "^7.3.5"
 
 npm-registry-fetch@^17.0.0:
-  version "17.0.1"
-  resolved "https://registry.yarnpkg.com/npm-registry-fetch/-/npm-registry-fetch-17.0.1.tgz#c13cfd4c022713f09d23af5fba8b6ec59a17609e"
-  integrity sha512-fLu9MTdZTlJAHUek/VLklE6EpIiP3VZpTiuN7OOMCt2Sd67NCpSEetMaxHHEZiZxllp8ZLsUpvbEszqTFEc+wA==
+  version "17.1.0"
+  resolved "https://registry.yarnpkg.com/npm-registry-fetch/-/npm-registry-fetch-17.1.0.tgz#fb69e8e762d456f08bda2f5f169f7638fb92beb1"
+  integrity sha512-5+bKQRH0J1xG1uZ1zMNvxW0VEyoNWgJpY9UDuluPFLKDfJ9u2JmmjmTJV1srBGQOROfdBMiVvnH2Zvpbm+xkVA==
   dependencies:
     "@npmcli/redact" "^2.0.0"
+    jsonparse "^1.3.1"
     make-fetch-happen "^13.0.0"
     minipass "^7.0.2"
     minipass-fetch "^3.0.0"
-    minipass-json-stream "^1.0.1"
     minizlib "^2.1.2"
     npm-package-arg "^11.0.0"
     proc-log "^4.0.0"
@@ -7247,12 +7220,12 @@ nth-check@^2.0.1:
   dependencies:
     boolbase "^1.0.0"
 
-nx@19.2.2, nx@^19.0.6:
-  version "19.2.2"
-  resolved "https://registry.yarnpkg.com/nx/-/nx-19.2.2.tgz#a8205681328b36e6487e171724feac41d7313713"
-  integrity sha512-Tg3REVykwKmVBCsroeCE/KhHAJx3e/m0FgNZWXJhn3EEh01qhdsVfWpM/ecawin73or7YcvB/99S8vVPU1nczg==
+nx@19.3.0, nx@^19.0.6:
+  version "19.3.0"
+  resolved "https://registry.yarnpkg.com/nx/-/nx-19.3.0.tgz#b26d0b1b62baaa8e9623226df97f23753e94c625"
+  integrity sha512-WILWiROUkZWwuPJ12tP24Z0NULPEhxFN9i55/fECuVXYaFtkg6FvEne9C4d4bRqhZPcbrz6WhHnzE3NhdjH7XQ==
   dependencies:
-    "@nrwl/tao" "19.2.2"
+    "@nrwl/tao" "19.3.0"
     "@yarnpkg/lockfile" "^1.1.0"
     "@yarnpkg/parsers" "3.0.0-rc.46"
     "@zkochan/js-yaml" "0.0.7"
@@ -7287,16 +7260,16 @@ nx@19.2.2, nx@^19.0.6:
     yargs "^17.6.2"
     yargs-parser "21.1.1"
   optionalDependencies:
-    "@nx/nx-darwin-arm64" "19.2.2"
-    "@nx/nx-darwin-x64" "19.2.2"
-    "@nx/nx-freebsd-x64" "19.2.2"
-    "@nx/nx-linux-arm-gnueabihf" "19.2.2"
-    "@nx/nx-linux-arm64-gnu" "19.2.2"
-    "@nx/nx-linux-arm64-musl" "19.2.2"
-    "@nx/nx-linux-x64-gnu" "19.2.2"
-    "@nx/nx-linux-x64-musl" "19.2.2"
-    "@nx/nx-win32-arm64-msvc" "19.2.2"
-    "@nx/nx-win32-x64-msvc" "19.2.2"
+    "@nx/nx-darwin-arm64" "19.3.0"
+    "@nx/nx-darwin-x64" "19.3.0"
+    "@nx/nx-freebsd-x64" "19.3.0"
+    "@nx/nx-linux-arm-gnueabihf" "19.3.0"
+    "@nx/nx-linux-arm64-gnu" "19.3.0"
+    "@nx/nx-linux-arm64-musl" "19.3.0"
+    "@nx/nx-linux-x64-gnu" "19.3.0"
+    "@nx/nx-linux-x64-musl" "19.3.0"
+    "@nx/nx-win32-arm64-msvc" "19.3.0"
+    "@nx/nx-win32-x64-msvc" "19.3.0"
 
 object-assign@^4:
   version "4.1.1"
@@ -8016,9 +7989,9 @@ reusify@^1.0.4:
   integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
 
 rfdc@^1.3.0:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/rfdc/-/rfdc-1.3.1.tgz#2b6d4df52dffe8bb346992a10ea9451f24373a8f"
-  integrity sha512-r5a3l5HzYlIC68TpmYKlxWjmOP6wiPJ1vWv2HeLhNsRZMrCkxeqxiHlQ21oXmQ4F3SiryXBHhAD7JZqvOJjFmg==
+  version "1.4.1"
+  resolved "https://registry.yarnpkg.com/rfdc/-/rfdc-1.4.1.tgz#778f76c4fb731d93414e8f925fbecf64cce7f6ca"
+  integrity sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==
 
 rimraf@^2.6.3:
   version "2.7.1"