Date Picker Calendar Grids: Fix color contrast for selected date (pull …

…#1479) Resolves issue #1478 for both the date picker dialog example and the combobox date picker example by using dark background with white text for the selected date cell in the calendar grid. Co-authored-by: Matt King <a11yThinker@Gmail.com>
w3c · Sep 1, 2020 · 70c3646 · 70c3646
1 parent adb0de5
commit 70c3646
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/examples/combobox/css/combobox-datepicker.css b/examples/combobox/css/combobox-datepicker.css
@@ -228,10 +228,10 @@
 }
 
 .combobox-datepicker .dates td[tabindex="0"] {
-  background-color: hsl(216, 80%, 92%);
+  background-color: hsl(216, 80%, 51%);
+  color: white;
 }
 
-.combobox-datepicker .dates td:focus,
 .combobox-datepicker .dates td:hover {
   padding: 0;
   background-color: hsl(216, 80%, 92%);

diff --git a/examples/dialog-modal/css/datepicker-dialog.css b/examples/dialog-modal/css/datepicker-dialog.css
@@ -235,7 +235,8 @@
 }
 
 .datepicker-dialog table.dates td[tabindex="0"] {
-  background-color: hsl(216, 80%, 92%);
+  background-color: hsl(216, 80%, 51%);
+  color: white;
 }