@progress/kendo-theme-classic 6.8.0-dev.2 → 7.0.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 (39) hide show
  1. package/dist/all.css +152 -89
  2. package/dist/all.scss +193 -93
  3. package/dist/meta/sassdoc-data.json +318 -210
  4. package/dist/meta/sassdoc-raw-data.json +113 -63
  5. package/dist/meta/variables.json +96 -100
  6. package/lib/swatches/classic-green-dark.json +1 -1
  7. package/lib/swatches/classic-green.json +1 -1
  8. package/lib/swatches/classic-lavender-dark.json +1 -1
  9. package/lib/swatches/classic-lavender.json +1 -1
  10. package/lib/swatches/classic-main-dark.json +1 -1
  11. package/lib/swatches/classic-main.json +1 -1
  12. package/lib/swatches/classic-metro-dark.json +1 -1
  13. package/lib/swatches/classic-metro.json +1 -1
  14. package/lib/swatches/classic-moonlight.json +1 -1
  15. package/lib/swatches/classic-opal-dark.json +1 -1
  16. package/lib/swatches/classic-opal.json +1 -1
  17. package/lib/swatches/classic-silver-dark.json +1 -1
  18. package/lib/swatches/classic-silver.json +1 -1
  19. package/lib/swatches/classic-uniform.json +1 -1
  20. package/package.json +5 -5
  21. package/scss/action-sheet/_variables.scss +1 -1
  22. package/scss/appbar/_variables.scss +2 -2
  23. package/scss/bottom-navigation/_variables.scss +2 -2
  24. package/scss/card/_variables.scss +2 -2
  25. package/scss/chat/_variables.scss +6 -6
  26. package/scss/coloreditor/_variables.scss +2 -2
  27. package/scss/colorgradient/_variables.scss +14 -8
  28. package/scss/common/_index.scss +1 -0
  29. package/scss/common/_indicators.scss +1 -0
  30. package/scss/core/_index.scss +3 -0
  31. package/scss/fab/_variables.scss +2 -2
  32. package/scss/pdf-viewer/_variables.scss +1 -1
  33. package/scss/pivotgrid/_variables.scss +5 -4
  34. package/scss/popup/_variables.scss +1 -1
  35. package/scss/scheduler/_variables.scss +1 -3
  36. package/scss/tabstrip/_variables.scss +1 -1
  37. package/scss/timeline/_variables.scss +1 -1
  38. package/scss/tooltip/_variables.scss +2 -0
  39. package/scss/window/_variables.scss +2 -2
@@ -49,7 +49,7 @@ $kendo-bottom-nav-item-gap: 0 k-map-get( $kendo-spacing, 1 ) !default;
49
49
 
50
50
  /// The box shadow of the BottomNavigation.
51
51
  /// @group bottom-navigation
52
- $kendo-bottom-nav-shadow: 0px 0px 5px rgba( black, .12 ) !default;
52
+ $kendo-bottom-nav-shadow: k-elevation(4) !default;
53
53
 
54
54
  /// The text color of the flat BottomNavigation.
55
55
  /// @group bottom-navigation
@@ -59,4 +59,4 @@ $kendo-bottom-nav-flat-text: $kendo-component-text !default;
59
59
  $kendo-bottom-nav-flat-bg: $kendo-component-bg !default;
60
60
  /// The border color of the flat BottomNavigation.
61
61
  /// @group bottom-navigation
62
- $kendo-bottom-nav-flat-border: $kendo-component-border !default;
62
+ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
@@ -16,12 +16,12 @@ $kendo-card-deck-gap: k-map-get( $kendo-spacing, 4 ) !default;
16
16
  $kendo-card-bg: $kendo-component-bg !default;
17
17
  $kendo-card-text: $kendo-component-text !default;
18
18
  $kendo-card-border: $kendo-component-border !default;
19
- $kendo-card-shadow: null !default;
19
+ $kendo-card-shadow: k-elevation(1) !default;
20
20
 
21
21
  $kendo-card-focus-bg: null !default;
22
22
  $kendo-card-focus-text: null !default;
