Theme button is now material button

2021-12-17 18:35:43 +02:00
parent 225d37f88d
commit 61900a7ba8
4 changed files with 39 additions and 19 deletions
--- a/ui/src/app/app.component.html
+++ b/ui/src/app/app.component.html
@@ -13,8 +13,12 @@
  </div>
  -->
  <div>
-    <span class="text-white">Toggle Theme</span>
-    <input style="margin: 1rem;" type="checkbox" [ngModel]="this.darkMode" aria-label="Toggle theme" (change)="themeChanged()">
+    <button class="btn btn-secondary" aria-label="Toggle theme" (click)="themeChanged()">
+      <i *ngIf="darkMode; else sunIcon" class="bi bi-sun-fill"></i>
+      <ng-template #sunIcon>
+        <i class="bi bi-moon-stars-fill"></i>
+      </ng-template>
+    </button>
  </div>
 </nav>