feat: add interaction states for date pickers

telerik · Mar 21, 2021 · d1479f5 · d1479f5
1 parent 75f8141
commit d1479f5
Showing 1 changed file with 37 additions and 1 deletion.
diff --git a/packages/default/scss/datetime/_theme.scss b/packages/default/scss/datetime/_theme.scss
@@ -231,7 +231,43 @@
     }
 
     //Universal rendering
-    .k-dateinput {
+    .k-datepicker {
+        &.k-state-hover {
+            .k-picker-wrap {
+                @include fill(
+                    $datetime-hovered-text,
+                    $datetime-hovered-bg,
+                    $datetime-hovered-border
+                );
+            }
+        }
+
+        &.k-state-focus {
+            .k-picker-wrap {
+                @include fill(
+                    $datetime-focused-text,
+                    $datetime-focused-bg,
+                    $datetime-focused-border
+                );
+                @include box-shadow($datetime-focused-shadow);
+            }
+        }
+
+        &.k-invalid {
+            .k-picker-wrap {
+                border-color: $invalid-border;
+            }
+        }
+
+        &.k-invalid.k-state-focus {
+            .k-picker-wrap {
+                @include box-shadow($invalid-shadow);
+            }
+        }
+    }
+
+    .k-dateinput,
+    .k-daterangepicker {
         &.k-state-hover {
             .k-dateinput-wrap {
                 @include fill(