From fdfc48c5522c0cb07e0e4f38997adfffd064537d Mon Sep 17 00:00:00 2001
From: joneff <joneff@gmail.com>
Date: Mon, 5 Apr 2021 11:39:47 +0300
Subject: [PATCH] fix(calendar): update calendar colors to match latest design
 spec

---
 .../bootstrap/scss/calendar/_variables.scss   | 26 ++++++++++++++-----
 .../classic/scss/calendar/_variables.scss     | 26 ++++++++++++++-----
 packages/default/scss/calendar/_theme.scss    | 21 ++++++++-------
 .../default/scss/calendar/_variables.scss     | 26 ++++++++++++++-----
 packages/material/scss/calendar/_theme.scss   |  6 ++---
 .../material/scss/calendar/_variables.scss    | 18 ++++++++++---
 6 files changed, 87 insertions(+), 36 deletions(-)

diff --git a/packages/bootstrap/scss/calendar/_variables.scss b/packages/bootstrap/scss/calendar/_variables.scss
index 4f39160de88..441d3e2395e 100644
--- a/packages/bootstrap/scss/calendar/_variables.scss
+++ b/packages/bootstrap/scss/calendar/_variables.scss
@@ -87,13 +87,25 @@ $calendar-other-month-bg: null !default;
 $calendar-other-month-text: $calendar-header-cell-text !default;
 $calendar-other-month-opacity: null !default;
 
-$calendar-cell-hovered-bg: $node-hovered-bg !default;
-$calendar-cell-hovered-text: $node-hovered-text !default;
-$calendar-cell-hovered-border: $node-hovered-border !default;
-
-$calendar-cell-selected-bg: $node-selected-bg !default;
-$calendar-cell-selected-text: $node-selected-text !default;
-$calendar-cell-selected-border: $node-selected-border !default;
+$calendar-cell-bg: null !default;
+$calendar-cell-text: null !default;
+$calendar-cell-border: null !default;
+$calendar-cell-gradient: null !default;
+
+$calendar-cell-hover-bg: $hovered-bg !default;
+$calendar-cell-hover-text: $hovered-text !default;
+$calendar-cell-hover-border: $hovered-border !default;
+$calendar-cell-hover-gradient: null !default;
+
+$calendar-cell-selected-bg: $selected-bg !default;
+$calendar-cell-selected-text: $selected-text !default;
+$calendar-cell-selected-border: $selected-border !default;
+$calendar-cell-selected-gradient: null !default;
+
+$calendar-cell-selected-hover-bg: $selected-hover-bg !default;
+$calendar-cell-selected-hover-text: $selected-hover-text !default;
+$calendar-cell-selected-hover-border: $selected-hover-border !default;
+$calendar-cell-selected-hover-gradient: null !default;
 
 $calendar-cell-focused-shadow: inset $button-focused-shadow !default;
 $calendar-cell-selected-focus-shadow: inset 0 0 0 2px rgba( $primary-button-active-border, .5 ) !default;
diff --git a/packages/classic/scss/calendar/_variables.scss b/packages/classic/scss/calendar/_variables.scss
index 6868ef6f2c9..fbc00673e60 100644
--- a/packages/classic/scss/calendar/_variables.scss
+++ b/packages/classic/scss/calendar/_variables.scss
@@ -87,13 +87,25 @@ $calendar-other-month-bg: null !default;
 $calendar-other-month-text: $calendar-header-cell-text !default;
 $calendar-other-month-opacity: null !default;
 
-$calendar-cell-hovered-bg: $node-hovered-bg !default;
-$calendar-cell-hovered-text: $node-hovered-text !default;
-$calendar-cell-hovered-border: $node-hovered-border !default;
-
-$calendar-cell-selected-bg: $node-selected-bg !default;
-$calendar-cell-selected-text: $node-selected-text !default;
-$calendar-cell-selected-border: $node-selected-border !default;
+$calendar-cell-bg: null !default;
+$calendar-cell-text: null !default;
+$calendar-cell-border: null !default;
+$calendar-cell-gradient: null !default;
+
+$calendar-cell-hover-bg: $hovered-bg !default;
+$calendar-cell-hover-text: $hovered-text !default;
+$calendar-cell-hover-border: $hovered-border !default;
+$calendar-cell-hover-gradient: null !default;
+
+$calendar-cell-selected-bg: $selected-bg !default;
+$calendar-cell-selected-text: $selected-text !default;
+$calendar-cell-selected-border: $selected-border !default;
+$calendar-cell-selected-gradient: null !default;
+
+$calendar-cell-selected-hover-bg: $selected-hover-bg !default;
+$calendar-cell-selected-hover-text: $selected-hover-text !default;
+$calendar-cell-selected-hover-border: $selected-hover-border !default;
+$calendar-cell-selected-hover-gradient: null !default;
 
 $calendar-cell-focused-shadow: $list-item-focused-shadow !default;
 $calendar-cell-selected-focus-shadow: $calendar-cell-focused-shadow !default;
diff --git a/packages/default/scss/calendar/_theme.scss b/packages/default/scss/calendar/_theme.scss
index d289f67df26..005cfe72305 100644
--- a/packages/default/scss/calendar/_theme.scss
+++ b/packages/default/scss/calendar/_theme.scss
@@ -120,24 +120,27 @@
         .k-calendar-td:hover .k-link,
         .k-calendar-td.k-state-hover .k-link {
             @include fill(
-                $calendar-cell-hovered-text,
-                $calendar-cell-hovered-bg,
-                $calendar-cell-hovered-border
+                $calendar-cell-hover-text,
+                $calendar-cell-hover-bg,
+                $calendar-cell-hover-border,
+                $calendar-cell-hover-gradient
             );
         }
         .k-state-selected .k-link {
             @include fill(
                 $calendar-cell-selected-text,
                 $calendar-cell-selected-bg,
-                $calendar-cell-selected-border
+                $calendar-cell-selected-border,
+                $calendar-cell-selected-gradient
             );
         }
