@progress/kendo-theme-fluent 10.1.1-dev.1 → 10.2.0-dev.1

package/dist/meta/sassdoc-raw-data.json

@@ -10027,8 +10027,8 @@
     {
         "description": "The font-size of the label of the chart component.\n",
         "commentRange": {
-            "start": 109,
-            "end": 110
+            "start": 106,
+            "end": 107
         },
         "context": {
             "type": "variable",
@@ -10036,8 +10036,8 @@
             "value": "var( --kendo-font-size-sm, inherit )",
             "scope": "default",
             "line": {
-                "start": 111,
-                "end": 111
+                "start": 108,
+                "end": 108
             }
         },
         "group": [
@@ -10052,8 +10052,8 @@
     {
         "description": "The inactive background color of the chart component.\n",
         "commentRange": {
-            "start": 124,
-            "end": 125
+            "start": 121,
+            "end": 122
         },
         "context": {
             "type": "variable",
@@ -10061,8 +10061,8 @@
             "value": "var( --kendo-disabled-bg, initial )",
             "scope": "default",
             "line": {
-                "start": 126,
-                "end": 126
+                "start": 123,
+                "end": 123
             }
         },
         "group": [
@@ -10602,8 +10602,8 @@
     {
         "description": "The line-height of the chart component.\n",
         "commentRange": {
-            "start": 98,
-            "end": 99
+            "start": 95,
+            "end": 96
         },
         "context": {
             "type": "variable",
@@ -10611,8 +10611,8 @@
             "value": "var( --kendo-line-height, normal )",
             "scope": "default",
             "line": {
-                "start": 100,
-                "end": 100
+                "start": 97,
+                "end": 97
             }
         },
         "group": [
@@ -10627,8 +10627,8 @@
     {
         "description": "The font-size of the tooltip of the chart component.\n",
         "commentRange": {
-            "start": 102,
-            "end": 103
+            "start": 99,
+            "end": 100
         },
         "context": {
             "type": "variable",
@@ -10636,8 +10636,8 @@
             "value": "var( --kendo-font-size-sm, inherit )",
             "scope": "default",
             "line": {
-                "start": 104,
-                "end": 104
+                "start": 101,
+                "end": 101
             }
         },
         "group": [
@@ -10652,8 +10652,8 @@
     {
         "description": "The line-height of the tooltip of the chart component.\n",
         "commentRange": {
-            "start": 105,
-            "end": 106
+            "start": 102,
+            "end": 103
         },
         "context": {
             "type": "variable",
@@ -10661,8 +10661,8 @@
             "value": "var( --kendo-line-height-sm, normal )",
             "scope": "default",
             "line": {
-                "start": 107,
-                "end": 107
+                "start": 104,
+                "end": 104
             }
         },
         "group": [
@@ -10677,8 +10677,8 @@
     {
         "description": "The font-size of the title of the chart component.\n",
         "commentRange": {
-            "start": 113,
-            "end": 114
+            "start": 110,
+            "end": 111
         },
         "context": {
             "type": "variable",
@@ -10686,8 +10686,8 @@
             "value": "var( --kendo-font-size-lg, inherit )",
             "scope": "default",
             "line": {
-                "start": 115,
-                "end": 115
+                "start": 112,
+                "end": 112
             }
         },
         "group": [
@@ -10702,8 +10702,8 @@
     {
         "description": "The font-size of the pane title of the chart component.\n",
         "commentRange": {
-            "start": 117,
-            "end": 118
+            "start": 114,
+            "end": 115
         },
         "context": {
             "type": "variable",
@@ -10711,8 +10711,8 @@
             "value": "var( --kendo-font-size-lg, inherit )",
             "scope": "default",
             "line": {
-                "start": 119,
-                "end": 119
+                "start": 116,
+                "end": 116
             }
         },
         "group": [
@@ -10727,8 +10727,8 @@
     {
         "description": "The font-weight of the pane title of the chart component.\n",
         "commentRange": {
-            "start": 120,
-            "end": 121
+            "start": 117,
+            "end": 118
         },
         "context": {
             "type": "variable",
@@ -10736,8 +10736,8 @@
             "value": "var( --kendo-font-weight, inherit )",
             "scope": "default",
             "line": {
-                "start": 122,
-                "end": 122
+                "start": 119,
+                "end": 119
             }
         },
         "group": [
@@ -10752,8 +10752,8 @@
     {
         "description": "The color of the chart component major grid lines.\n",
         "commentRange": {
-            "start": 128,
-            "end": 129
+            "start": 125,
+            "end": 126
         },
         "context": {
             "type": "variable",
@@ -10761,8 +10761,8 @@
             "value": "if($kendo-enable-color-system, color-mix(in srgb, k-color( border ) 16%, transparent), k-get-theme-color-var( neutral-30 ))",
             "scope": "default",
             "line": {
-                "start": 130,
-                "end": 130
+                "start": 127,
+                "end": 127
             }
         },
         "group": [
@@ -10777,8 +10777,8 @@
     {
         "description": "The color of the chart component minor grid lines.\n",
         "commentRange": {
-            "start": 131,
-            "end": 132
+            "start": 128,
+            "end": 129
         },
         "context": {
             "type": "variable",
@@ -10786,8 +10786,8 @@
             "value": "if($kendo-enable-color-system, color-mix(in srgb, k-color( border ) 16%, transparent), k-get-theme-color-var( neutral-30 ))",
             "scope": "default",
             "line": {
-                "start": 133,
-                "end": 133
+                "start": 130,
+                "end": 130
             }
         },
         "group": [
@@ -10802,8 +10802,8 @@
     {
         "description": "The opacity of the chart area.\n",
         "commentRange": {
-            "start": 135,
-            "end": 136
+            "start": 132,
+            "end": 133
         },
         "context": {
             "type": "variable",
@@ -10811,8 +10811,8 @@
             "value": ".6",
             "scope": "default",
             "line": {
-                "start": 137,
-                "end": 137
+                "start": 134,
+                "end": 134
             }
         },
         "group": [
@@ -10827,8 +10827,8 @@
     {
         "description": "The inactive opacity of the chart area.\n",
         "commentRange": {
-            "start": 138,
-            "end": 139
+            "start": 135,
+            "end": 136
         },
         "context": {
             "type": "variable",
@@ -10836,8 +10836,8 @@
             "value": ".1",
             "scope": "default",
             "line": {
-                "start": 140,
-                "end": 140
+                "start": 137,
+                "end": 137
             }
         },
         "group": [
@@ -10852,8 +10852,8 @@
     {
         "description": "The inactive opacity of the chart line.\n",
         "commentRange": {
-            "start": 142,
-            "end": 143
+            "start": 139,
+            "end": 140
         },
         "context": {
             "type": "variable",
@@ -10861,8 +10861,8 @@
             "value": ".3",
             "scope": "default",
             "line": {
-                "start": 144,
-                "end": 144
+                "start": 141,
+                "end": 141
             }
         },
         "group": [
@@ -10877,8 +10877,8 @@
     {
         "description": "The background color of the chart component.\n",
         "commentRange": {
-            "start": 146,
-            "end": 147
+            "start": 143,
+            "end": 144
         },
         "context": {
             "type": "variable",
@@ -10886,8 +10886,8 @@
             "value": "var( --kendo-component-bg, initial )",
             "scope": "default",
             "line": {
-                "start": 148,
-                "end": 148
+                "start": 145,
+                "end": 145
             }
         },
         "group": [
@@ -10902,8 +10902,8 @@
     {
         "description": "The text color of the chart component.\n",
         "commentRange": {
-            "start": 149,
-            "end": 150
+            "start": 146,
+            "end": 147
         },
         "context": {
             "type": "variable",
@@ -10911,8 +10911,8 @@
             "value": "var( --kendo-component-text, initial )",
             "scope": "default",
             "line": {
-                "start": 151,
-                "end": 151
+                "start": 148,
+                "end": 148
             }
         },
         "group": [
@@ -10927,8 +10927,8 @@
     {
         "description": "The border color of the chart component.\n",
         "commentRange": {
-            "start": 152,
-            "end": 153
+            "start": 149,
+            "end": 150
         },
         "context": {
             "type": "variable",
@@ -10936,8 +10936,8 @@
             "value": "var( --kendo-component-border, initial )",
             "scope": "default",
             "line": {
-                "start": 154,
-                "end": 154
+                "start": 151,
+                "end": 151
             }
         },
         "group": [
@@ -10952,8 +10952,8 @@
     {
         "description": "The text color of the chart tooltip.\n",
         "commentRange": {
-            "start": 156,
-            "end": 157
+            "start": 153,
+            "end": 154
         },
         "context": {
             "type": "variable",
@@ -10961,8 +10961,8 @@
             "value": "if($kendo-enable-color-system, k-color( app-surface ), $kendo-color-white)",
             "scope": "default",
             "line": {
-                "start": 158,
-                "end": 158
+                "start": 155,
+                "end": 155
             }
         },
         "group": [
@@ -10977,8 +10977,8 @@
     {
         "description": "The inverse text color of the chart tooltip.\n",
         "commentRange": {
-            "start": 159,
-            "end": 160
+            "start": 156,
+            "end": 157
         },
         "context": {
             "type": "variable",
@@ -10986,8 +10986,8 @@
             "value": "if($kendo-enable-color-system, k-color( on-app-surface ), $kendo-color-black)",
             "scope": "default",
             "line": {
-                "start": 161,
-                "end": 161
+                "start": 158,
+                "end": 158
             }
         },
         "group": [
@@ -11002,8 +11002,8 @@
     {
         "description": "The background color of the chart crosshairs.\n",
         "commentRange": {
-            "start": 163,
-            "end": 164
+            "start": 160,
+            "end": 161
         },
         "context": {
             "type": "variable",
@@ -11011,8 +11011,8 @@
             "value": "if($kendo-enable-color-system, k-color( on-app-surface ), $kendo-color-black)",
             "scope": "default",
             "line": {
-                "start": 165,
-                "end": 165
+                "start": 162,
+                "end": 162
             }
         },
         "group": [
@@ -11027,8 +11027,8 @@
     {
         "description": "The text color of the chart shared crosshair tooltip.\n",
         "commentRange": {
-            "start": 166,
-            "end": 167
+            "start": 163,
+            "end": 164
         },
         "context": {
             "type": "variable",
@@ -11036,8 +11036,8 @@
             "value": "if($kendo-enable-color-system, k-color( on-app-surface ), k-get-theme-color-var( neutral-160 ))",
             "scope": "default",
             "line": {
-                "start": 168,
-                "end": 168
+                "start": 165,
+                "end": 165
             }
         },
         "group": [
@@ -11052,8 +11052,8 @@
     {
         "description": "The background color of the chart shared crosshair tooltip.\n",
         "commentRange": {
-            "start": 169,
-            "end": 170
+            "start": 166,
+            "end": 167
         },
         "context": {
             "type": "variable",
@@ -11061,8 +11061,8 @@
             "value": "var( --kendo-component-bg, initial )",
             "scope": "default",
             "line": {
-                "start": 171,
-                "end": 171
+                "start": 168,
+                "end": 168
             }
         },
         "group": [
@@ -11077,8 +11077,8 @@
     {
         "description": "The border color of the chart shared crosshair tooltip.\n",
         "commentRange": {
-            "start": 172,
-            "end": 173
+            "start": 169,
+            "end": 170
         },
         "context": {
             "type": "variable",
@@ -11086,8 +11086,8 @@
             "value": "transparent",
             "scope": "default",
             "line": {
-                "start": 174,
-                "end": 174
+                "start": 171,
+                "end": 171
             }
         },
         "group": [
@@ -11102,8 +11102,8 @@
     {
         "description": "The background color of the chart notes.\n",
         "commentRange": {
-            "start": 176,
-            "end": 177
+            "start": 173,
+            "end": 174
         },
         "context": {
             "type": "variable",
@@ -11111,8 +11111,8 @@
             "value": "if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130 ))",
             "scope": "default",
             "line": {
-                "start": 178,
-                "end": 178
+                "start": 175,
+                "end": 175
             }
         },
         "group": [
@@ -11127,8 +11127,8 @@
     {
         "description": "The border color of the chart notes.\n",
         "commentRange": {
-            "start": 179,
-            "end": 180
+            "start": 176,
+            "end": 177
         },
         "context": {
             "type": "variable",
@@ -11136,8 +11136,8 @@
             "value": "$kendo-chart-notes-background",
             "scope": "default",
             "line": {
-                "start": 181,
-                "end": 181
+                "start": 178,
+                "end": 178
             }
         },
         "group": [
@@ -11152,8 +11152,8 @@
     {
         "description": "The background color of the chart note lines.\n",
         "commentRange": {
-            "start": 182,
-            "end": 183
+            "start": 179,
+            "end": 180
         },
         "context": {
             "type": "variable",
@@ -11161,8 +11161,8 @@
             "value": "$kendo-chart-notes-background",
             "scope": "default",
             "line": {
-                "start": 184,
-                "end": 184
+                "start": 181,
+                "end": 181
             }
         },
         "group": [
@@ -11177,8 +11177,8 @@
     {
         "description": "The background color of the chart handle.\n",
         "commentRange": {
-            "start": 186,
-            "end": 187
+            "start": 183,
+            "end": 184
         },
         "context": {
             "type": "variable",
@@ -11186,8 +11186,8 @@
             "value": "if($kendo-enable-color-system, k-color( surface ), k-get-theme-color-var( neutral-10 ))",
             "scope": "default",
             "line": {
-                "start": 188,
-                "end": 188
+                "start": 185,
+                "end": 185
             }
         },
         "group": [
@@ -11202,8 +11202,8 @@
     {
         "description": "The text color of the chart handle.\n",
         "commentRange": {
-            "start": 189,
-            "end": 190
+            "start": 186,
+            "end": 187
         },
         "context": {
             "type": "variable",
@@ -11211,8 +11211,8 @@
             "value": "$kendo-chart-text",
             "scope": "default",
             "line": {
-                "start": 191,
-                "end": 191
+                "start": 188,
+                "end": 188
             }
         },
         "group": [
@@ -11227,8 +11227,8 @@
     {
         "description": "The border color of the chart handle.\n",
         "commentRange": {
-            "start": 192,
-            "end": 193
+            "start": 189,
+            "end": 190
         },
         "context": {
             "type": "variable",
@@ -11236,8 +11236,8 @@
             "value": "$kendo-chart-handle-bg",
             "scope": "default",
             "line": {
-                "start": 194,
-                "end": 194
+                "start": 191,
+                "end": 191
             }
         },
         "group": [
@@ -11252,8 +11252,8 @@
     {
         "description": "The hover background color of the chart handle.\n",
         "commentRange": {
-            "start": 195,
-            "end": 196
+            "start": 192,
+            "end": 193
         },
         "context": {
             "type": "variable",
@@ -11261,8 +11261,8 @@
             "value": "var( --kendo-hover-bg, initial )",
             "scope": "default",
             "line": {
-                "start": 197,
-                "end": 197
+                "start": 194,
+                "end": 194
             }
         },
         "group": [
@@ -11277,8 +11277,8 @@
     {
         "description": "The hover text color of the chart handle.\n",
         "commentRange": {
-            "start": 198,
-            "end": 199
+            "start": 195,
+            "end": 196
         },
         "context": {
             "type": "variable",
@@ -11286,8 +11286,8 @@
             "value": "var( --kendo-hover-text, initial )",
             "scope": "default",
             "line": {
-                "start": 200,
-                "end": 200
+                "start": 197,
+                "end": 197
             }
         },
         "group": [
@@ -11302,8 +11302,8 @@
     {
         "description": "The hover border color of the chart handle.\n",
         "commentRange": {
-            "start": 201,
-            "end": 202
+            "start": 198,
+            "end": 199
         },
         "context": {
             "type": "variable",
@@ -11311,8 +11311,8 @@
             "value": "var( --kendo-hover-border, initial )",
             "scope": "default",
             "line": {
-                "start": 203,
-                "end": 203
+                "start": 200,
+                "end": 200
             }
         },
         "group": [
@@ -11327,17 +11327,17 @@
     {
         "description": "The color of the chart error bars.\n",
         "commentRange": {
-            "start": 205,
-            "end": 206
+            "start": 202,
+            "end": 203
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-error-bars-background",
+            "name": "kendo-chart-error-bars-background",
             "value": "if($kendo-enable-color-system, k-color( error ), k-get-theme-color-var( neutral-110 ))",
             "scope": "default",
             "line": {
-                "start": 207,
-                "end": 207
+                "start": 204,
+                "end": 204
             }
         },
         "group": [
@@ -11352,8 +11352,8 @@
     {
         "description": "The size of the selection handle of the chart component.\n",
         "commentRange": {
-            "start": 209,
-            "end": 210
+            "start": 206,
+            "end": 207
         },
         "context": {
             "type": "variable",
@@ -11361,8 +11361,8 @@
             "value": "24px",
             "scope": "default",
             "line": {
-                "start": 211,
-                "end": 211
+                "start": 208,
+                "end": 208
             }
         },
         "group": [
@@ -11377,8 +11377,8 @@
     {
         "description": "The color of the selection handle of the chart component.\n",
         "commentRange": {
-            "start": 212,
-            "end": 213
+            "start": 209,
+            "end": 210
         },
         "context": {
             "type": "variable",
@@ -11386,8 +11386,8 @@
             "value": "var( --kendo-component-border, initial )",
             "scope": "default",
             "line": {
-                "start": 214,
-                "end": 214
+                "start": 211,
+                "end": 211
             }
         },
         "group": [
@@ -11402,8 +11402,8 @@
     {
         "description": "The computed height of the Chart title.\n",
         "commentRange": {
-            "start": 216,
-            "end": 217
+            "start": 213,
+            "end": 214
         },
         "context": {
             "type": "variable",
@@ -11411,8 +11411,8 @@
             "value": "0px",
             "scope": "default",
             "line": {
-                "start": 218,
-                "end": 218
+                "start": 215,
+                "end": 215
             }
         },
         "group": [
@@ -11427,8 +11427,8 @@
     {
         "description": "The font-family of the treemap.\n",
         "commentRange": {
-            "start": 220,
-            "end": 221
+            "start": 217,
+            "end": 218
         },
         "context": {
             "type": "variable",
@@ -11436,8 +11436,8 @@
             "value": "var( --kendo-font-family, inherit )",
             "scope": "default",
             "line": {
-                "start": 222,
-                "end": 222
+                "start": 219,
+                "end": 219
             }
         },
         "group": [
@@ -11452,8 +11452,8 @@
     {
         "description": "The font-size of the treemap.\n",
         "commentRange": {
-            "start": 223,
-            "end": 224
+            "start": 220,
+            "end": 221
         },
         "context": {
             "type": "variable",
@@ -11461,8 +11461,8 @@
             "value": "var( --kendo-font-size, inherit )",
             "scope": "default",
             "line": {
-                "start": 225,
-                "end": 225
+                "start": 222,
+                "end": 222
             }
         },
         "group": [
@@ -11477,8 +11477,8 @@
     {
         "description": "The line-height of the treemap.\n",
         "commentRange": {
-            "start": 226,
-            "end": 227
+            "start": 223,
+            "end": 224
         },
         "context": {
             "type": "variable",
@@ -11486,8 +11486,8 @@
             "value": "var( --kendo-line-height, normal )",
             "scope": "default",
             "line": {
-                "start": 228,
-                "end": 228
+                "start": 225,
+                "end": 225
             }
         },
         "group": [
@@ -11502,8 +11502,8 @@
     {
         "description": "The background color of the treemap.\n",
         "commentRange": {
-            "start": 229,
-            "end": 230
+            "start": 226,
+            "end": 227
         },
         "context": {
             "type": "variable",
@@ -11511,8 +11511,8 @@
             "value": "var( --kendo-component-bg, initial )",
             "scope": "default",
             "line": {
-                "start": 231,
-                "end": 231
+                "start": 228,
+                "end": 228
             }
         },
         "group": [
@@ -11527,8 +11527,8 @@
     {
         "description": "The text color of the treemap.\n",
         "commentRange": {
-            "start": 232,
-            "end": 233
+            "start": 229,
+            "end": 230
         },
         "context": {
             "type": "variable",
@@ -11536,8 +11536,8 @@
             "value": "var( --kendo-component-text, initial )",
             "scope": "default",
             "line": {
-                "start": 234,
-                "end": 234
+                "start": 231,
+                "end": 231
             }
         },
         "group": [
@@ -11552,8 +11552,8 @@
     {
         "description": "The border color of the treemap.\n",
         "commentRange": {
-            "start": 235,
-            "end": 236
+            "start": 232,
+            "end": 233
         },
         "context": {
             "type": "variable",
@@ -11561,8 +11561,8 @@
             "value": "var( --kendo-component-border, initial )",
             "scope": "default",
             "line": {
-                "start": 237,
-                "end": 237
+                "start": 234,
+                "end": 234
             }
         },
         "group": [
@@ -11577,8 +11577,8 @@
     {
         "description": "The background color of the treemap title.\n",
         "commentRange": {
-            "start": 239,
-            "end": 240
+            "start": 236,
+            "end": 237
         },
         "context": {
             "type": "variable",
@@ -11586,8 +11586,8 @@
             "value": "if($kendo-enable-color-system, k-color( surface ), k-get-theme-color-var( neutral-10 ))",
             "scope": "default",
             "line": {
-                "start": 241,
-                "end": 241
+                "start": 238,
+                "end": 238
             }
         },
         "group": [
@@ -11602,8 +11602,8 @@
     {
         "description": "The text color of the treemap title.\n",
         "commentRange": {
-            "start": 242,
-            "end": 243
+            "start": 239,
+            "end": 240
         },
         "context": {
             "type": "variable",
@@ -11611,8 +11611,8 @@
             "value": "if($kendo-enable-color-system, k-color( on-app-surface ), $kendo-color-black)",
             "scope": "default",
             "line": {
-                "start": 244,
-                "end": 244
+                "start": 241,
+                "end": 241
             }
         },
         "group": [
@@ -11627,8 +11627,8 @@
     {
         "description": "The border color of the treemap title.\n",
         "commentRange": {
-            "start": 245,
-            "end": 246
+            "start": 242,
+            "end": 243
         },
         "context": {
             "type": "variable",
@@ -11636,8 +11636,8 @@
             "value": "var( --kendo-component-border, initial )",
             "scope": "default",
             "line": {
-                "start": 247,
-                "end": 247
+                "start": 244,
+                "end": 244
             }
         },
         "group": [
@@ -11652,8 +11652,8 @@
     {
         "description": "The background color of the Chart overlay.\n",
         "commentRange": {
-            "start": 250,
-            "end": 251
+            "start": 247,
+            "end": 248
         },
         "context": {
             "type": "variable",
@@ -11661,8 +11661,8 @@
             "value": "if($kendo-enable-color-system, k-color(app-surface), $kendo-color-white)",
             "scope": "default",
             "line": {
-                "start": 252,
-                "end": 252
+                "start": 249,
+                "end": 249
             }
         },
         "group": [
@@ -11677,8 +11677,8 @@
     {
         "description": "The font-size of the Chart no data message.\n",
         "commentRange": {
-            "start": 255,
-            "end": 256
+            "start": 252,
+            "end": 253
         },
         "context": {
             "type": "variable",
@@ -11686,8 +11686,8 @@
             "value": "var( --kendo-font-size-lg, inherit )",
             "scope": "default",
             "line": {
-                "start": 257,
-                "end": 257
+                "start": 254,
+                "end": 254
             }
         },
         "group": [
@@ -11702,8 +11702,8 @@
     {
         "description": "The font-weight of the Chart no data message.\n",
         "commentRange": {
-            "start": 258,
-            "end": 259
+            "start": 255,
+            "end": 256
         },
         "context": {
             "type": "variable",
@@ -11711,8 +11711,8 @@
             "value": "var( --kendo-font-weight, normal )",
             "scope": "default",
             "line": {
-                "start": 260,
-                "end": 260
+                "start": 257,
+                "end": 257
             }
         },
         "group": [
@@ -11727,8 +11727,8 @@
     {
         "description": "The text color of the Chart no data message.\n",
         "commentRange": {
-            "start": 261,
-            "end": 262
+            "start": 258,
+            "end": 259
         },
         "context": {
             "type": "variable",
@@ -11736,8 +11736,8 @@
             "value": "if($kendo-enable-color-system, k-color( on-app-surface ), k-get-theme-color-var( neutral-160 ))",
             "scope": "default",
             "line": {
-                "start": 263,
-                "end": 263
+                "start": 260,
+                "end": 260
             }
         },
         "group": [
@@ -11752,8 +11752,8 @@
     {
         "description": "The vertical padding of the Chart no data message.\n",
         "commentRange": {
-            "start": 264,
-            "end": 265
+            "start": 261,
+            "end": 262
         },
         "context": {
             "type": "variable",
@@ -11761,8 +11761,8 @@
             "value": "k-spacing( 25 )",
             "scope": "default",
             "line": {
-                "start": 266,
-                "end": 266
+                "start": 263,
+                "end": 263
             }
         },
         "group": [
@@ -15683,7 +15683,7 @@
         "context": {
             "type": "variable",
             "name": "kendo-color-editor-lg-min-width",
-            "value": "360px",
+            "value": "362px",
             "scope": "default",
             "line": {
                 "start": 20,
@@ -17300,15 +17300,15 @@
         }
     },
     {
-        "description": "The width of the small ColorGradient.\n",
+        "description": "The vertical padding of the small ColorGradient.\n",
         "commentRange": {
             "start": 50,
             "end": 51
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-sm-width",
-            "value": "226px",
+            "name": "kendo-color-gradient-sm-padding-y",
+            "value": "$kendo-color-gradient-padding-y",
             "scope": "default",
             "line": {
                 "start": 52,
@@ -17325,15 +17325,15 @@
         }
     },
     {
-        "description": "The width of the medium ColorGradient.\n",
+        "description": "The horizontal padding of the small ColorGradient.\n",
         "commentRange": {
             "start": 53,
             "end": 54
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-md-width",
-            "value": "$kendo-color-gradient-width",
+            "name": "kendo-color-gradient-sm-padding-x",
+            "value": "$kendo-color-gradient-padding-x",
             "scope": "default",
             "line": {
                 "start": 55,
@@ -17350,15 +17350,15 @@
         }
     },
     {
-        "description": "The width of the large ColorGradient.\n",
+        "description": "The vertical padding of the medium ColorGradient.\n",
         "commentRange": {
             "start": 56,
             "end": 57
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-lg-width",
-            "value": "360px",
+            "name": "kendo-color-gradient-md-padding-y",
+            "value": "$kendo-color-gradient-padding-y",
             "scope": "default",
             "line": {
                 "start": 58,
@@ -17375,19 +17375,19 @@
         }
     },
     {
-        "description": "The spacing between the sections of the small ColorGradient.\n",
+        "description": "The horizontal padding of the medium ColorGradient.\n",
         "commentRange": {
-            "start": 60,
-            "end": 61
+            "start": 59,
+            "end": 60
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-sm-spacing",
-            "value": "$kendo-color-gradient-spacing",
+            "name": "kendo-color-gradient-md-padding-x",
+            "value": "$kendo-color-gradient-padding-x",
             "scope": "default",
             "line": {
-                "start": 62,
-                "end": 62
+                "start": 61,
+                "end": 61
             }
         },
         "group": [
@@ -17400,19 +17400,19 @@
         }
     },
     {
-        "description": "The spacing between the sections of the medium ColorGradient.\n",
+        "description": "The vertical padding of the large ColorGradient.\n",
         "commentRange": {
-            "start": 63,
-            "end": 64
+            "start": 62,
+            "end": 63
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-md-spacing",
-            "value": "$kendo-color-gradient-spacing",
+            "name": "kendo-color-gradient-lg-padding-y",
+            "value": "k-spacing(4)",
             "scope": "default",
             "line": {
-                "start": 65,
-                "end": 65
+                "start": 64,
+                "end": 64
             }
         },
         "group": [
@@ -17425,19 +17425,19 @@
         }
     },
     {
-        "description": "The spacing between the sections of the large ColorGradient.\n",
+        "description": "The horizontal padding of the large ColorGradient.\n",
         "commentRange": {
-            "start": 66,
-            "end": 67
+            "start": 65,
+            "end": 66
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-lg-spacing",
-            "value": "k-spacing(4.5)",
+            "name": "kendo-color-gradient-lg-padding-x",
+            "value": "k-spacing(4)",
             "scope": "default",
             "line": {
-                "start": 68,
-                "end": 68
+                "start": 67,
+                "end": 67
             }
         },
         "group": [
@@ -17450,19 +17450,19 @@
         }
     },
     {
-        "description": "The border color of the focused ColorGradient.\n",
+        "description": "The width of the small ColorGradient.\n",
         "commentRange": {
-            "start": 70,
-            "end": 71
+            "start": 69,
+            "end": 70
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-focus-border",
-            "value": "if($kendo-enable-color-system, color-mix(in srgb, k-color( border ) 10%, transparent), k-get-theme-color-var( neutral-20 ))",
+            "name": "kendo-color-gradient-sm-width",
+            "value": "236px",
             "scope": "default",
             "line": {
-                "start": 72,
-                "end": 72
+                "start": 71,
+                "end": 71
             }
         },
         "group": [
@@ -17475,19 +17475,19 @@
         }
     },
     {
-        "description": "The box shadow of the focused ColorGradient.\n",
+        "description": "The width of the medium ColorGradient.\n",
         "commentRange": {
-            "start": 73,
-            "end": 74
+            "start": 72,
+            "end": 73
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-focus-shadow",
-            "value": "var( --kendo-box-shadow-depth-3, none )",
+            "name": "kendo-color-gradient-md-width",
+            "value": "$kendo-color-gradient-width",
             "scope": "default",
             "line": {
-                "start": 75,
-                "end": 75
+                "start": 74,
+                "end": 74
             }
         },
         "group": [
@@ -17500,19 +17500,19 @@
         }
     },
     {
-        "description": "The width of the border around the ColorGradient canvas.\n",
+        "description": "The width of the large ColorGradient.\n",
         "commentRange": {
-            "start": 77,
-            "end": 78
+            "start": 75,
+            "end": 76
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-canvas-border-width",
-            "value": "0",
+            "name": "kendo-color-gradient-lg-width",
+            "value": "362px",
             "scope": "default",
             "line": {
-                "start": 79,
-                "end": 79
+                "start": 77,
+                "end": 77
             }
         },
         "group": [
@@ -17525,19 +17525,19 @@
         }
     },
     {
-        "description": "The border radius of the ColorGradient canvas.\n",
+        "description": "The spacing between the sections of the small ColorGradient.\n",
         "commentRange": {
-            "start": 80,
-            "end": 81
+            "start": 79,
+            "end": 80
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-canvas-border-radius",
-            "value": "k-border-radius(md)",
+            "name": "kendo-color-gradient-sm-spacing",
+            "value": "$kendo-color-gradient-spacing",
             "scope": "default",
             "line": {
-                "start": 82,
-                "end": 82
+                "start": 81,
+                "end": 81
             }
         },
         "group": [
@@ -17550,19 +17550,19 @@
         }
     },
     {
-        "description": "The spacing between the items of the ColorGradient canvas.\n",
+        "description": "The spacing between the sections of the medium ColorGradient.\n",
         "commentRange": {
-            "start": 83,
-            "end": 84
+            "start": 82,
+            "end": 83
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-canvas-spacing",
-            "value": "k-spacing(2)",
+            "name": "kendo-color-gradient-md-spacing",
+            "value": "$kendo-color-gradient-spacing",
             "scope": "default",
             "line": {
-                "start": 85,
-                "end": 85
+                "start": 84,
+                "end": 84
             }
         },
         "group": [
@@ -17575,19 +17575,19 @@
         }
     },
     {
-        "description": "The height the ColorGradient canvas hsv rectangle.\n",
+        "description": "The spacing between the sections of the large ColorGradient.\n",
         "commentRange": {
-            "start": 86,
-            "end": 87
+            "start": 85,
+            "end": 86
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-canvas-rectangle-height",
-            "value": "180px",
+            "name": "kendo-color-gradient-lg-spacing",
+            "value": "k-spacing(4.5)",
             "scope": "default",
             "line": {
-                "start": 88,
-                "end": 88
+                "start": 87,
+                "end": 87
             }
         },
         "group": [
@@ -17600,15 +17600,15 @@
         }
     },
     {
-        "description": "The height the small ColorGradient canvas hsv rectangle.\n",
+        "description": "The border color of the focused ColorGradient.\n",
         "commentRange": {
             "start": 89,
             "end": 90
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-sm-canvas-rectangle-height",
-            "value": "164px",
+            "name": "kendo-color-gradient-focus-border",
+            "value": "if($kendo-enable-color-system, color-mix(in srgb, k-color( border ) 10%, transparent), k-get-theme-color-var( neutral-20 ))",
             "scope": "default",
             "line": {
                 "start": 91,
@@ -17625,15 +17625,15 @@
         }
     },
     {
-        "description": "The height the medium ColorGradient canvas hsv rectangle.\n",
+        "description": "The box shadow of the focused ColorGradient.\n",
         "commentRange": {
             "start": 92,
             "end": 93
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-md-canvas-rectangle-height",
-            "value": "$kendo-color-gradient-canvas-rectangle-height",
+            "name": "kendo-color-gradient-focus-shadow",
+            "value": "var( --kendo-box-shadow-depth-3, none )",
             "scope": "default",
             "line": {
                 "start": 94,
@@ -17650,19 +17650,19 @@
         }
     },
     {
-        "description": "The height the large ColorGradient canvas hsv rectangle.\n",
+        "description": "The width of the border around the ColorGradient canvas.\n",
         "commentRange": {
-            "start": 95,
-            "end": 96
+            "start": 96,
+            "end": 97
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-lg-canvas-rectangle-height",
-            "value": "256px",
+            "name": "kendo-color-gradient-canvas-border-width",
+            "value": "0",
             "scope": "default",
             "line": {
-                "start": 97,
-                "end": 97
+                "start": 98,
+                "end": 98
             }
         },
         "group": [
@@ -17675,15 +17675,15 @@
         }
     },
     {
-        "description": "The spacing between the items of the small ColorGradient canvas.\n",
+        "description": "The border radius of the ColorGradient canvas.\n",
         "commentRange": {
             "start": 99,
             "end": 100
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-sm-canvas-spacing",
-            "value": "$kendo-color-gradient-canvas-spacing",
+            "name": "kendo-color-gradient-canvas-border-radius",
+            "value": "k-border-radius(md)",
             "scope": "default",
             "line": {
                 "start": 101,
@@ -17700,15 +17700,15 @@
         }
     },
     {
-        "description": "The spacing between the items of the medium ColorGradient canvas.\n",
+        "description": "The spacing between the items of the ColorGradient canvas.\n",
         "commentRange": {
             "start": 102,
             "end": 103
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-md-canvas-spacing",
-            "value": "$kendo-color-gradient-canvas-spacing",
+            "name": "kendo-color-gradient-canvas-spacing",
+            "value": "k-spacing(2)",
             "scope": "default",
             "line": {
                 "start": 104,
@@ -17725,15 +17725,15 @@
         }
     },
     {
-        "description": "The spacing between the items of the large ColorGradient canvas.\n",
+        "description": "The height the ColorGradient canvas hsv rectangle.\n",
         "commentRange": {
             "start": 105,
             "end": 106
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-gradient-lg-canvas-spacing",
-            "value": "k-spacing(4)",
+            "name": "kendo-color-gradient-canvas-rectangle-height",
+            "value": "180px",
             "scope": "default",
             "line": {
                 "start": 107,
@@ -17749,11 +17749,161 @@
             "name": "_variables.scss"
         }
     },
+    {
+        "description": "The height the small ColorGradient canvas hsv rectangle.\n",
+        "commentRange": {
+            "start": 108,
+            "end": 109
+        },
+        "context": {
+            "type": "variable",
+            "name": "kendo-color-gradient-sm-canvas-rectangle-height",
+            "value": "164px",
+            "scope": "default",
+            "line": {
+                "start": 110,
+                "end": 110
+            }
+        },
+        "group": [
+            "color-gradient"
+        ],
+        "access": "public",
+        "file": {
+            "path": "colorgradient/_variables.scss",
+            "name": "_variables.scss"
+        }
+    },
+    {
+        "description": "The height the medium ColorGradient canvas hsv rectangle.\n",
+        "commentRange": {
+            "start": 111,
+            "end": 112
+        },
+        "context": {
+            "type": "variable",
+            "name": "kendo-color-gradient-md-canvas-rectangle-height",
+            "value": "$kendo-color-gradient-canvas-rectangle-height",
+            "scope": "default",
+            "line": {
+                "start": 113,
+                "end": 113
+            }
+        },
+        "group": [
+            "color-gradient"
+        ],
+        "access": "public",
+        "file": {
+            "path": "colorgradient/_variables.scss",
+            "name": "_variables.scss"
+        }
+    },
+    {
+        "description": "The height the large ColorGradient canvas hsv rectangle.\n",
+        "commentRange": {
+            "start": 114,
+            "end": 115
+        },
+        "context": {
+            "type": "variable",
+            "name": "kendo-color-gradient-lg-canvas-rectangle-height",
+            "value": "256px",
+            "scope": "default",
+            "line": {
+                "start": 116,
+                "end": 116
+            }
+        },
+        "group": [
+            "color-gradient"
+        ],
+        "access": "public",
+        "file": {
+            "path": "colorgradient/_variables.scss",
+            "name": "_variables.scss"
+        }
+    },
+    {
+        "description": "The spacing between the items of the small ColorGradient canvas.\n",
+        "commentRange": {
+            "start": 118,
+            "end": 119
+        },
+        "context": {
+            "type": "variable",
+            "name": "kendo-color-gradient-sm-canvas-spacing",
+            "value": "$kendo-color-gradient-canvas-spacing",
+            "scope": "default",
+            "line": {
+                "start": 120,
+                "end": 120
+            }
+        },
+        "group": [
+            "color-gradient"
+        ],
+        "access": "public",
+        "file": {
+            "path": "colorgradient/_variables.scss",
+            "name": "_variables.scss"
+        }
+    },
+    {
+        "description": "The spacing between the items of the medium ColorGradient canvas.\n",
+        "commentRange": {
+            "start": 121,
+            "end": 122
+        },
+        "context": {
+            "type": "variable",
+            "name": "kendo-color-gradient-md-canvas-spacing",
+            "value": "$kendo-color-gradient-canvas-spacing",
+            "scope": "default",
+            "line": {
+                "start": 123,
+                "end": 123
+            }
+        },
+        "group": [
+            "color-gradient"
+        ],
+        "access": "public",
+        "file": {
+            "path": "colorgradient/_variables.scss",
+            "name": "_variables.scss"
+        }
+    },
+    {
+        "description": "The spacing between the items of the large ColorGradient canvas.\n",
+        "commentRange": {
+            "start": 124,
+            "end": 125
+        },
+        "context": {
+            "type": "variable",
+            "name": "kendo-color-gradient-lg-canvas-spacing",
+            "value": "k-spacing(4)",
+            "scope": "default",
+            "line": {
+                "start": 126,
+                "end": 126
+            }
+        },
+        "group": [
+            "color-gradient"
+        ],
+        "access": "public",
+        "file": {
+            "path": "colorgradient/_variables.scss",
+            "name": "_variables.scss"
+        }
+    },
     {
         "description": "The border color of the ColorGradient canvas hsv rectangle.\n",
         "commentRange": {
-            "start": 109,
-            "end": 110
+            "start": 128,
+            "end": 129
         },
         "context": {
             "type": "variable",
@@ -17761,8 +17911,8 @@
             "value": "if($kendo-enable-color-system, color-mix(in srgb, k-color( border ) 16%, transparent), k-get-theme-color-var( neutral-30 ))",
             "scope": "default",
             "line": {
-                "start": 111,
-                "end": 111
+                "start": 130,
+                "end": 130
             }
         },
         "group": [
@@ -17777,8 +17927,8 @@
     {
         "description": "The box shadow of the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 112,
-            "end": 113
+            "start": 131,
+            "end": 132
         },
         "context": {
             "type": "variable",
@@ -17786,8 +17936,8 @@
             "value": "var( --kendo-box-shadow-depth-2, none )",
             "scope": "default",
             "line": {
-                "start": 114,
-                "end": 114
+                "start": 133,
+                "end": 133
             }
         },
         "group": [
@@ -17802,8 +17952,8 @@
     {
         "description": "The width of the ColorGradient slider.\n",
         "commentRange": {
-            "start": 116,
-            "end": 117
+            "start": 135,
+            "end": 136
         },
         "context": {
             "type": "variable",
@@ -17811,8 +17961,8 @@
             "value": "20px",
             "scope": "default",
             "line": {
-                "start": 118,
-                "end": 118
+                "start": 137,
+                "end": 137
             }
         },
         "group": [
@@ -17827,8 +17977,8 @@
     {
         "description": "The border radius of the ColorGradient slider.\n",
         "commentRange": {
-            "start": 119,
-            "end": 120
+            "start": 138,
+            "end": 139
         },
         "context": {
             "type": "variable",
@@ -17836,8 +17986,8 @@
             "value": "k-border-radius(md)",
             "scope": "default",
             "line": {
-                "start": 121,
-                "end": 121
+                "start": 140,
+                "end": 140
             }
         },
         "group": [
@@ -17852,8 +18002,8 @@
     {
         "description": "The width of the border around the ColorGradient slider.\n",
         "commentRange": {
-            "start": 122,
-            "end": 123
+            "start": 141,
+            "end": 142
         },
         "context": {
             "type": "variable",
@@ -17861,8 +18011,8 @@
             "value": "if($kendo-enable-color-system, 0, 1px)",
             "scope": "default",
             "line": {
-                "start": 124,
-                "end": 124
+                "start": 143,
+                "end": 143
             }
         },
         "group": [
@@ -17877,8 +18027,8 @@
     {
         "description": "The color of the border around the ColorGradient slider.\n",
         "commentRange": {
-            "start": 125,
-            "end": 126
+            "start": 144,
+            "end": 145
         },
         "context": {
             "type": "variable",
@@ -17886,8 +18036,8 @@
             "value": "if($kendo-enable-color-system, color-mix(in srgb, k-color( border ) 16%, transparent), k-get-theme-color-var( neutral-30 ))",
             "scope": "default",
             "line": {
-                "start": 127,
-                "end": 127
+                "start": 146,
+                "end": 146
             }
         },
         "group": [
@@ -17902,8 +18052,8 @@
     {
         "description": "The height of the ColorGradient vertical slider.\n",
         "commentRange": {
-            "start": 129,
-            "end": 130
+            "start": 148,
+            "end": 149
         },
         "context": {
             "type": "variable",
@@ -17911,8 +18061,8 @@
             "value": "180px",
             "scope": "default",
             "line": {
-                "start": 131,
-                "end": 131
+                "start": 150,
+                "end": 150
             }
         },
         "group": [
@@ -17927,8 +18077,8 @@
     {
         "description": "The width of the ColorGradient horizontal slider.\n",
         "commentRange": {
-            "start": 132,
-            "end": 133
+            "start": 151,
+            "end": 152
         },
         "context": {
             "type": "variable",
@@ -17936,8 +18086,8 @@
             "value": "100%",
             "scope": "default",
             "line": {
-                "start": 134,
-                "end": 134
+                "start": 153,
+                "end": 153
             }
         },
         "group": [
@@ -17952,8 +18102,8 @@
     {
         "description": "The background image of the ColorGradient alpha slider.\n",
         "commentRange": {
-            "start": 135,
-            "end": 136
+            "start": 154,
+            "end": 155
         },
         "context": {
             "type": "variable",
@@ -17961,8 +18111,8 @@
             "value": "\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAuSURBVHgBxYyxDQAwDMJIL+YT+DjtzFRliUfLcklqBCRT4eCTxbD6kdL2/LgYXqpvCbs3kBv/AAAAAElFTkSuQmCC\"",
             "scope": "default",
             "line": {
-                "start": 137,
-                "end": 137
+                "start": 156,
+                "end": 156
             }
         },
         "group": [
@@ -17977,8 +18127,8 @@
     {
         "description": "The height of the small ColorGradient vertical slider.\n",
         "commentRange": {
-            "start": 138,
-            "end": 139
+            "start": 157,
+            "end": 158
         },
         "context": {
             "type": "variable",
@@ -17986,8 +18136,8 @@
             "value": "164px",
             "scope": "default",
             "line": {
-                "start": 140,
-                "end": 140
+                "start": 159,
+                "end": 159
             }
         },
         "group": [
@@ -18002,8 +18152,8 @@
     {
         "description": "The height of the medium ColorGradient vertical slider.\n",
         "commentRange": {
-            "start": 141,
-            "end": 142
+            "start": 160,
+            "end": 161
         },
         "context": {
             "type": "variable",
@@ -18011,8 +18161,8 @@
             "value": "$kendo-color-gradient-slider-vertical-size",
             "scope": "default",
             "line": {
-                "start": 143,
-                "end": 143
+                "start": 162,
+                "end": 162
             }
         },
         "group": [
@@ -18027,8 +18177,8 @@
     {
         "description": "The height of the large ColorGradient vertical slider.\n",
         "commentRange": {
-            "start": 144,
-            "end": 145
+            "start": 163,
+            "end": 164
         },
         "context": {
             "type": "variable",
@@ -18036,8 +18186,8 @@
             "value": "256px",
             "scope": "default",
             "line": {
-                "start": 146,
-                "end": 146
+                "start": 165,
+                "end": 165
             }
         },
         "group": [
@@ -18052,8 +18202,8 @@
     {
         "description": "The width of the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 148,
-            "end": 149
+            "start": 167,
+            "end": 168
         },
         "context": {
             "type": "variable",
@@ -18061,8 +18211,8 @@
             "value": "20px",
             "scope": "default",
             "line": {
-                "start": 150,
-                "end": 150
+                "start": 169,
+                "end": 169
             }
         },
         "group": [
@@ -18077,8 +18227,8 @@
     {
         "description": "The height of the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 151,
-            "end": 152
+            "start": 170,
+            "end": 171
         },
         "context": {
             "type": "variable",
@@ -18086,8 +18236,8 @@
             "value": "20px",
             "scope": "default",
             "line": {
-                "start": 153,
-                "end": 153
+                "start": 172,
+                "end": 172
             }
         },
         "group": [
@@ -18102,8 +18252,8 @@
     {
         "description": "The width of the border around the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 154,
-            "end": 155
+            "start": 173,
+            "end": 174
         },
         "context": {
             "type": "variable",
@@ -18111,8 +18261,8 @@
             "value": "2px",
             "scope": "default",
             "line": {
-                "start": 156,
-                "end": 156
+                "start": 175,
+                "end": 175
             }
         },
         "group": [
@@ -18127,8 +18277,8 @@
     {
         "description": "The width of the outline around the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 157,
-            "end": 158
+            "start": 176,
+            "end": 177
         },
         "context": {
             "type": "variable",
@@ -18136,8 +18286,8 @@
             "value": "1px",
             "scope": "default",
             "line": {
-                "start": 159,
-                "end": 159
+                "start": 178,
+                "end": 178
             }
         },
         "group": [
@@ -18152,8 +18302,8 @@
     {
         "description": "The color of the border around the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 160,
-            "end": 161
+            "start": 179,
+            "end": 180
         },
         "context": {
             "type": "variable",
@@ -18161,8 +18311,8 @@
             "value": "if($kendo-enable-color-system, k-color( app-surface ), $kendo-color-white)",
             "scope": "default",
             "line": {
-                "start": 162,
-                "end": 162
+                "start": 181,
+                "end": 181
             }
         },
         "group": [
@@ -18177,8 +18327,8 @@
     {
         "description": "The box shadow of the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 163,
-            "end": 164
+            "start": 182,
+            "end": 183
         },
         "context": {
             "type": "variable",
@@ -18186,8 +18336,8 @@
             "value": "var( --kendo-box-shadow-depth-2, none )",
             "scope": "default",
             "line": {
-                "start": 165,
-                "end": 165
+                "start": 184,
+                "end": 184
             }
         },
         "group": [
@@ -18202,8 +18352,8 @@
     {
         "description": "The color of the border around the focused ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 166,
-            "end": 167
+            "start": 185,
+            "end": 186
         },
         "context": {
             "type": "variable",
@@ -18211,8 +18361,8 @@
             "value": "if($kendo-enable-color-system, k-color( app-surface ), $kendo-color-white)",
             "scope": "default",
             "line": {
-                "start": 168,
-                "end": 168
+                "start": 187,
+                "end": 187
             }
         },
         "group": [
@@ -18227,8 +18377,8 @@
     {
         "description": "The focus color of the outline around the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 169,
-            "end": 170
+            "start": 188,
+            "end": 189
         },
         "context": {
             "type": "variable",
@@ -18236,8 +18386,8 @@
             "value": "if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130 ))",
             "scope": "default",
             "line": {
-                "start": 171,
-                "end": 171
+                "start": 190,
+                "end": 190
             }
         },
         "group": [
@@ -18252,8 +18402,8 @@
     {
         "description": "The hover color of the outline around the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 172,
-            "end": 173
+            "start": 191,
+            "end": 192
         },
         "context": {
             "type": "variable",
@@ -18261,8 +18411,8 @@
             "value": "if($kendo-enable-color-system, k-color( base-emphasis ), k-get-theme-color-var( neutral-130 ))",
             "scope": "default",
             "line": {
-                "start": 174,
-                "end": 174
+                "start": 193,
+                "end": 193
             }
         },
         "group": [
@@ -18277,8 +18427,8 @@
     {
         "description": "The vertical offset of the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 176,
-            "end": 177
+            "start": 195,
+            "end": 196
         },
         "context": {
             "type": "variable",
@@ -18286,8 +18436,8 @@
             "value": "( -1 * math.div( $kendo-color-gradient-draghandle-height, 2 ) )",
             "scope": "default",
             "line": {
-                "start": 178,
-                "end": 178
+                "start": 197,
+                "end": 197
             }
         },
         "group": [
@@ -18302,8 +18452,8 @@
     {
         "description": "The horizontal offset of the ColorGradient canvas drag handle.\n",
         "commentRange": {
-            "start": 179,
-            "end": 180
+            "start": 198,
+            "end": 199
         },
         "context": {
             "type": "variable",
@@ -18311,8 +18461,8 @@
             "value": "( -1 * math.div( $kendo-color-gradient-draghandle-width, 2 ) )",
             "scope": "default",
             "line": {
-                "start": 181,
-                "end": 181
+                "start": 200,
+                "end": 200
             }
         },
         "group": [
@@ -18327,8 +18477,8 @@
     {
         "description": "The width of the ColorGradient input.\n",
         "commentRange": {
-            "start": 183,
-            "end": 184
+            "start": 202,
+            "end": 203
         },
         "context": {
             "type": "variable",
@@ -18336,8 +18486,8 @@
             "value": "48px",
             "scope": "default",
             "line": {
-                "start": 185,
-                "end": 185
+                "start": 204,
+                "end": 204
             }
         },
         "group": [
@@ -18352,8 +18502,8 @@
     {
         "description": "The spacing between the ColorGradient inputs.\n",
         "commentRange": {
-            "start": 186,
-            "end": 187
+            "start": 205,
+            "end": 206
         },
         "context": {
             "type": "variable",
@@ -18361,8 +18511,8 @@
             "value": "calc( #{$kendo-color-gradient-spacer} / 4 )",
             "scope": "default",
             "line": {
-                "start": 188,
-                "end": 188
+                "start": 207,
+                "end": 207
             }
         },
         "group": [
@@ -18377,8 +18527,8 @@
     {
         "description": "The font size of the ColorGradient input labels.\n",
         "commentRange": {
-            "start": 189,
-            "end": 190
+            "start": 208,
+            "end": 209
         },
         "context": {
             "type": "variable",
@@ -18386,8 +18536,8 @@
             "value": "var( --kendo-font-size-sm, inherit )",
             "scope": "default",
             "line": {
-                "start": 191,
-                "end": 191
+                "start": 210,
+                "end": 210
             }
         },
         "group": [
@@ -18402,8 +18552,8 @@
     {
         "description": "The spacing between the ColorGradient inputs and their labels.\n",
         "commentRange": {
-            "start": 192,
-            "end": 193
+            "start": 211,
+            "end": 212
         },
         "context": {
             "type": "variable",
@@ -18411,8 +18561,8 @@
             "value": "calc( #{$kendo-color-gradient-spacer} / 4 )",
             "scope": "default",
             "line": {
-                "start": 194,
-                "end": 194
+                "start": 213,
+                "end": 213
             }
         },
         "group": [
@@ -18427,8 +18577,8 @@
     {
         "description": "The text color of the ColorGradient input labels.\n",
         "commentRange": {
-            "start": 195,
-            "end": 196
+            "start": 214,
+            "end": 215
         },
         "context": {
             "type": "variable",
@@ -18436,8 +18586,8 @@
             "value": "var( --kendo-subtle-text, inherit )",
             "scope": "default",
             "line": {
-                "start": 197,
-                "end": 197
+                "start": 216,
+                "end": 216
             }
         },
         "group": [
@@ -18452,17 +18602,17 @@
     {
         "description": "The width of the small ColorGradient input.\n",
         "commentRange": {
-            "start": 199,
-            "end": 200
+            "start": 218,
+            "end": 219
         },
         "context": {
             "type": "variable",
             "name": "kendo-color-gradient-sm-input-width",
-            "value": "43.5px",
+            "value": "43px",
             "scope": "default",
             "line": {
-                "start": 201,
-                "end": 201
+                "start": 220,
+                "end": 220
             }
         },
         "group": [
@@ -18477,8 +18627,8 @@
     {
         "description": "The width of the medium ColorGradient input.\n",
         "commentRange": {
-            "start": 202,
-            "end": 203
+            "start": 221,
+            "end": 222
         },
         "context": {
             "type": "variable",
@@ -18486,8 +18636,8 @@
             "value": "$kendo-color-gradient-input-width",
             "scope": "default",
             "line": {
-                "start": 204,
-                "end": 204
+                "start": 223,
+                "end": 223
             }
         },
         "group": [
@@ -18502,17 +18652,17 @@
     {
         "description": "The width of the large ColorGradient input.\n",
         "commentRange": {
-            "start": 205,
-            "end": 206
+            "start": 224,
+            "end": 225
         },
         "context": {
             "type": "variable",
             "name": "kendo-color-gradient-lg-input-width",
-            "value": "50.5px",
+            "value": "68px",
             "scope": "default",
             "line": {
-                "start": 207,
-                "end": 207
+                "start": 226,
+                "end": 226
             }
         },
         "group": [
@@ -18527,8 +18677,8 @@
     {
         "description": "The font weight of the ColorGradient contrast ratio text.\n",
         "commentRange": {
-            "start": 209,
-            "end": 210
+            "start": 228,
+            "end": 229
         },
         "context": {
             "type": "variable",
@@ -18536,8 +18686,8 @@
             "value": "var( --kendo-font-weight-bold, normal )",
             "scope": "default",
             "line": {
-                "start": 211,
-                "end": 211
+                "start": 230,
+                "end": 230
             }
         },
         "group": [
@@ -18552,8 +18702,8 @@
     {
         "description": "The spacing between the items in the ColorGradient contrast tool.\n",
         "commentRange": {
-            "start": 212,
-            "end": 213
+            "start": 231,
+            "end": 232
         },
         "context": {
             "type": "variable",
@@ -18561,8 +18711,8 @@
             "value": "calc( #{$kendo-color-gradient-spacer} / 1.5 )",
             "scope": "default",
             "line": {
-                "start": 214,
-                "end": 214
+                "start": 233,
+                "end": 233
             }
         },
         "group": [
@@ -18577,17 +18727,17 @@
     {
         "description": "The size map of the ColorGradient.\n",
         "commentRange": {
-            "start": 216,
-            "end": 217
+            "start": 235,
+            "end": 236
         },
         "context": {
             "type": "variable",
             "name": "kendo-color-gradient-sizes",
-            "value": "(\n    sm: (\n        width: $kendo-color-gradient-sm-width,\n        vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size,\n        rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height,\n        input-width: $kendo-color-gradient-sm-input-width,\n        spacing: $kendo-color-gradient-sm-spacing,\n        canvas-spacing: $kendo-color-gradient-sm-canvas-spacing\n    ),\n    md: (\n        width: $kendo-color-gradient-md-width,\n        vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size,\n        rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height,\n        input-width: $kendo-color-gradient-md-input-width,\n        spacing: $kendo-color-gradient-md-spacing,\n        canvas-spacing: $kendo-color-gradient-md-canvas-spacing\n    ),\n    lg: (\n        width: $kendo-color-gradient-lg-width,\n        vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size,\n        rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height,\n        input-width: $kendo-color-gradient-lg-input-width,\n        spacing: $kendo-color-gradient-lg-spacing,\n        canvas-spacing: $kendo-color-gradient-lg-canvas-spacing\n    )\n)",
+            "value": "(\n    sm: (\n        width: $kendo-color-gradient-sm-width,\n        vertical-slider-height: $kendo-color-gradient-sm-slider-vertical-size,\n        rectangle-height: $kendo-color-gradient-sm-canvas-rectangle-height,\n        input-width: $kendo-color-gradient-sm-input-width,\n        spacing: $kendo-color-gradient-sm-spacing,\n        canvas-spacing: $kendo-color-gradient-sm-canvas-spacing,\n        padding-x: $kendo-color-gradient-sm-padding-x,\n        padding-y: $kendo-color-gradient-sm-padding-y\n    ),\n    md: (\n        width: $kendo-color-gradient-md-width,\n        vertical-slider-height: $kendo-color-gradient-md-slider-vertical-size,\n        rectangle-height: $kendo-color-gradient-md-canvas-rectangle-height,\n        input-width: $kendo-color-gradient-md-input-width,\n        spacing: $kendo-color-gradient-md-spacing,\n        canvas-spacing: $kendo-color-gradient-md-canvas-spacing,\n        padding-x: $kendo-color-gradient-md-padding-x,\n        padding-y: $kendo-color-gradient-md-padding-y\n    ),\n    lg: (\n        width: $kendo-color-gradient-lg-width,\n        vertical-slider-height: $kendo-color-gradient-lg-slider-vertical-size,\n        rectangle-height: $kendo-color-gradient-lg-canvas-rectangle-height,\n        input-width: $kendo-color-gradient-lg-input-width,\n        spacing: $kendo-color-gradient-lg-spacing,\n        canvas-spacing: $kendo-color-gradient-lg-canvas-spacing,\n        padding-x: $kendo-color-gradient-lg-padding-x,\n        padding-y: $kendo-color-gradient-lg-padding-y\n    )\n)",
             "scope": "default",
             "line": {
-                "start": 218,
-                "end": 243
+                "start": 237,
+                "end": 268
             }
         },
         "group": [
@@ -18807,7 +18957,7 @@
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-palette-tile-sm-width",
+            "name": "kendo-color-palette-sm-tile-width",
             "value": "k-spacing(5.5)",
             "scope": "default",
             "line": {
@@ -18832,8 +18982,8 @@
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-palette-tile-sm-height",
-            "value": "$kendo-color-palette-tile-sm-width",
+            "name": "kendo-color-palette-sm-tile-height",
+            "value": "$kendo-color-palette-sm-tile-width",
             "scope": "default",
             "line": {
                 "start": 34,
@@ -18857,7 +19007,7 @@
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-palette-tile-md-width",
+            "name": "kendo-color-palette-md-tile-width",
             "value": "$kendo-color-palette-tile-width",
             "scope": "default",
             "line": {
@@ -18882,7 +19032,7 @@
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-palette-tile-md-height",
+            "name": "kendo-color-palette-md-tile-height",
             "value": "$kendo-color-palette-tile-height",
             "scope": "default",
             "line": {
@@ -18907,7 +19057,7 @@
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-palette-tile-lg-width",
+            "name": "kendo-color-palette-lg-tile-width",
             "value": "k-spacing(8)",
             "scope": "default",
             "line": {
@@ -18932,8 +19082,8 @@
         },
         "context": {
             "type": "variable",
-            "name": "kendo-color-palette-tile-lg-height",
-            "value": "$kendo-color-palette-tile-lg-width",
+            "name": "kendo-color-palette-lg-tile-height",
+            "value": "$kendo-color-palette-lg-tile-width",
             "scope": "default",
             "line": {
                 "start": 46,
@@ -19133,7 +19283,7 @@
         "context": {
             "type": "variable",
             "name": "kendo-color-palette-sizes",
-            "value": "(\n    sm: (\n        width: $kendo-color-palette-tile-sm-width,\n        height: $kendo-color-palette-tile-sm-height\n    ),\n    md: (\n        width: $kendo-color-palette-tile-md-width,\n        height: $kendo-color-palette-tile-md-height\n    ),\n    lg: (\n        width: $kendo-color-palette-tile-lg-width,\n        height: $kendo-color-palette-tile-lg-height\n    )\n)",
+            "value": "(\n    sm: (\n        width: $kendo-color-palette-sm-tile-width,\n        height: $kendo-color-palette-sm-tile-height\n    ),\n    md: (\n        width: $kendo-color-palette-md-tile-width,\n        height: $kendo-color-palette-md-tile-height\n    ),\n    lg: (\n        width: $kendo-color-palette-lg-tile-width,\n        height: $kendo-color-palette-lg-tile-height\n    )\n)",
             "scope": "default",
             "line": {
                 "start": 72,