gilles/scrutiny
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

simplify darkmode ui toggle.

Browse Source
This commit is contained in:
Jason Kulatunga
2022-06-04 20:32:12 -07:00
parent 4b767421f3
commit 2ca44c967e
5 changed files with 29 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webapp/frontend/src/app/layout/common/dashboard-settings/dashboard-settings.component.html
+10 -13
View File
@@ -2,19 +2,16 @@
<mat-dialog-content class="mat-typography">
<div class="flex flex-col p-8 pb-0 overflow-hidden">
<div class="flex flex-col gt-md:flex-row">
<mat-slide-toggle class="mb-2" [(ngModel)]="themeUseSystem">Use system settings for dark mode</mat-slide-toggle>
<p [class.text-hint]="themeUseSystem">
Theme:
<mat-button-toggle-group class="ml-2" #group="matButtonToggleGroup" [(ngModel)]="theme" [disabled]="themeUseSystem">
<mat-button-toggle value="light" aria-label="Light mode">
<mat-icon>light_mode</mat-icon>
</mat-button-toggle>
<mat-button-toggle value="dark" aria-label="Dark mode">
<mat-icon>dark_mode</mat-icon>
</mat-button-toggle>
</mat-button-toggle-group>
</p>
<div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Dark Mode</mat-label>
<mat-select [(ngModel)]="theme">
<mat-option value="system">System</mat-option>
<mat-option value="dark">Dark</mat-option>
<mat-option value="light">Light</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="flex flex-col mt-5 gt-md:flex-row">