23
23
  $kendo-card-focus-border: rgba( black, .15 ) !default;
24
- $kendo-card-focus-shadow: 0 3px 4px 0 rgba( black, .06 ) !default;
24
+ $kendo-card-focus-shadow: k-elevation(3) !default;
25
25
 
26
26
  $kendo-card-header-padding-x: $kendo-card-padding-x !default;
27
27
  $kendo-card-header-padding-y: $kendo-card-padding-y !default;
@@ -52,16 +52,16 @@ $kendo-chat-border: $kendo-app-border !default;
52
52
  $kendo-chat-bubble-bg: $kendo-component-bg !default;
53
53
  $kendo-chat-bubble-text: $kendo-component-text !default;
54
54
  $kendo-chat-bubble-border: $kendo-chat-bubble-bg !default;
55
- $kendo-chat-bubble-shadow: 0 1px 2px rgba( black, .08 ) !default;
56
- $kendo-chat-bubble-hover-shadow: 0 1px 2px rgba( black, .16 ) !default;
57
- $kendo-chat-bubble-selected-shadow: 0 3px 10px rgba( black, .16 ) !default;
55
+ $kendo-chat-bubble-shadow: k-elevation(1) !default;
56
+ $kendo-chat-bubble-hover-shadow: k-elevation(2) !default;
57
+ $kendo-chat-bubble-selected-shadow: k-elevation(3) !default;
58
58
 
59
59
  $kendo-chat-alt-bubble-bg: $kendo-color-primary !default;
60
60
  $kendo-chat-alt-bubble-text: k-contrast-legacy( $kendo-chat-alt-bubble-bg ) !default;
61
61
  $kendo-chat-alt-bubble-border: $kendo-chat-alt-bubble-bg !default;
62
- $kendo-chat-alt-bubble-shadow: 0 1px 2px rgba( $kendo-chat-alt-bubble-bg, .2 ) !default;
63
- $kendo-chat-alt-bubble-hover-shadow: 0 1px 2px rgba( $kendo-chat-alt-bubble-bg, .2 ) !default;
64
- $kendo-chat-alt-bubble-selected-shadow: 0 3px 10px rgba( $kendo-chat-alt-bubble-bg, .4 ) !default;
62
+ $kendo-chat-alt-bubble-shadow: k-elevation(1) !default;
63
+ $kendo-chat-alt-bubble-hover-shadow: k-elevation(2) !default;
64
+ $kendo-chat-alt-bubble-selected-shadow: k-elevation(3) !default;
65
65
 
66
66
  $kendo-chat-quick-reply-bg: transparent !default;
67
67
  $kendo-chat-quick-reply-text: $kendo-color-primary !default;
@@ -37,7 +37,7 @@ $kendo-color-editor-border: $kendo-component-border !default;
37
37
  $kendo-color-editor-focus-border: null !default;
38
38
  /// The box shadow of the focused ColorEditor.
39
39
  /// @group coloreditor
40
- $kendo-color-editor-focus-shadow: 1px 1px 7px 1px rgba( black, .3 ) !default;
40
+ $kendo-color-editor-focus-shadow: k-elevation(3) !default;
41
41
 
42
42
  /// The vertical padding of the ColorEditor header.
43
43
  /// @group coloreditor
@@ -77,4 +77,4 @@ $kendo-color-editor-color-gradient-focus-outline-color: rgba(0, 0, 0, .3) !defau
77
77
  $kendo-color-editor-color-gradient-focus-outline: 2px !default;
78
78
  /// The outline offset of the focused ColorGradient.
79
79
  /// @group coloreditor
80
- $kendo-color-editor-color-gradient-focus-outline-offset: 4px !default;
80
+ $kendo-color-editor-color-gradient-focus-outline-offset: 4px !default;
@@ -48,7 +48,7 @@ $kendo-color-gradient-border: $kendo-component-border !default;
48
48
  $kendo-color-gradient-focus-border: null !default;
49
49
  /// The box shadow of the focused ColorGradient.
50
50
  /// @group cologradient
