@progress/kendo-theme-core 14.9.0 → 14.10.0-dev.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-theme-core",
   "description": "A collection of functions and mixins used for building themes for Kendo UI",
-  "version": "14.9.0",
+  "version": "14.10.0-dev.1",
   "author": "Progress",
   "license": "Apache-2.0",
   "keywords": [

package/scss/components/scheduler/_layout.scss

@@ -61,9 +61,6 @@
     // Read-only events
     .k-readonly-scheduler .k-event,
     .k-event.k-readonly {
-        border-width: 1px;
-        border-style: solid;
-
         .k-resize-handle {
             display: none;
         }
@@ -406,8 +403,6 @@
     .k-event {
         min-height: $kendo-scheduler-event-min-height;
         box-sizing: border-box;
-        border-width: 0;
-        border-style: solid;
         border-radius: $kendo-scheduler-event-border-radius;
         text-align: start;
         outline: 0;
@@ -532,7 +527,6 @@
             border-color: $kendo-scheduler-bg;
             border-width: $kendo-scheduler-resize-handle-border-width;
             border-radius: $kendo-scheduler-resize-handle-border-radius;
-            background-color: $kendo-scheduler-resize-handle-bg;
         }
 
         .k-resize-n::before,

package/scss/components/scheduler/_theme.scss

@@ -121,7 +121,7 @@
         @include fill(
             var(--kendo-scheduler-event-on-color, $kendo-scheduler-event-text),
             var(--kendo-scheduler-event-bg, $kendo-scheduler-event-bg),
-            $kendo-scheduler-event-border,
+            null,
             $kendo-scheduler-event-gradient
         );
         @include box-shadow( $kendo-scheduler-event-shadow );
@@ -135,7 +135,7 @@
             @include fill(
                 var(--kendo-scheduler-event-on-color, $kendo-scheduler-event-hover-text),
                 var(--kendo-scheduler-event-bg, $kendo-scheduler-event-hover-bg),
-                $kendo-scheduler-event-hover-border,
+                null,
                 $kendo-scheduler-event-hover-gradient
             );
             @include box-shadow( $kendo-scheduler-event-hover-shadow );
@@ -145,7 +145,7 @@
             @include fill(
                 var(--kendo-scheduler-event-on-color, $kendo-scheduler-event-selected-text),
                 var(--kendo-scheduler-event-bg, $kendo-scheduler-event-selected-bg),
-                $kendo-scheduler-event-selected-border,
+                null,
                 $kendo-scheduler-event-selected-gradient
             );
             @include box-shadow( $kendo-scheduler-event-selected-shadow );
@@ -159,17 +159,23 @@
             @include box-shadow( $kendo-scheduler-event-ongoing-shadow );
         }
 
+        .k-resize-handle::before {
+            background-color: var(--kendo-scheduler-event-on-color, $kendo-scheduler-resize-handle-bg);
+        }
+
     }
 
     // Read-only events
     .k-readonly-scheduler .k-event,
     .k-event.k-readonly {
         @include fill(
-            $kendo-scheduler-event-readonly-text,
-            $kendo-scheduler-event-readonly-bg,
-            $kendo-scheduler-event-readonly-border
+            var(--kendo-scheduler-event-on-color, $kendo-scheduler-event-readonly-text),
+            var(--kendo-scheduler-event-bg, $kendo-scheduler-event-readonly-bg)
         );
         @include box-shadow( none );
+
+        // Mutes a custom event color by blending it with the surface; on-color is re-derived from the result.
+        --kendo-scheduler-event-bg: color-mix(in srgb, var(--kendo-scheduler-event-color) 20%, #{k-color(surface-alt)});
     }
 
 

package/scss/components/scheduler/_variables.scss

@@ -91,9 +91,6 @@ $kendo-scheduler-event-bg: null !default;
 /// The text color of the Scheduler event.
 /// @group scheduler
 $kendo-scheduler-event-text: null !default;
-/// The border color of the Scheduler event.
-/// @group scheduler
-$kendo-scheduler-event-border: null !default;
 /// The gradient of the Scheduler event.
 /// @group scheduler
 $kendo-scheduler-event-gradient: null !default;
@@ -107,9 +104,6 @@ $kendo-scheduler-event-hover-bg: $kendo-scheduler-event-bg !default;
 /// The text color of the hovered Scheduler event.
 /// @group scheduler
 $kendo-scheduler-event-hover-text: $kendo-scheduler-event-text !default;
-/// The border color of the hovered Scheduler event.
-/// @group scheduler
-$kendo-scheduler-event-hover-border: null !default;
 /// The gradient of the hovered Scheduler event.
 /// @group scheduler
 $kendo-scheduler-event-hover-gradient: null !default;
@@ -123,9 +117,6 @@ $kendo-scheduler-event-selected-bg: null !default;
 /// The text color of the selected Scheduler event.
 /// @group scheduler
 $kendo-scheduler-event-selected-text: null !default;
-/// The border color of the selected Scheduler event.
-/// @group scheduler
-$kendo-scheduler-event-selected-border: null !default;
 /// The gradient of the selected Scheduler event.
 /// @group scheduler
 $kendo-scheduler-event-selected-gradient: null !default;
@@ -162,9 +153,6 @@ $kendo-scheduler-event-readonly-bg: null !default;
 /// The text color of the read-only Scheduler event.
 /// @group scheduler
 $kendo-scheduler-event-readonly-text: null !default;
-/// The border color of the read-only Scheduler event.
-/// @group scheduler
-$kendo-scheduler-event-readonly-border: null !default;
 
 /// The horizontal padding of the Scheduler cell.
 /// @group scheduler