@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/scss/_variables.scss CHANGED
@@ -1,10 +1,52 @@
1
+ @import "@progress/kendo-theme-core/scss/color-system/index.import.scss";
2
+
1
3
  $kendo-prefix: k- !default;
2
4
  $kendo-important: true !default;
5
+ $kendo-enable-color-system: false !default;
3
6
 
4
7
  $kendo-theme-colors: () !default;
5
8
 
6
9
  $kendo-font-sizes: () !default;
7
10
 
11
+ $kendo-util-colors-list: (
12
+ primary-subtle,
13
+ primary,
14
+ primary-emphasis,
15
+ secondary-subtle,
16
+ secondary,
17
+ secondary-emphasis,
18
+ tertiary-subtle,
19
+ tertiary,
20
+ tertiary-emphasis,
21
+ info-subtle,
22
+ info,
23
+ info-emphasis,
24
+ success-subtle,
25
+ success,
26
+ success-emphasis,
27
+ warning-subtle,
28
+ warning,
29
+ warning-emphasis,
30
+ error-subtle,
31
+ error,
32
+ error-emphasis,
33
+ light-subtle,
34
+ light,
35
+ light-emphasis,
36
+ dark-subtle,
37
+ dark,
38
+ dark-emphasis,
39
+ ) !default;
40
+
41
+ $kendo-util-colors: () !default;
42
+ @each $name, $color in $kendo-colors {
43
+ @each $util-color in $kendo-util-colors-list {
44
+ @if ( $name == $util-color ) {
45
+ $kendo-util-colors: k-map-merge( $kendo-util-colors, ( $name: $color) );
46
+ }
47
+ }
48
+ }
49
+
8
50
  $kendo-spacing: (
9
51
  0: 0,
10
52
  1px: 1px,
@@ -692,7 +734,7 @@ $kendo-utils: (
692
734
  start,
693
735
  end
694
736
  ),
695
- "text-color": k-map-merge( $kendo-theme-colors, (
737
+ "text-color": k-map-merge( if( $kendo-enable-color-system, $kendo-util-colors, $kendo-theme-colors ), (
696
738
  "inherit": inherit,
697
739
  "current": currentColor,
698
740
  "transparent": transparent,
@@ -747,7 +789,7 @@ $kendo-utils: (
747
789
  content: content-box,
748
790
  text: text
749
791
  ),
750
- "background-color": k-map-merge( $kendo-theme-colors, (
792
+ "background-color": k-map-merge( if( $kendo-enable-color-system, $kendo-util-colors, $kendo-theme-colors ), (
751
793
  "inherit": inherit,
752
794
  "transparent": transparent,
753
795
  "black": black,
@@ -790,7 +832,7 @@ $kendo-utils: (
790
832
  hidden,
791
833
  none
792
834
  ),
793
- "border-color": k-map-merge( $kendo-theme-colors, (
835
+ "border-color": k-map-merge( if( $kendo-enable-color-system, $kendo-util-colors, $kendo-theme-colors ), (
794
836
  "inherit": inherit,
795
837
  "current": currentColor,
796
838
  "transparent": transparent,
@@ -816,7 +858,7 @@ $kendo-utils: (
816
858
  outset,
817
859
  none
818
860
  ),
819
- "outline-color": k-map-merge( $kendo-theme-colors, (
861
+ "outline-color": k-map-merge( if( $kendo-enable-color-system, $kendo-util-colors, $kendo-theme-colors ), (
820
862
  "inherit": inherit,
821
863
  "current": currentColor,
822
864
  "transparent": transparent,
package/scss/background/_background-color.scss CHANGED
@@ -26,6 +26,6 @@
26
26
 
27
27
  // Background color utility classes
28
28
  $kendo-utils-background-color: k-map-get( $kendo-utils, "background-color" ) !default;
29
- @include generate-utils( bg, background-color, $kendo-utils-background-color );
29
+ @include generate-utils( bg, background-color, $kendo-utils-background-color, $css-var: 'color' );
30
30
 
31
31
  }
package/scss/border/_border-color.scss CHANGED
@@ -33,12 +33,6 @@
33
33
 
34
34
  // Border color utility classes
35
35
  $kendo-utils-border-color: k-map-get( $kendo-utils, "border-color" ) !default;
36
- @include generate-utils( border, border-color, $kendo-utils-border-color );
37
- @include generate-utils( border-t, border-top-color, $kendo-utils-border-color );
38
- @include generate-utils( border-r, border-right-color, $kendo-utils-border-color );
39
- @include generate-utils( border-b, border-bottom-color, $kendo-utils-border-color );
40
- @include generate-utils( border-l, border-left-color, $kendo-utils-border-color );
41
- @include generate-utils( border-x, border-inline-color, $kendo-utils-border-color );
42
- @include generate-utils( border-y, border-block-color, $kendo-utils-border-color );
36
+ @include generate-utils( border, border-color, $kendo-utils-border-color, $css-var: 'color' );
43
37
 
44
38
  }
package/scss/border/_outline-color.scss CHANGED
@@ -32,6 +32,6 @@
32
32
 
33
33
  // Outline color utility classes
34
34
  $kendo-utils-outline-color: k-map-get( $kendo-utils, "outline-color" ) !default;
35
- @include generate-utils( outline, outline-color, $kendo-utils-outline-color );
35
+ @include generate-utils( outline, outline-color, $kendo-utils-outline-color, $css-var: 'color' );
36
36
 
37
37
  }
package/scss/elevation/index.import.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  @import "@progress/kendo-theme-core/scss/elevation/index.import.scss";
2
2
 
3
3
  @mixin kendo-utils--elevation {
4
- @include generate-utils(elevation, box-shadow, $kendo-elevation);
4
+ @include generate-utils(elevation, box-shadow, $kendo-elevation, $css-var: 'elevation');
5
5
  }
package/scss/typography/_text-color.scss CHANGED
@@ -4,10 +4,10 @@
4
4
 
5
5
  // Text color utility classes
6
6
  $kendo-utils-text-color: k-map-get( $kendo-utils, "text-color" ) !default;
7
- @include generate-utils( text, color, $kendo-utils-text-color );
7
+ @include generate-utils( text, color, $kendo-utils-text-color, $css-var: 'color' );
8
8
 
9
9
 
10
10
  // Legacy aliases
11
- @include generate-utils( color, color, $kendo-utils-text-color );
11
+ @include generate-utils( color, color, $kendo-utils-text-color, $css-var: 'color' );
12
12
 
13
13
  }