51
- $kendo-color-gradient-focus-shadow: 1px 1px 7px 1px rgba( black, .3 ) !default;
51
+ $kendo-color-gradient-focus-shadow: k-elevation(3) !default;
52
52
 
53
53
  /// The border radius of the ColorGradient canvas.
54
54
  /// @group cologradient
@@ -86,6 +86,9 @@ $kendo-color-gradient-draghandle-height: 14px !default;
86
86
  /// The width of the border around the ColorGradient canvas drag handle.
87
87
  /// @group cologradient
88
88
  $kendo-color-gradient-draghandle-border-width: 1px !default;
89
+ /// The width of the outline around the ColorGradient canvas drag handle.
90
+ /// @group cologradient
91
+ $kendo-color-gradient-draghandle-outline-width: 1px !default;
89
92
  /// The border radius of the ColorGradient canvas drag handle.
90
93
  /// @group cologradient
91
94
  $kendo-color-gradient-draghandle-border-radius: 50% !default;
@@ -98,15 +101,18 @@ $kendo-color-gradient-draghandle-bg: transparent !default;
98
101
  /// The color of the border around the ColorGradient canvas drag handle.
99
102
  /// @group cologradient
100
103
  $kendo-color-gradient-draghandle-border: rgba( white, .8) !default;
101
- /// The box shadow of the ColorGradient canvas drag handle.
104
+ /// The color of the outline around the ColorGradient canvas drag handle.
102
105
  /// @group cologradient
103
- $kendo-color-gradient-draghandle-shadow: 0 1px 4px rgba( black, .5 ) !default;
104
- /// The box shadow of the focused ColorGradient canvas drag handle.
106
+ $kendo-color-gradient-draghandle-shadow: rgba( $kendo-color-black, .5) !default;
107
+ /// The focus color of the outline around the ColorGradient canvas drag handle.
105
108
  /// @group cologradient
106
- $kendo-color-gradient-draghandle-focus-shadow: 0 1px 4px black !default;
107
- /// The box shadow of the hovered ColorGradient canvas drag handle.
109
+ $kendo-color-gradient-draghandle-focus-shadow: $kendo-color-black !default;
110
+ /// The outline color of the outline around the ColorGradient canvas drag handle.
111
+ /// @group cologradient
112
+ $kendo-color-gradient-draghandle-hover-shadow: $kendo-color-black !default;
113
+ /// The box shadow of the ColorGradient canvas drag handle.
108
114
  /// @group cologradient
109
- $kendo-color-gradient-draghandle-hover-shadow: $kendo-color-gradient-draghandle-focus-shadow !default;
115
+ $kendo-color-gradient-draghandle-shadow: k-elevation(2) !default;
110
116
 
111
117
  /// The vertical margin of the ColorGradient canvas drag handle.
112
118
  /// @group cologradient
@@ -133,4 +139,4 @@ $kendo-color-gradient-input-label-text: $kendo-subtle-text !default;
133
139
  $kendo-color-gradient-contrast-ratio-font-weight: $kendo-font-weight-bold !default;
134
140
  /// The spacing between the items in the ColorGradient contrast tool.
135
141
  /// @group cologradient
136
- $kendo-color-gradient-contrast-spacer: k-math-div( $kendo-color-gradient-spacer, 1.5 ) !default;
142
+ $kendo-color-gradient-contrast-spacer: k-math-div( $kendo-color-gradient-spacer, 1.5 ) !default;
@@ -1,4 +1,5 @@
1
1
  @import "./_base.scss";
2
2
  @import "./_animations.scss";
3
+ @import "./_indicators.scss";
3
4
  @import "./_resizing.scss";
4
5
  @import "./_scrollbar.scss";
@@ -0,0 +1 @@
1
+ @import "@progress/kendo-theme-default/scss/common/_indicators.scss";
@@ -8,4 +8,7 @@ $wcag-min-contrast-ratio: 4.5 !default;
8
8
  // Expose
9
9
  @include exports("kendo-core-styles") {
10
10
  @include kendo-core--styles();
11
+
12
+ // Elevation System
13
+ @include kendo-elevation--styles();
11
14
  }
