@progress/kendo-theme-utils 7.2.2-dev.0 → 7.3.0-dev.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/all.css +66 -306
  2. package/dist/all.scss +1700 -36
  3. package/dist/meta/sassdoc-data.json +19 -19
  4. package/dist/meta/sassdoc-raw-data.json +19 -19
  5. package/dist/meta/variables.json +167 -3
  6. package/package.json +3 -3
  7. package/scss/_mixins.scss +13 -4
  8. package/scss/_variables.scss +46 -4
  9. package/scss/background/_background-color.scss +1 -1
  10. package/scss/border/_border-color.scss +1 -7
  11. package/scss/border/_outline-color.scss +1 -1
  12. package/scss/elevation/index.import.scss +1 -1
  13. package/scss/typography/_text-color.scss +2 -2
package/dist/meta/sassdoc-data.json CHANGED
@@ -1663,7 +1663,7 @@
1663
1663
  "context": {
1664
1664
  "type": "css",
1665
1665
  "name": ".k-bg-inherit",
1666
- "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color );",
1666
+ "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color, $css-var: 'color' );",
1667
1667
  "line": {
1668
1668
  "start": 25,
1669
1669
  "end": 32
@@ -1694,7 +1694,7 @@
1694
1694
  "context": {
1695
1695
  "type": "css",
1696
1696
  "name": ".k-bg-transparent",
1697
- "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color );",
1697
+ "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color, $css-var: 'color' );",
1698
1698
  "line": {
1699
1699
  "start": 25,
1700
1700
  "end": 32
@@ -1725,7 +1725,7 @@
1725
1725
  "context": {
1726
1726
  "type": "css",
1727
1727
  "name": ".k-bg-black",
1728
- "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color );",
1728
+ "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color, $css-var: 'color' );",
1729
1729
  "line": {
1730
1730
  "start": 25,
1731
1731
  "end": 32
@@ -1756,7 +1756,7 @@
1756
1756
  "context": {
1757
1757
  "type": "css",
1758
1758
  "name": ".k-bg-white",
1759
- "code": "\n\n // Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color );\n\n",
1759
+ "code": "\n\n // Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color, $css-var: 'color' );\n\n",
1760
1760
  "line": {
1761
1761
  "start": 25,
1762
1762
  "end": 31
@@ -2225,10 +2225,10 @@
2225
2225
  "context": {
2226
2226
  "type": "css",
2227
2227
  "name": ".k-border-white",
2228
- "code": "\n\n // Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color );\n @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );\n @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );\n @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );\n @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );\n @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );\n @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );\n\n",
2228
+ "code": "\n\n // Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );\n\n",
2229
2229
  "line": {
2230
2230
  "start": 31,
2231
- "end": 44
2231
+ "end": 38
2232
2232
  }
2233
2233
  },
2234
2234
  "example": [
@@ -2257,10 +2257,10 @@
2257
2257
  "context": {
2258
2258
  "type": "css",
2259
2259
  "name": ".k-border-inherit",
2260
- "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color );\n @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );\n @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );\n @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );\n @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );\n @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );\n @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );",
2260
+ "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );",
2261
2261
  "line": {
2262
2262
  "start": 32,
2263
- "end": 45
2263
+ "end": 39
2264
2264
  }
2265
2265
  },
2266
2266
  "example": [
@@ -2288,10 +2288,10 @@
2288
2288
  "context": {
2289
2289
  "type": "css",
2290
2290
  "name": ".k-border-currentColor",
2291
- "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color );\n @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );\n @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );\n @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );\n @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );\n @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );\n @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );",
2291
+ "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );",
2292
2292
  "line": {
2293
2293
  "start": 32,
2294
- "end": 45
2294
+ "end": 39
2295
2295
  }
2296
2296
  },
2297
2297
  "example": [
@@ -2319,10 +2319,10 @@
2319
2319
  "context": {
2320
2320
  "type": "css",
2321
2321
  "name": ".k-border-transparent",
2322
- "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color );\n @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );\n @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );\n @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );\n @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );\n @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );\n @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );",
2322
+ "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );",
2323
2323
  "line": {
2324
2324
  "start": 32,
2325
- "end": 45
2325
+ "end": 39
2326
2326
  }
2327
2327
  },
2328
2328
  "example": [
@@ -2350,10 +2350,10 @@
2350
2350
  "context": {
2351
2351
  "type": "css",
2352
2352
  "name": ".k-border-black",
2353
- "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color );\n @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );\n @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );\n @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );\n @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );\n @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );\n @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );",
2353
+ "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );",
2354
2354
  "line": {
2355
2355
  "start": 32,
2356
- "end": 45
2356
+ "end": 39
2357
2357
  }
2358
2358
  },
2359
2359
  "example": [
@@ -16182,7 +16182,7 @@
16182
16182
  "context": {
16183
16183
  "type": "css",
16184
16184
  "name": ".k-outline-inherit",
16185
- "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color );",
16185
+ "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );",
16186
16186
  "line": {
16187
16187
  "start": 31,
16188
16188
  "end": 38
@@ -16213,7 +16213,7 @@
16213
16213
  "context": {
16214
16214
  "type": "css",
16215
16215
  "name": ".k-outline-currentColor",
16216
- "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color );",
16216
+ "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );",
16217
16217
  "line": {
16218
16218
  "start": 31,
16219
16219
  "end": 38
@@ -16244,7 +16244,7 @@
16244
16244
  "context": {
16245
16245
  "type": "css",
16246
16246
  "name": ".k-outline-transparent",
16247
- "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color );",
16247
+ "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );",
16248
16248
  "line": {
16249
16249
  "start": 31,
16250
16250
  "end": 38
@@ -16275,7 +16275,7 @@
16275
16275
  "context": {
16276
16276
  "type": "css",
16277
16277
  "name": ".k-outline-black",
16278
- "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color );",
16278
+ "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );",
16279
16279
  "line": {
16280
16280
  "start": 31,
16281
16281
  "end": 38
@@ -16306,7 +16306,7 @@
16306
16306
  "context": {
16307
16307
  "type": "css",
16308
16308
  "name": ".k-outline-white",
16309
- "code": "\n\n // Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color );\n\n",
16309
+ "code": "\n\n // Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );\n\n",
16310
16310
  "line": {
16311
16311
  "start": 31,
16312
16312
  "end": 37
package/dist/meta/sassdoc-raw-data.json CHANGED
@@ -1658,7 +1658,7 @@
1658
1658
  "context": {
1659
1659
  "type": "css",
1660
1660
  "name": ".k-bg-inherit",
1661
- "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color );",
1661
+ "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color, $css-var: 'color' );",
1662
1662
  "line": {
1663
1663
  "start": 25,
1664
1664
  "end": 32
@@ -1689,7 +1689,7 @@
1689
1689
  "context": {
1690
1690
  "type": "css",
1691
1691
  "name": ".k-bg-transparent",
1692
- "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color );",
1692
+ "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color, $css-var: 'color' );",
1693
1693
  "line": {
1694
1694
  "start": 25,
1695
1695
  "end": 32
@@ -1720,7 +1720,7 @@
1720
1720
  "context": {
1721
1721
  "type": "css",
1722
1722
  "name": ".k-bg-black",
1723
- "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color );",
1723
+ "value": "// Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color, $css-var: 'color' );",
1724
1724
  "line": {
1725
1725
  "start": 25,
1726
1726
  "end": 32
@@ -1751,7 +1751,7 @@
1751
1751
  "context": {
1752
1752
  "type": "css",
1753
1753
  "name": ".k-bg-white",
1754
- "code": "\n\n // Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color );\n\n",
1754
+ "code": "\n\n // Background color utility classes\n $kendo-utils-background-color: k-map-get( $kendo-utils, \"background-color\" ) !default;\n @include generate-utils( bg, background-color, $kendo-utils-background-color, $css-var: 'color' );\n\n",
1755
1755
  "line": {
1756
1756
  "start": 25,
1757
1757
  "end": 31
@@ -2220,10 +2220,10 @@
2220
2220
  "context": {
2221
2221
  "type": "css",
2222
2222
  "name": ".k-border-white",
2223
- "code": "\n\n // Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color );\n @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );\n @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );\n @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );\n @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );\n @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );\n @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );\n\n",
2223
+ "code": "\n\n // Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );\n\n",
2224
2224
  "line": {
2225
2225
  "start": 31,
2226
- "end": 44
2226
+ "end": 38
2227
2227
  }
2228
2228
  },
2229
2229
  "example": [
@@ -2252,10 +2252,10 @@
2252
2252
  "context": {
2253
2253
  "type": "css",
2254
2254
  "name": ".k-border-inherit",
2255
- "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color );\n @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );\n @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );\n @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );\n @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );\n @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );\n @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );",
2255
+ "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );",
2256
2256
  "line": {
2257
2257
  "start": 32,
2258
- "end": 45
2258
+ "end": 39
2259
2259
  }
2260
2260
  },
2261
2261
  "example": [
@@ -2283,10 +2283,10 @@
2283
2283
  "context": {
2284
2284
  "type": "css",
2285
2285
  "name": ".k-border-currentColor",
2286
- "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color );\n @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );\n @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );\n @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );\n @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );\n @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );\n @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );",
2286
+ "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );",
2287
2287
  "line": {
2288
2288
  "start": 32,
2289
- "end": 45
2289
+ "end": 39
2290
2290
  }
2291
2291
  },
2292
2292
  "example": [
@@ -2314,10 +2314,10 @@
2314
2314
  "context": {
2315
2315
  "type": "css",
2316
2316
  "name": ".k-border-transparent",
2317
- "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color );\n @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );\n @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );\n @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );\n @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );\n @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );\n @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );",
2317
+ "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );",
2318
2318
  "line": {
2319
2319
  "start": 32,
2320
- "end": 45
2320
+ "end": 39
2321
2321
  }
2322
2322
  },
2323
2323
  "example": [
@@ -2345,10 +2345,10 @@
2345
2345
  "context": {
2346
2346
  "type": "css",
2347
2347
  "name": ".k-border-black",
2348
- "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color );\n @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );\n @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );\n @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );\n @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );\n @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );\n @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );",
2348
+ "value": "// Border color utility classes\n $kendo-utils-border-color: k-map-get( $kendo-utils, \"border-color\" ) !default;\n @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );",
2349
2349
  "line": {
2350
2350
  "start": 32,
2351
- "end": 45
2351
+ "end": 39
2352
2352
  }
2353
2353
  },
2354
2354
  "example": [
@@ -16177,7 +16177,7 @@
16177
16177
  "context": {
16178
16178
  "type": "css",
16179
16179
  "name": ".k-outline-inherit",
16180
- "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color );",
16180
+ "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );",
16181
16181
  "line": {
16182
16182
  "start": 31,
16183
16183
  "end": 38
@@ -16208,7 +16208,7 @@
16208
16208
  "context": {
16209
16209
  "type": "css",
16210
16210
  "name": ".k-outline-currentColor",
16211
- "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color );",
16211
+ "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );",
16212
16212
  "line": {
16213
16213
  "start": 31,
16214
16214
  "end": 38
@@ -16239,7 +16239,7 @@
16239
16239
  "context": {
16240
16240
  "type": "css",
16241
16241
  "name": ".k-outline-transparent",
16242
- "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color );",
16242
+ "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );",
16243
16243
  "line": {
16244
16244
  "start": 31,
16245
16245
  "end": 38
@@ -16270,7 +16270,7 @@
16270
16270
  "context": {
16271
16271
  "type": "css",
16272
16272
  "name": ".k-outline-black",
16273
- "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color );",
16273
+ "value": "// Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );",
16274
16274
  "line": {
16275
16275
  "start": 31,
16276
16276
  "end": 38
@@ -16301,7 +16301,7 @@
16301
16301
  "context": {
16302
16302
  "type": "css",
16303
16303
  "name": ".k-outline-white",
16304
- "code": "\n\n // Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color );\n\n",
16304
+ "code": "\n\n // Outline color utility classes\n $kendo-utils-outline-color: k-map-get( $kendo-utils, \"outline-color\" ) !default;\n @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );\n\n",
16305
16305
  "line": {
16306
16306
  "start": 31,
16307
16307
  "end": 37
package/dist/meta/variables.json CHANGED
@@ -27,6 +27,166 @@
27
27
  "type": "List",
28
28
  "value": "(\"%\", \"%25\"), (\"<\", \"%3c\"), (\">\", \"%3e\"), (\"#\", \"%23\"), (\"(\", \"%28\"), (\")\", \"%29\")"
29
29
  },
30
+ "kendo-palettes": {
31
+ "type": "Map",
32
+ "value": "(neutral: (0: #ffffff, 50: #f8f8f8, 100: #ededed, 200: #d6d6d6, 300: #b7b7b7, 400: #949494, 500: #767676, 600: #5f5f5f, 700: #494949, 800: #373737, 900: #282828, 1000: #000000), marsala: (0: #ffffff, 50: #faf0f2, 100: #f3dde0, 200: #e197a3, 300: #c54e69, 400: #8b3548, 500: #622331, 600: #551d2a, 700: #441620, 800: #340f17, 900: #23080e, 1000: #000000), bootstrapGray: (0: #ffffff, 100: #f8f9fa, 200: #e9ecef, 300: #dee2e6, 400: #ced4da, 500: #adb5bd, 600: #6c757d, 700: #495057, 800: #343a40, 900: #212529, 1000: #000000), bootstrapBlue: (0: #ffffff, 100: #cfe2ff, 200: #9ec5fe, 300: #6ea8fe, 400: #3d8bfd, 500: #0d6efd, 600: #0a58ca, 700: #084298, 800: #052c65, 900: #031633, 1000: #000000), bootstrapIndigo: (0: #ffffff, 100: #e0cffc, 200: #c29ffa, 300: #a370f7, 400: #8540f5, 500: #6610f2, 600: #520dc2, 700: #3d0a91, 800: #290661, 900: #140330, 1000: #000000), bootstrapPurple: (0: #ffffff, 100: #e2d9f3, 200: #c5b3e6, 300: #a98eda, 400: #8c68cd, 500: #6f42c1, 600: #59359a, 700: #432874, 800: #2c1a4d, 900: #160d27, 1000: #000000), bootstrapPink: (0: #ffffff, 100: #f7d6e6, 200: #efadce, 300: #e685b5, 400: #de5c9d, 500: #d63384, 600: #ab296a, 700: #801f4f, 800: #561435, 900: #2b0a1a, 1000: #000000), bootstrapRed: (0: #ffffff, 100: #f8d7da, 200: #f1aeb5, 300: #ea868f, 400: #e35d6a, 500: #dc3545, 600: #b02a37, 700: #842029, 800: #58151c, 900: #2c0b0e, 1000: #000000), bootstrapOrange: (0: #ffffff, 100: #ffe5d0, 200: #fecba1, 300: #feb272, 400: #fd9843, 500: #fd7e14, 600: #ca6510, 700: #984c0c, 800: #653208, 900: #331904, 1000: #000000), bootstrapYellow: (0: #ffffff, 100: #fff3cd, 200: #ffe69c, 300: #ffda6a, 400: #ffcd39, 500: #ffc107, 600: #cc9a06, 700: #997404, 800: #664d03, 900: #332701, 1000: #000000), bootstrapGreen: (0: #ffffff, 100: #d1e7dd, 200: #a3cfbb, 300: #75b798, 400: #479f76, 500: #198754, 600: #146c43, 700: #0f5132, 800: #0a3622, 900: #051b11, 1000: #000000), bootstrapTeal: (0: #ffffff, 100: #d2f4ea, 200: #a6e9d5, 300: #79dfc1, 400: #4dd4ac, 500: #20c997, 600: #1aa179, 700: #13795b, 800: #0d503c, 900: #06281e, 1000: #000000), bootstrapCyan: (0: #ffffff, 100: #cff4fc, 200: #9eeaf9, 300: #6edff6, 400: #3dd5f3, 500: #0dcaf0, 600: #0aa2c0, 700: #087990, 800: #055160, 900: #032830, 1000: #000000), fluentNeutral: (0: #ffffff, 50: #faf9f8, 100: #edebe9, 150: #e1dfdd, 200: #d2d0ce, 250: #c8c6c4, 300: #bdbbb8, 350: #b3b0ad, 400: #a19f9d, 450: #8a8886, 500: #797775, 550: #605e5c, 600: #484644, 650: #3b3a39, 700: #323130, 750: #292827, 800: #201f1e, 850: #1b1a19, 900: #161514, 950: #11100f, 1000: #000000), materialGray: (0: #ffffff, 50: #fafafa, 100: #f5f5f5, 200: #eeeeee, 300: #e0e0e0, 400: #bdbdbd, 500: #9e9e9e, 600: #757575, 700: #616161, 800: #424242, 900: #212121, 1000: #000000), materialBlueGray: (0: #ffffff, 50: #eceff1, 100: #cfd8dc, 200: #b0bec5, 300: #90a4ae, 400: #78909c, 500: #607d8b, 600: #546e7a, 700: #455a64, 800: #37474f, 900: #263238, 1000: #000000), materialRed: (0: #ffffff, 50: #ffebee, 100: #ffcdd2, 200: #ef9a9a, 300: #e57373, 400: #ef5350, 500: #f44336, 600: #e53935, 700: #d32f2f, 800: #c62828, 900: #b71c1c, 1000: #000000), materialPink: (0: #ffffff, 50: #fce4ec, 100: #f8bbd0, 200: #f48fb1, 300: #f06292, 400: #ec407a, 500: #e51a5f, 600: #d81b60, 700: #c2185b, 800: #ad1457, 900: #880e4f, 1000: #000000), materialPurple: (0: #ffffff, 50: #f3e5f5, 100: #e1bee7, 200: #ce93d8, 300: #ba68c8, 400: #ab47bc, 500: #9c27b0, 600: #8e24aa, 700: #7b1fa2, 800: #6a1b9a, 900: #4a148c, 1000: #000000), materialDeepPurple: (0: #ffffff, 50: #ede7f6, 100: #d1c4e9, 200: #b39ddb, 300: #9575cd, 400: #7e57c2, 500: #673ab7, 600: #5e35b1, 700: #512da8, 800: #4527a0, 900: #311b92, 1000: #000000), materialIndigo: (0: #ffffff, 50: #e8eaf6, 100: #c5cae9, 200: #9fa8da, 300: #7986cb, 400: #5c6bc0, 500: #3f51b5, 600: #3949ab, 700: #303f9f, 800: #283593, 900: #1a237e, 1000: #000000), materialBlue: (0: #ffffff, 50: #e3f2fd, 100: #bbdefb, 200: #90caf9, 300: #64b5f6, 400: #42a5f5, 500: #2196f3, 600: #1e88e5, 700: #1976d2, 800: #1565c0, 900: #0d47a1, 1000: #000000), materialLightBlue: (0: #ffffff, 50: #e1f5fe, 100: #b3e5fc, 200: #81d4fa, 300: #4fc3f7, 400: #29b6f6, 500: #03a9f4, 600: #039be5, 700: #0288d1, 800: #0277bd, 900: #01579b, 1000: #000000), materialCyan: (0: #ffffff, 50: #e0f7fa, 100: #b2ebf2, 200: #80deea, 300: #4dd0e1, 400: #26c6da, 500: #00bcd4, 600: #00acc1, 700: #0097a7, 800: #00838f, 900: #006064, 1000: #000000), materialTeal: (0: #ffffff, 50: #e0f2f1, 100: #b2dfdb, 200: #80cbc4, 300: #4db6ac, 400: #26a69a, 500: #009688, 600: #00897b, 700: #00796b, 800: #00695c, 900: #004d40, 1000: #000000), materialGreen: (0: #ffffff, 50: #e8f5e9, 100: #c8e6c9, 200: #a5d6a7, 300: #81c784, 400: #66bb6a, 500: #4caf50, 600: #43a047, 700: #388e3c, 800: #2e7d32, 900: #1b5e20, 1000: #000000), materialLightGreen: (0: #ffffff, 50: #f1f8e9, 100: #dcedc8, 200: #c5e1a5, 300: #aed581, 400: #9ccc65, 500: #8bc34a, 600: #7cb342, 700: #689f38, 800: #558b2f, 900: #33691e, 1000: #000000), materialLime: (0: #ffffff, 50: #f9fbe7, 100: #f0f4c3, 200: #e6ee9c, 300: #dce775, 400: #d4e157, 500: #cddc39, 600: #c0ca33, 700: #afb42b, 800: #9e9d24, 900: #827717, 1000: #000000), materialYellow: (0: #ffffff, 50: #fffde7, 100: #fff9c4, 200: #fff59d, 300: #fff176, 400: #ffee58, 500: #ffeb3b, 600: #fdd835, 700: #fbc02d, 800: #f9a825, 900: #f57f17, 1000: #000000), materialAmber: (0: #ffffff, 50: #fff8e1, 100: #ffecb3, 200: #ffe082, 300: #ffd54f, 400: #ffca28, 500: #ffc107, 600: #ffb300, 700: #ffa000, 800: #ff8f00, 900: #ff6f00, 1000: #000000), materialOrange: (0: #ffffff, 50: #fff3e0, 100: #ffe0b2, 200: #ffcc80, 300: #ffb74d, 400: #ffa726, 500: #ff9800, 600: #fb8c00, 700: #f57c00, 800: #ef6c00, 900: #e65100, 1000: #000000), materialDeepOrange: (0: #ffffff, 50: #fbe9e7, 100: #ffccbc, 200: #ffab91, 300: #ff8a65, 400: #ff7043, 500: #ff5722, 600: #f4511e, 700: #e64a19, 800: #d84315, 900: #bf360c, 1000: #000000), materialBrown: (0: #ffffff, 50: #efebe9, 100: #d7ccc8, 200: #bcaaa4, 300: #a1887f, 400: #8d6e63, 500: #795548, 600: #6d4c41, 700: #5d4037, 800: #4e342e, 900: #3e2723, 1000: #000000), primerGray: (0: #ffffff, 50: #f6f8fa, 100: #eaeef2, 200: #d0d7de, 300: #afb8c1, 400: #8c959f, 500: #6e7781, 600: #57606a, 700: #424a53, 800: #32383f, 900: #24292f, 1000: #000000), primerBlue: (0: #ffffff, 50: #ddf4ff, 100: #b6e3ff, 200: #80ccff, 300: #54aeff, 400: #218bff, 500: #0969da, 600: #0550ae, 700: #033d8b, 800: #0a3069, 900: #002155, 1000: #000000), primerGreen: (0: #ffffff, 50: #dafbe1, 100: #aceebb, 200: #6fdd8b, 300: #4ac26b, 400: #2da44e, 500: #1a7f37, 600: #116329, 700: #044f1e, 800: #003d16, 900: #002d11, 1000: #000000), primerYellow: (0: #ffffff, 50: #fff8c5, 100: #fae17d, 200: #eac54f, 300: #d4a72c, 400: #bf8700, 500: #9a6700, 600: #7d4e00, 700: #633c01, 800: #4d2d00, 900: #3b2300, 1000: #000000), primerOrange: (0: #ffffff, 50: #fff1e5, 100: #ffd8b5, 200: #ffb77c, 300: #fb8f44, 400: #e16f24, 500: #bc4c00, 600: #953800, 700: #762c00, 800: #5c2200, 900: #471700, 1000: #000000), primerRed: (0: #ffffff, 50: #ffebe9, 100: #ffcecb, 200: #ffaba8, 300: #ff8182, 400: #fa4549, 500: #cf222e, 600: #a40e26, 700: #82071e, 800: #660018, 900: #4c0014, 1000: #000000), primerPurple: (0: #ffffff, 50: #fbefff, 100: #ecd8ff, 200: #d8b9ff, 300: #c297ff, 400: #a475f9, 500: #8250df, 600: #6639ba, 700: #512a97, 800: #3e1f79, 900: #2e1461, 1000: #000000), primerPink: (0: #ffffff, 50: #ffeff7, 100: #ffd3eb, 200: #ffadda, 300: #ff80c8, 400: #e85aad, 500: #bf3989, 600: #99286e, 700: #772057, 800: #611347, 900: #4d0336, 1000: #000000), primerCoral: (0: #ffffff, 50: #fff0eb, 100: #ffd6cc, 200: #ffb4a1, 300: #fd8c73, 400: #ec6547, 500: #c4432b, 600: #9e2f1c, 700: #801f0f, 800: #691105, 900: #510901, 1000: #000000), tailwindNeutral: (0: #ffffff, 50: #fafafa, 100: #f5f5f5, 200: #e5e5e5, 300: #d4d4d4, 400: #a3a3a3, 500: #737373, 600: #525252, 700: #404040, 800: #262626, 900: #171717, 1000: #000000), tailwindSlate: (0: #ffffff, 50: #f8fafc, 100: #f1f5f9, 200: #e2e8f0, 300: #cbd5e1, 400: #94a3b8, 500: #64748b, 600: #475569, 700: #334155, 800: #1e293b, 900: #0f172a, 1000: #000000), tailwindGray: (0: #ffffff, 50: #f9fafb, 100: #f3f4f6, 200: #e5e7eb, 300: #d1d5db, 400: #9ca3af, 500: #6b7280, 600: #4b5563, 700: #374151, 800: #1f2937, 900: #111827, 1000: #000000), tailwindZinc: (0: #ffffff, 50: #fafafa, 100: #f4f4f5, 200: #e4e4e7, 300: #d4d4d8, 400: #a1a1aa, 500: #71717a, 600: #52525b, 700: #3f3f46, 800: #27272a, 900: #18181b, 1000: #000000), tailwindStone: (0: #ffffff, 50: #fafaf9, 100: #f5f5f4, 200: #e7e5e4, 300: #d6d3d1, 400: #a8a29e, 500: #78716c, 600: #57534e, 700: #44403c, 800: #292524, 900: #1c1917, 1000: #000000), tailwindRed: (0: #ffffff, 50: #fef2f2, 100: #fee2e2, 200: #fecaca, 300: #fca5a5, 400: #f87171, 500: #ef4444, 600: #dc2626, 700: #b91c1c, 800: #991b1b, 900: #7f1d1d, 1000: #000000), tailwindOrange: (0: #ffffff, 50: #fff7ed, 100: #ffedd5, 200: #fed7aa, 300: #fdba74, 400: #fb923c, 500: #f97316, 600: #ea580c, 700: #c2410c, 800: #9a3412, 900: #7c2d12, 1000: #000000), tailwindAmber: (0: #ffffff, 50: #fffbeb, 100: #fef3c7, 200: #fde68a, 300: #fcd34d, 400: #fbbf24, 500: #f59e0b, 600: #d97706, 700: #b45309, 800: #92400e, 900: #78350f, 1000: #000000), tailwindYellow: (0: #ffffff, 50: #fefce8, 100: #fef9c3, 200: #fef08a, 300: #fde047, 400: #facc15, 500: #eab308, 600: #ca8a04, 700: #a16207, 800: #854d0e, 900: #713f12, 1000: #000000), tailwindLime: (0: #ffffff, 50: #f7fee7, 100: #ecfccb, 200: #d9f99d, 300: #bef264, 400: #a3e635, 500: #84cc16, 600: #65a30d, 700: #4d7c0f, 800: #3f6212, 900: #365314, 1000: #000000), tailwindGreen: (0: #ffffff, 50: #f0fdf4, 100: #dcfce7, 200: #bbf7d0, 300: #86efac, 400: #4ade80, 500: #22c55e, 600: #16a34a, 700: #15803d, 800: #166534, 900: #14532d, 1000: #000000), tailwindEmerald: (0: #ffffff, 50: #ecfdf5, 100: #d1fae5, 200: #a7f3d0, 300: #6ee7b7, 400: #34d399, 500: #10b981, 600: #059669, 700: #047857, 800: #065f46, 900: #064e3b, 1000: #000000), tailwindTeal: (0: #ffffff, 50: #f0fdfa, 100: #ccfbf1, 200: #99f6e4, 300: #5eead4, 400: #2dd4bf, 500: #14b8a6, 600: #0d9488, 700: #0f766e, 800: #115e59, 900: #134e4a, 1000: #000000), tailwindCyan: (0: #ffffff, 50: #ecfeff, 100: #cffafe, 200: #a5f3fc, 300: #67e8f9, 400: #22d3ee, 500: #06b6d4, 600: #0891b2, 700: #0e7490, 800: #155e75, 900: #164e63, 1000: #000000), tailwindSky: (0: #ffffff, 50: #f0f9ff, 100: #e0f2fe, 200: #bae6fd, 300: #7dd3fc, 400: #38bdf8, 500: #0ea5e9, 600: #0284c7, 700: #0369a1, 800: #075985, 900: #0c4a6e, 1000: #000000), tailwindBlue: (0: #ffffff, 50: #eff6ff, 100: #dbeafe, 200: #bfdbfe, 300: #93c5fd, 400: #60a5fa, 500: #3b82f6, 600: #2563eb, 700: #1d4ed8, 800: #1e40af, 900: #1e3a8a, 1000: #000000), tailwindIndigo: (0: #ffffff, 50: #eef2ff, 100: #e0e7ff, 200: #c7d2fe, 300: #a5b4fc, 400: #818cf8, 500: #6366f1, 600: #4f46e5, 700: #4338ca, 800: #3730a3, 900: #312e81, 1000: #000000), tailwindViolet: (0: #ffffff, 50: #f5f3ff, 100: #ede9fe, 200: #ddd6fe, 300: #c4b5fd, 400: #a78bfa, 500: #8b5cf6, 600: #7c3aed, 700: #6d28d9, 800: #5b21b6, 900: #4c1d95, 1000: #000000), tailwindPurple: (0: #ffffff, 50: #faf5ff, 100: #f3e8ff, 200: #e9d5ff, 300: #d8b4fe, 400: #c084fc, 500: #a855f7, 600: #9333ea, 700: #7e22ce, 800: #6b21a8, 900: #581c87, 1000: #000000), tailwindFuchsia: (0: #ffffff, 50: #fdf4ff, 100: #fae8ff, 200: #f5d0fe, 300: #f0abfc, 400: #e879f9, 500: #d946ef, 600: #c026d3, 700: #a21caf, 800: #86198f, 900: #701a75, 1000: #000000), tailwindPink: (0: #ffffff, 50: #fdf2f8, 100: #fce7f3, 200: #fbcfe8, 300: #f9a8d4, 400: #f472b6, 500: #ec4899, 600: #db2777, 700: #be185d, 800: #9d174d, 900: #831843, 1000: #000000), tailwindRose: (0: #ffffff, 50: #fff1f2, 100: #ffe4e6, 200: #fecdd3, 300: #fda4af, 400: #fb7185, 500: #f43f5e, 600: #e11d48, 700: #be123c, 800: #9f1239, 900: #881337, 1000: #000000))"
33
+ },
34
+ "kendo-enable-color-system": {
35
+ "type": "Bool",
36
+ "value": "false"
37
+ },
38
+ "kendo-colors": {
39
+ "type": "Map",
40
+ "value": "(app-surface: null, on-app-surface: null, subtle: null, surface: null, surface-alt: null, border: null, border-alt: null, base-subtle: null, base-subtle-hover: null, base-subtle-active: null, base: null, base-hover: null, base-active: null, base-emphasis: null, base-on-subtle: null, on-base: null, base-on-surface: null, primary-subtle: null, primary-subtle-hover: null, primary-subtle-active: null, primary: null, primary-hover: null, primary-active: null, primary-emphasis: null, primary-on-subtle: null, on-primary: null, primary-on-surface: null, secondary-subtle: null, secondary-subtle-hover: null, secondary-subtle-active: null, secondary: null, secondary-hover: null, secondary-active: null, secondary-emphasis: null, secondary-on-subtle: null, on-secondary: null, secondary-on-surface: null, tertiary-subtle: null, tertiary-subtle-hover: null, tertiary-subtle-active: null, tertiary: null, tertiary-hover: null, tertiary-active: null, tertiary-emphasis: null, tertiary-on-subtle: null, on-tertiary: null, tertiary-on-surface: null, info-subtle: null, info-subtle-hover: null, info-subtle-active: null, info: null, info-hover: null, info-active: null, info-emphasis: null, info-on-subtle: null, on-info: null, info-on-surface: null, success-subtle: null, success-subtle-hover: null, success-subtle-active: null, success: null, success-hover: null, success-active: null, success-emphasis: null, success-on-subtle: null, on-success: null, success-on-surface: null, warning-subtle: null, warning-subtle-hover: null, warning-subtle-active: null, warning: null, warning-hover: null, warning-active: null, warning-emphasis: null, warning-on-subtle: null, on-warning: null, warning-on-surface: null, error-subtle: null, error-subtle-hover: null, error-subtle-active: null, error: null, error-hover: null, error-active: null, error-emphasis: null, error-on-subtle: null, on-error: null, error-on-surface: null, light-subtle: null, light-subtle-hover: null, light-subtle-active: null, light: null, light-hover: null, light-active: null, light-emphasis: null, light-on-subtle: null, on-light: null, light-on-surface: null, dark-subtle: null, dark-subtle-hover: null, dark-subtle-active: null, dark: null, dark-hover: null, dark-active: null, dark-emphasis: null, dark-on-subtle: null, on-dark: null, dark-on-surface: null, inverse-subtle: null, inverse-subtle-hover: null, inverse-subtle-active: null, inverse: null, inverse-hover: null, inverse-active: null, inverse-emphasis: null, inverse-on-subtle: null, on-inverse: null, inverse-on-surface: null, series-a: null, series-a-bold: null, series-a-bolder: null, series-a-subtle: null, series-a-subtler: null, series-b: null, series-b-bold: null, series-b-bolder: null, series-b-subtle: null, series-b-subtler: null, series-c: null, series-c-bold: null, series-c-bolder: null, series-c-subtle: null, series-c-subtler: null, series-d: null, series-d-bold: null, series-d-bolder: null, series-d-subtle: null, series-d-subtler: null, series-e: null, series-e-bold: null, series-e-bolder: null, series-e-subtle: null, series-e-subtler: null, series-f: null, series-f-bold: null, series-f-bolder: null, series-f-subtle: null, series-f-subtler: null)"
41
+ },
42
+ "kendo-color-white": {
43
+ "type": "Color",
44
+ "value": "#ffffff"
45
+ },
46
+ "kendo-color-black": {
47
+ "type": "Color",
48
+ "value": "#000000"
49
+ },
50
+ "kendo-color-rgba-transparent": {
51
+ "type": "Color",
52
+ "value": "rgba(0, 0, 0, 0)"
53
+ },
54
+ "kendo-gradient-transparent-to-black": {
55
+ "type": "List",
56
+ "value": "rgba(0, 0, 0, 0), black"
57
+ },
58
+ "kendo-gradient-transparent-to-white": {
59
+ "type": "List",
60
+ "value": "rgba(255, 255, 255, 0), white"
61
+ },
62
+ "kendo-gradient-black-to-transparent": {
63
+ "type": "List",
64
+ "value": "black, rgba(0, 0, 0, 0)"
65
+ },
66
+ "kendo-gradient-white-to-transparent": {
67
+ "type": "List",
68
+ "value": "white, rgba(255, 255, 255, 0)"
69
+ },
70
+ "kendo-gradient-rainbow": {
71
+ "type": "List",
72
+ "value": "#ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000"
73
+ },
74
+ "kendo-is-dark-theme": {
75
+ "type": "Bool",
76
+ "value": "false"
77
+ },
78
+ "kendo-body-bg": {
79
+ "type": "Null",
80
+ "value": "null"
81
+ },
82
+ "kendo-body-text": {
83
+ "type": "Null",
84
+ "value": "null"
85
+ },
86
+ "kendo-component-bg": {
87
+ "type": "Null",
88
+ "value": "null"
89
+ },
90
+ "kendo-component-text": {
91
+ "type": "Null",
92
+ "value": "null"
93
+ },
94
+ "kendo-component-border": {
95
+ "type": "Null",
96
+ "value": "null"
97
+ },
98
+ "kendo-hover-bg": {
99
+ "type": "Null",
100
+ "value": "null"
101
+ },
102
+ "kendo-hover-text": {
103
+ "type": "Null",
104
+ "value": "null"
105
+ },
106
+ "kendo-hover-border": {
107
+ "type": "Null",
108
+ "value": "null"
109
+ },
110
+ "kendo-selected-bg": {
111
+ "type": "Null",
112
+ "value": "null"
113
+ },
114
+ "kendo-selected-text": {
115
+ "type": "Null",
116
+ "value": "null"
117
+ },
118
+ "kendo-selected-border": {
119
+ "type": "Null",
120
+ "value": "null"
121
+ },
122
+ "kendo-selected-hover-bg": {
123
+ "type": "Null",
124
+ "value": "null"
125
+ },
126
+ "kendo-selected-hover-text": {
127
+ "type": "Null",
128
+ "value": "null"
129
+ },
130
+ "kendo-selected-hover-border": {
131
+ "type": "Null",
132
+ "value": "null"
133
+ },
134
+ "kendo-focus-outline": {
135
+ "type": "Null",
136
+ "value": "null"
137
+ },
138
+ "kendo-subtle-text": {
139
+ "type": "Null",
140
+ "value": "null"
141
+ },
142
+ "kendo-link-text": {
143
+ "type": "Null",
144
+ "value": "null"
145
+ },
146
+ "kendo-link-hover-text": {
147
+ "type": "Null",
148
+ "value": "null"
149
+ },
150
+ "kendo-invalid-bg": {
151
+ "type": "Null",
152
+ "value": "null"
153
+ },
154
+ "kendo-invalid-text": {
155
+ "type": "Null",
156
+ "value": "null"
157
+ },
158
+ "kendo-invalid-border": {
159
+ "type": "Null",
160
+ "value": "null"
161
+ },
162
+ "kendo-invalid-shadow": {
163
+ "type": "Null",
164
+ "value": "null"
165
+ },
166
+ "kendo-disabled-bg": {
167
+ "type": "Null",
168
+ "value": "null"
169
+ },
170
+ "kendo-disabled-text": {
171
+ "type": "Null",
172
+ "value": "null"
173
+ },
174
+ "kendo-disabled-border": {
175
+ "type": "Null",
176
+ "value": "null"
177
+ },
178
+ "kendo-loading-bg": {
179
+ "type": "Null",
180
+ "value": "null"
181
+ },
182
+ "kendo-loading-text": {
183
+ "type": "Null",
184
+ "value": "null"
185
+ },
186
+ "kendo-theme-colors": {
187
+ "type": "List",
188
+ "value": "()"
189
+ },
30
190
  "kendo-prefix": {
31
191
  "type": "String",
32
192
  "value": "k-"
@@ -35,13 +195,17 @@
35
195
  "type": "Bool",
36
196
  "value": "true"
37
197
  },
38
- "kendo-theme-colors": {
198
+ "kendo-font-sizes": {
39
199
  "type": "List",
40
200
  "value": "()"
41
201
  },
42
- "kendo-font-sizes": {
202
+ "kendo-util-colors-list": {
43
203
  "type": "List",
44
- "value": "()"
204
+ "value": "primary-subtle, primary, primary-emphasis, secondary-subtle, secondary, secondary-emphasis, tertiary-subtle, tertiary, tertiary-emphasis, info-subtle, info, info-emphasis, success-subtle, success, success-emphasis, warning-subtle, warning, warning-emphasis, error-subtle, error, error-emphasis, light-subtle, light, light-emphasis, dark-subtle, dark, dark-emphasis"
205
+ },
206
+ "kendo-util-colors": {
207
+ "type": "Map",
208
+ "value": "(primary-subtle: null, primary: null, primary-emphasis: null, secondary-subtle: null, secondary: null, secondary-emphasis: null, tertiary-subtle: null, tertiary: null, tertiary-emphasis: null, info-subtle: null, info: null, info-emphasis: null, success-subtle: null, success: null, success-emphasis: null, warning-subtle: null, warning: null, warning-emphasis: null, error-subtle: null, error: null, error-emphasis: null, light-subtle: null, light: null, light-emphasis: null, dark-subtle: null, dark: null, dark-emphasis: null)"
45
209
  },
46
210
  "kendo-spacing": {
47
211
  "type": "Map",
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@progress/kendo-theme-utils",
3
3
  "description": "Utility first library alongside Kendo UI",
4
- "version": "7.2.2-dev.0",
4
+ "version": "7.3.0-dev.0",
5
5
  "author": "Progress",
6
6
  "license": "Apache-2.0",
7
7
  "keywords": [
@@ -43,10 +43,10 @@
43
43
  "postpublish": "echo 'no postpublish for utils'"
44
44
  },
45
45
  "dependencies": {
46
- "@progress/kendo-theme-core": "7.2.2-dev.0"
46
+ "@progress/kendo-theme-core": "7.3.0-dev.0"
47
47
  },
48
48
  "directories": {
49
49
  "doc": "docs"
50
50
  },
51
- "gitHead": "14dd89a76f235649ba2cf9f260465cdcb486c135"
51
+ "gitHead": "01297a87bc94d867851e28577c04a0596e35e4f9"
52
52
  }
package/scss/_mixins.scss CHANGED
@@ -1,4 +1,4 @@
1
- @mixin generate-utils( $name, $props, $values, $function: "", $important: $kendo-important ) {
1
+ @mixin generate-utils( $name, $props, $values, $function: "", $important: $kendo-important, $css-var: null ) {
2
2
  @if $values {
3
3
  $_props: if( k-meta-type-of($props) == list, $props, ( $props ) );
4
4
  $_fn: if( k-meta-function-exists( $function ), k-meta-get-function( $function ), null );
@@ -8,21 +8,30 @@
8
8
  $_val: if( k-meta-type-of($values) == list, $key, $val );
9
9
  $_name: k-escape-class-name( $name );
10
10
  $_selector: if( $_key == DEFAULT, #{$kendo-prefix}#{$_name}, #{$kendo-prefix}#{$_name}-#{$_key});
11
+ $_custom-prop: if( $_key == DEFAULT, var( --kendo-#{$css-var}, #{$_val} ), var( --kendo-#{$css-var}-#{$_key}, #{$_val} ) );
11
12
 
12
13
  @if $important != only {
13
14
  .#{$_selector} {
14
15
  @each $prop in $_props {
15
- #{$prop}: if( $_fn, k-meta-call($_fn, $_val), $_val );
16
+ @if $css-var {
17
+ #{$prop}: if( $_fn, k-meta-call($_fn, $_custom-prop), $_custom-prop );
18
+ } @else {
19
+ #{$prop}: if( $_fn, k-meta-call($_fn, $_val), $_val );
20
+ }
16
21
  }
17
22
  }
18
23
  }
19
24
  @if $important {
20
25
  .\!#{$_selector} {
21
26
  @each $prop in $_props {
22
- #{$prop}: if( $_fn, k-meta-call($_fn, $_val), $_val ) !important; // stylelint-disable-line declaration-no-important
27
+ @if $css-var {
28
+ #{$prop}: if( $_fn, k-meta-call($_fn, $-custom-prop), $-custom-prop ) !important; // stylelint-disable-line declaration-no-important
29
+ } @else {
30
+ #{$prop}: if( $_fn, k-meta-call($_fn, $_val), $_val ) !important; // stylelint-disable-line declaration-no-important
31
+ }
23
32
  }
24
33
  }
25
34
  }
26
35
  }
27
36
  }
28
- }
37
+ }