codelab: enable HighContrast mode

googlecodelabs · May 11, 2022 · 709fc82 · 709fc82
1 parent 4dd6f7f
commit 709fc82
Showing 1 changed file with 9 additions and 0 deletions.
diff --git a/src/app/shop/shop.component.scss b/src/app/shop/shop.component.scss
@@ -16,6 +16,7 @@
 @use '@angular/material' as mat;
 
 // TODO: #12. Enable HighContrast mode
+@use '@angular/cdk';
 
 :host {
   display: flex;
@@ -81,6 +82,10 @@
     background-color: mat.get-color-from-palette(mat.$pink-palette, A100);
 
     // TODO: #12. Enable HighContrast mode
+    @include cdk.high-contrast() {
+      outline: solid 1px;
+      background-color: mat.get-color-from-palette(mat.$pink-palette, 50);
+    }
 
     text-align: center;
     text-transform: uppercase;
@@ -101,5 +106,9 @@
     background-color: mat.get-color-from-palette(mat.$light-green-palette, A100);
 
     // TODO: #12. Enable HighContrast mode
+    @include cdk.high-contrast() {
+      // outline: solid 1px;
+      // background-color: mat.get-color-from-palette(mat.$light-green-palette, 50);
+    }
   }
 }