@@ -115,10 +115,10 @@ $kendo-fab-sizes: (
115
115
 
116
116
  /// The base shadow of the FAB.
117
117
  /// @group floating-action-button
118
- $kendo-fab-shadow: 0 6px 10px rgba( black, .14 ), 0 1px 18px rgba( black, .12 ), 0 3px 5px rgba( black, .2 ) !default;
118
+ $kendo-fab-shadow: k-elevation(5) !default;
119
119
  /// The shadow of the disabled FAB.
120
120
  /// @group floating-action-button
121
- $kendo-fab-disabled-shadow: 0 6px 10px k-try-tint( rgba( black, .14 ), .5 ), 0 1px 18px k-try-tint( rgba( black, .12 ), .5 ), 0 3px 5px k-try-tint( rgba( black, .2 ), .5 ) !default;
121
+ $kendo-fab-disabled-shadow: k-elevation(5) !default;
122
122
  /// The shadow of the active FAB.
123
123
  /// @group floating-action-button
124
124
  $kendo-fab-active-shadow: null !default;
@@ -23,7 +23,7 @@ $kendo-pdf-viewer-page-spacing: 30px !default;
23
23
  $kendo-pdf-viewer-page-bg: white !default;
24
24
  $kendo-pdf-viewer-page-text: $kendo-component-text !default;
25
25
  $kendo-pdf-viewer-page-border: $kendo-component-border !default;
26
- $kendo-pdf-viewer-page-shadow: 0 0 k-math-div( $kendo-pdf-viewer-page-spacing, 2 ) $kendo-pdf-viewer-page-border !default;
26
+ $kendo-pdf-viewer-page-shadow: k-elevation(3) !default;
27
27
 
28
28
  $kendo-pdf-viewer-search-panel-padding-x: $kendo-toolbar-md-padding-x !default;
29
29
  $kendo-pdf-viewer-search-panel-padding-y: k-map-get( $kendo-spacing, 3 ) !default;
@@ -69,10 +69,11 @@ $kendo-pivotgrid-configurator-header-bg: null !default;
69
69
  $kendo-pivotgrid-configurator-header-text: $kendo-component-header-text !default;
70
70
  $kendo-pivotgrid-configurator-header-border: null !default;
71
71
 
72
- $kendo-pivotgrid-configurator-end-shadow: -3px 0px 6px rgba( black, .16 ) !default;
73
- $kendo-pivotgrid-configurator-start-shadow: 3px 0px 6px rgba( black, .16 ) !default;
74
- $kendo-pivotgrid-configurator-top-shadow: 0px -3px 6px rgba( black, .16 ) !default;
75
- $kendo-pivotgrid-configurator-bottom-shadow: 0px 3px 6px rgba( black, .16 ) !default;
72
+ $kendo-pivotgrid-configurator-shadow: k-elevation(3);
73
+ $kendo-pivotgrid-configurator-end-shadow: $kendo-pivotgrid-configurator-shadow !default;
74
+ $kendo-pivotgrid-configurator-start-shadow: $kendo-pivotgrid-configurator-shadow !default;
75
+ $kendo-pivotgrid-configurator-top-shadow: $kendo-pivotgrid-configurator-shadow !default;
76
+ $kendo-pivotgrid-configurator-bottom-shadow: $kendo-pivotgrid-configurator-shadow !default;
76
77
 
77
78
  $kendo-pivotgrid-configurator-button-padding-x: k-map-get( $kendo-spacing, 1 ) !default;
78
79
  $kendo-pivotgrid-configurator-button-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
@@ -36,4 +36,4 @@ $kendo-popup-text: $kendo-component-text !default;
36
36
  $kendo-popup-border: $kendo-component-border !default;
37
37
  /// Box shadow of the popup.
38
38
  /// @group popup
39
- $kendo-popup-shadow: 0 2px 4px 0 rgba( black, .03 ), 0 4px 5px 0 rgba( black, .04 ) !default;
39
+ $kendo-popup-shadow: k-elevation(4) !default;
@@ -48,8 +48,6 @@ $kendo-scheduler-cell-height: $kendo-line-height-em !default;
48
48
  $kendo-scheduler-datecolumn-width: 12em !default;
49
49
  $kendo-scheduler-timecolumn-width: 11em !default;
50
50
 
51
- $kendo-scheduler-current-time-color: #ff0000 !default;
52
-
53
51
  $kendo-scheduler-nonwork-bg: k-try-shade( $kendo-scheduler-bg, .5 ) !default;
54
52
  $kendo-scheduler-nonwork-text: null !default;
55
53
 
@@ -77,7 +75,7 @@ $kendo-scheduler-tooltip-border-width: 0 !default;
77
75
  $kendo-scheduler-tooltip-bg: $kendo-color-primary-contrast !default;
78
76
  $kendo-scheduler-tooltip-text: $kendo-base-text !default;
79
77
  $kendo-scheduler-tooltip-border: null !default;
80
- $kendo-scheduler-tooltip-shadow: 0px 0px 10px rgba( black, .2 ) !default;
78
+ $kendo-scheduler-tooltip-shadow: k-elevation(2) !default;
81
79
 
82
80
 
83
81
  // TODO: use 3
@@ -79,7 +79,7 @@ $kendo-tabstrip-item-selected-gradient: false !default;
79
79
 
80
80
  $kendo-tabstrip-item-focus-shadow: $kendo-list-item-focus-shadow !default;
81
81
 
82
- $kendo-tabstrip-item-dragging-shadow: 0px 3px 4px rgba( black, .15 ) !default;
82
+ $kendo-tabstrip-item-dragging-shadow: k-elevation(3) !default;
83
83
 
84
84
  $kendo-tabstrip-item-disabled-bg: null !default;
85
85
  $kendo-tabstrip-item-disabled-text: null !default;
@@ -27,7 +27,7 @@ $kendo-timeline-track-end-calc: calc(#{$kendo-timeline-track-arrow-width} - 2 *
27
27
  $kendo-timeline-track-bg: $kendo-button-bg !default;
28
28
  $kendo-timeline-track-border-color: $kendo-button-border !default;
29
29
 
30
- $kendo-timeline-track-item-focus-shadow: 0 3px 4px 0 rgba( $kendo-color-primary, .4 ) !default;
30
+ $kendo-timeline-track-item-focus-shadow: k-elevation(2) !default;
31
31
 
32
32
  $kendo-timeline-track-event-offset: 36px !default;
33
33
 
@@ -18,6 +18,8 @@ $kendo-tooltip-bg: rgba( k-contrast-color( $kendo-body-bg ), .75 ) !default;
18
18
  $kendo-tooltip-text: k-contrast-color( $kendo-tooltip-bg ) !default;
19
19
  $kendo-tooltip-border: $kendo-tooltip-bg !default;
20
20
 
21
+ $kendo-tooltip-shadow: k-elevation(2) !default;
22
+
21
23
  $kendo-tooltip-primary-bg: $kendo-color-primary !default;
22
24
  $kendo-tooltip-primary-text: k-contrast-legacy( $kendo-tooltip-primary-bg ) !default;
23
25
  $kendo-tooltip-primary-border: $kendo-tooltip-primary-bg !default;
@@ -76,10 +76,10 @@ $kendo-window-text: $kendo-component-text !default;
76
76
  $kendo-window-border: $kendo-component-border !default;
77
77
  /// The box shadow of the Window.
78
78
  /// @group window
79
- $kendo-window-shadow: 1px 1px 7px 1px rgba( black, .12 ) !default;
79
+ $kendo-window-shadow: k-elevation(8) !default;
80
80
  /// The box shadow of the focused Window.
81
81
  /// @group window
82
- $kendo-window-focus-shadow: 1px 1px 7px 1px rgba( black, .25 ) !default;
82
+ $kendo-window-focus-shadow: k-elevation(9) !default;
83
83
 
84
84
  /// The background color of the Window titlebar.
85
85
  /// @group window