-        .k-state-selected.k-state-hover .k-link,
-        .k-state-selected:hover .k-link {
+        .k-state-selected:hover .k-link,
+        .k-state-selected.k-state-hover .k-link {
             @include fill(
-                $calendar-cell-selected-text,
-                try-shade( $calendar-cell-selected-bg ),
-                try-shade( $calendar-cell-selected-border )
+                $calendar-cell-selected-hover-text,
+                $calendar-cell-selected-hover-bg,
+                $calendar-cell-selected-hover-border,
+                $calendar-cell-selected-hover-gradient
             );
         }
         .k-state-focused .k-link,
diff --git a/packages/default/scss/calendar/_variables.scss b/packages/default/scss/calendar/_variables.scss
index 75e610edfe8..d5ac8b583fb 100644
--- a/packages/default/scss/calendar/_variables.scss
+++ b/packages/default/scss/calendar/_variables.scss
@@ -87,13 +87,25 @@ $calendar-other-month-bg: null !default;
 $calendar-other-month-text: $calendar-header-cell-text !default;
 $calendar-other-month-opacity: null !default;
 
-$calendar-cell-hovered-bg: $node-hovered-bg !default;
-$calendar-cell-hovered-text: $node-hovered-text !default;
-$calendar-cell-hovered-border: $node-hovered-border !default;
-
-$calendar-cell-selected-bg: $node-selected-bg !default;
-$calendar-cell-selected-text: $node-selected-text !default;
-$calendar-cell-selected-border: $node-selected-border !default;
+$calendar-cell-bg: null !default;
+$calendar-cell-text: null !default;
+$calendar-cell-border: null !default;
+$calendar-cell-gradient: null !default;
+
+$calendar-cell-hover-bg: $hovered-bg !default;
+$calendar-cell-hover-text: $hovered-text !default;
+$calendar-cell-hover-border: $hovered-border !default;
+$calendar-cell-hover-gradient: null !default;
+
+$calendar-cell-selected-bg: $selected-bg !default;
+$calendar-cell-selected-text: $selected-text !default;
+$calendar-cell-selected-border: $selected-border !default;
+$calendar-cell-selected-gradient: null !default;
+
+$calendar-cell-selected-hover-bg: $selected-hover-bg !default;
+$calendar-cell-selected-hover-text: $selected-hover-text !default;
+$calendar-cell-selected-hover-border: null !default;
+$calendar-cell-selected-hover-gradient: null !default;
 
 $calendar-cell-focused-shadow: $list-item-focused-shadow !default;
 $calendar-cell-selected-focus-shadow: $calendar-cell-focused-shadow !default;
diff --git a/packages/material/scss/calendar/_theme.scss b/packages/material/scss/calendar/_theme.scss
index 48baa0a3714..5f07a6bcbb2 100644
--- a/packages/material/scss/calendar/_theme.scss
+++ b/packages/material/scss/calendar/_theme.scss
@@ -6,9 +6,9 @@
 
         .k-state-focused .k-link {
             @include fill(
-                $calendar-cell-hovered-text,
-                $calendar-cell-hovered-bg,
-                $calendar-cell-hovered-border
+                $calendar-cell-hover-text,
+                $calendar-cell-hover-bg,
+                $calendar-cell-hover-border
             );
         }
         .k-state-selected.k-state-focused .k-link {
diff --git a/packages/material/scss/calendar/_variables.scss b/packages/material/scss/calendar/_variables.scss
index ff7819c98da..c2169327960 100644
--- a/packages/material/scss/calendar/_variables.scss
+++ b/packages/material/scss/calendar/_variables.scss
@@ -87,13 +87,25 @@ $calendar-other-month-bg: null !default;
 $calendar-other-month-text: $calendar-header-cell-text !default;
 $calendar-other-month-opacity: null !default;
 
-$calendar-cell-hovered-bg: $node-hovered-bg !default;
-$calendar-cell-hovered-text: $node-hovered-text !default;
-$calendar-cell-hovered-border: $node-hovered-border !default;
+$calendar-cell-bg: null !default;
+$calendar-cell-text: null !default;
+$calendar-cell-border: null !default;
+$calendar-cell-gradient: null !default;
+
+$calendar-cell-hover-bg: $hovered-bg !default;
+$calendar-cell-hover-text: $hovered-text !default;
+$calendar-cell-hover-border: $hovered-border !default;
+$calendar-cell-hover-gradient: null !default;
 
 $calendar-cell-selected-bg: $primary !default;
 $calendar-cell-selected-text: contrast-wcag( $calendar-cell-selected-bg ) !default;
 $calendar-cell-selected-border: $calendar-cell-selected-bg !default;
+$calendar-cell-selected-gradient: null !default;
+
+$calendar-cell-selected-hover-bg: try-shade( $calendar-cell-selected-bg, .5 ) !default;
+$calendar-cell-selected-hover-text: $calendar-cell-selected-text !default;
+$calendar-cell-selected-hover-border: null !default;
+$calendar-cell-selected-hover-gradient: null !default;
 
 $calendar-cell-focused-shadow: $list-item-focused-shadow !default;
 $calendar-cell-selected-focus-shadow: $calendar-cell-focused-shadow !default;