From 8051ad4dde8c525be597195fb3be82ec36dcda20 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Fri, 3 Jun 2022 00:40:18 -0700
Subject: [PATCH] Tweak / fix some dark mode colors

Update styles.scss
---
 .../dashboard-settings.component.html         | 24 +++++++++----------
 webapp/frontend/src/styles/styles.scss        | 12 ++++++++++
 2 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/webapp/frontend/src/app/layout/common/dashboard-settings/dashboard-settings.component.html b/webapp/frontend/src/app/layout/common/dashboard-settings/dashboard-settings.component.html
index 682a91e..2ef214f 100644
--- a/webapp/frontend/src/app/layout/common/dashboard-settings/dashboard-settings.component.html
+++ b/webapp/frontend/src/app/layout/common/dashboard-settings/dashboard-settings.component.html
@@ -53,24 +53,24 @@
             <mat-tab-group mat-align-tabs="start">
                 <mat-tab label="Ata">
 
-                    <div matTooltip="not yet implemented" class="gray-200 flex flex-col mt-5 gt-md:flex-row">
+                    <div matTooltip="not yet implemented" class="flex flex-col mt-5 gt-md:flex-row">
                         <mat-form-field class="flex-auto gt-md:pr-3">
-                            <mat-label>Critical Error Threshold</mat-label>
+                            <mat-label class="text-hint">Critical Error Threshold</mat-label>
                             <input disabled matInput [value]="'10%'">
                         </mat-form-field>
                         <mat-form-field class="flex-auto gt-md:pl-3">
-                            <mat-label>Critical Warning Threshold</mat-label>
+                            <mat-label class="text-hint">Critical Warning Threshold</mat-label>
                             <input disabled matInput>
                         </mat-form-field>
                     </div>
 
-                    <div matTooltip="not yet implemented" class="gray-200 flex flex-col gt-md:flex-row">
+                    <div matTooltip="not yet implemented" class="flex flex-col gt-md:flex-row">
                         <mat-form-field class="flex-auto gt-md:pr-3">
-                            <mat-label>Error Threshold</mat-label>
+                            <mat-label class="text-hint">Error Threshold</mat-label>
                             <input disabled matInput [value]="'20%'">
                         </mat-form-field>
                         <mat-form-field class="flex-auto gt-md:pl-3">
-                            <mat-label>Warning Threshold</mat-label>
+                            <mat-label class="text-hint">Warning Threshold</mat-label>
                             <input disabled matInput [value]="'10%'">
                         </mat-form-field>
                     </div>
@@ -78,26 +78,26 @@
                 </mat-tab>
                 <mat-tab label="NVMe">
 
-                    <div matTooltip="not yet implemented" class="gray-200 flex flex-col mt-5 gt-md:flex-row">
+                    <div matTooltip="not yet implemented" class="flex flex-col mt-5 gt-md:flex-row">
                         <mat-form-field class="flex-auto gt-md:pr-3">
-                            <mat-label>Critical Error Threshold</mat-label>
+                            <mat-label class="text-hint">Critical Error Threshold</mat-label>
                             <input disabled matInput [value]="'enabled'">
                         </mat-form-field>
                         <mat-form-field class="flex-auto gt-md:pl-3">
-                            <mat-label>Critical Warning Threshold</mat-label>
+                            <mat-label class="text-hint">Critical Warning Threshold</mat-label>
                             <input disabled matInput>
                         </mat-form-field>
                     </div>
 
                 </mat-tab>
                 <mat-tab label="SCSI">
-                    <div matTooltip="not yet implemented" class="gray-200 flex flex-col mt-5 gt-md:flex-row">
+                    <div matTooltip="not yet implemented" class="flex flex-col mt-5 gt-md:flex-row">
                         <mat-form-field class="flex-auto gt-md:pr-3">
-                            <mat-label>Critical Error Threshold</mat-label>
+                            <mat-label class="text-hint">Critical Error Threshold</mat-label>
                             <input disabled matInput [value]="'enabled'">
                         </mat-form-field>
                         <mat-form-field class="flex-auto gt-md:pl-3">
-                            <mat-label>Critical Warning Threshold</mat-label>
+                            <mat-label class="text-hint">Critical Warning Threshold</mat-label>
                             <input disabled matInput>
                         </mat-form-field>
                     </div>
diff --git a/webapp/frontend/src/styles/styles.scss b/webapp/frontend/src/styles/styles.scss
index e86eb52..c200595 100644
--- a/webapp/frontend/src/styles/styles.scss
+++ b/webapp/frontend/src/styles/styles.scss
@@ -4,3 +4,15 @@
 // @ Styles from this file will override anything from 'vendors.scss' file allowing customizations and
 //  modifications of third party libraries.
 // -----------------------------------------------------------------------------------------------------
+
+.treo-theme-dark .yellow-50 {
+    background-color: #242b38 !important;
+
+    .mat-icon {
+        color: #6f4315 !important;
+    }
+
+    .text-secondary {
+        color: rgb(203 101 37 / 70%) !important
+    }
+}
\ No newline at end of file