@progress/kendo-theme-classic 7.2.1-dev.1 → 7.2.1-dev.3
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.
- package/dist/all.css +40 -0
- package/dist/all.scss +184 -12
- package/dist/meta/sassdoc-data.json +28092 -23484
- package/dist/meta/sassdoc-raw-data.json +4633 -2505
- package/lib/swatches/classic-green-dark.json +1 -1
- package/lib/swatches/classic-green.json +1 -1
- package/lib/swatches/classic-lavender-dark.json +1 -1
- package/lib/swatches/classic-lavender.json +1 -1
- package/lib/swatches/classic-main-dark.json +1 -1
- package/lib/swatches/classic-main.json +1 -1
- package/lib/swatches/classic-metro-dark.json +1 -1
- package/lib/swatches/classic-metro.json +1 -1
- package/lib/swatches/classic-moonlight.json +1 -1
- package/lib/swatches/classic-opal-dark.json +1 -1
- package/lib/swatches/classic-opal.json +1 -1
- package/lib/swatches/classic-silver-dark.json +1 -1
- package/lib/swatches/classic-silver.json +1 -1
- package/lib/swatches/classic-uniform.json +1 -1
- package/package.json +5 -5
- package/scss/slider/_variables.scss +70 -0
- package/scss/timeline/_variables.scss +101 -0
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-theme-classic",
|
|
3
3
|
"description": "Sass port of less based themes for Kendo UI theme",
|
|
4
|
-
"version": "7.2.1-dev.
|
|
4
|
+
"version": "7.2.1-dev.3",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"keywords": [
|
|
@@ -53,13 +53,13 @@
|
|
|
53
53
|
},
|
|
54
54
|
"dependencies": {
|
|
55
55
|
"@progress/kendo-svg-icons": "2.1.0",
|
|
56
|
-
"@progress/kendo-theme-core": "7.2.1-dev.
|
|
57
|
-
"@progress/kendo-theme-default": "7.2.1-dev.
|
|
58
|
-
"@progress/kendo-theme-utils": "7.2.1-dev.
|
|
56
|
+
"@progress/kendo-theme-core": "7.2.1-dev.3",
|
|
57
|
+
"@progress/kendo-theme-default": "7.2.1-dev.3",
|
|
58
|
+
"@progress/kendo-theme-utils": "7.2.1-dev.3"
|
|
59
59
|
},
|
|
60
60
|
"directories": {
|
|
61
61
|
"doc": "docs",
|
|
62
62
|
"lib": "lib"
|
|
63
63
|
},
|
|
64
|
-
"gitHead": "
|
|
64
|
+
"gitHead": "1fa522eb015d517b5f30a2aca7f6458195e673d8"
|
|
65
65
|
}
|
|
@@ -3,47 +3,117 @@
|
|
|
3
3
|
|
|
4
4
|
|
|
5
5
|
// Slider
|
|
6
|
+
/// The default size of the Slider.
|
|
7
|
+
/// @group slider
|
|
6
8
|
$kendo-slider-size: 200px !default;
|
|
9
|
+
/// The default size of the Slider tick.
|
|
10
|
+
/// @group slider
|
|
7
11
|
$kendo-slider-tick-size: null !default;
|
|
12
|
+
/// The default size of the Slider's track wrap.
|
|
13
|
+
/// @group slider
|
|
8
14
|
$kendo-slider-alt-size: 30px !default;
|
|
9
15
|
|
|
16
|
+
/// The font family of the Slider.
|
|
17
|
+
/// @group slider
|
|
10
18
|
$kendo-slider-font-family: $kendo-font-family !default;
|
|
19
|
+
/// The font size of the Slider.
|
|
20
|
+
/// @group slider
|
|
11
21
|
$kendo-slider-font-size: $kendo-font-size-md !default;
|
|
22
|
+
/// The line height of the Slider.
|
|
23
|
+
/// @group slider
|
|
12
24
|
$kendo-slider-line-height: $kendo-line-height-md !default;
|
|
13
25
|
|
|
26
|
+
/// The offset of the Slider Buttons.
|
|
27
|
+
/// @group slider
|
|
14
28
|
$kendo-slider-button-offset: 10px !default;
|
|
29
|
+
/// The size of the Slider Buttons.
|
|
30
|
+
/// @group slider
|
|
15
31
|
$kendo-slider-button-size: ($kendo-slider-alt-size - 2) !default;
|
|
32
|
+
/// The spacing of the Slider Buttons.
|
|
33
|
+
/// @group slider
|
|
16
34
|
$kendo-slider-button-spacing: ($kendo-slider-button-size + $kendo-slider-button-offset) !default;
|
|
35
|
+
/// The shadow of the focused Slider Buttons.
|
|
36
|
+
/// @group slider
|
|
17
37
|
$kendo-slider-button-focus-shadow: null !default;
|
|
18
38
|
|
|
39
|
+
/// The thickness of the Slider track.
|
|
40
|
+
/// @group slider
|
|
19
41
|
$kendo-slider-track-thickness: 4px !default;
|
|
42
|
+
/// The size of the Slider drag handle.
|
|
43
|
+
/// @group slider
|
|
20
44
|
$kendo-slider-draghandle-size: 14px !default;
|
|
45
|
+
/// The border width of the Slider drag handle.
|
|
46
|
+
/// @group slider
|
|
21
47
|
$kendo-slider-draghandle-border-width: 1px !default;
|
|
48
|
+
/// The transition scale of the active Slider drag handle.
|
|
49
|
+
/// @group slider
|
|
22
50
|
$kendo-slider-draghandle-active-scale: 1 !default;
|
|
51
|
+
/// The size of the active Slider drag handle.
|
|
52
|
+
/// @group slider
|
|
23
53
|
$kendo-slider-draghandle-active-size: null !default;
|
|
24
54
|
|
|
55
|
+
/// The background color of the Slider drag handle.
|
|
56
|
+
/// @group slider
|
|
25
57
|
$kendo-slider-draghandle-bg: $kendo-color-primary !default;
|
|
58
|
+
/// The text color of the Slider drag handle.
|
|
59
|
+
/// @group slider
|
|
26
60
|
$kendo-slider-draghandle-text: if($kendo-enable-color-system, k-color( on-primary ), k-contrast-legacy( $kendo-color-primary )) !default;
|
|
61
|
+
/// The border color of the Slider drag handle.
|
|
62
|
+
/// @group slider
|
|
27
63
|
$kendo-slider-draghandle-border: if($kendo-enable-color-system, k-color( primary ), k-try-shade( $kendo-color-primary, 2 )) !default;
|
|
64
|
+
/// The gradient of the Slider drag handle.
|
|
65
|
+
/// @group slider
|
|
28
66
|
$kendo-slider-draghandle-gradient: null !default;
|
|
29
67
|
|
|
68
|
+
/// The background color of the hovered Slider drag handle.
|
|
69
|
+
/// @group slider
|
|
30
70
|
$kendo-slider-draghandle-hover-bg: if($kendo-enable-color-system, k-color( primary-hover ), k-try-shade( $kendo-color-primary, 1 )) !default;
|
|
71
|
+
/// The text color of the hovered Slider drag handle.
|
|
72
|
+
/// @group slider
|
|
31
73
|
$kendo-slider-draghandle-hover-text: null !default;
|
|
74
|
+
/// The border color of the hovered Slider drag handle.
|
|
75
|
+
/// @group slider
|
|
32
76
|
$kendo-slider-draghandle-hover-border: if($kendo-enable-color-system, k-color( primary-hover ), k-try-shade( $kendo-slider-draghandle-hover-bg, 2 )) !default;
|
|
77
|
+
/// The gradient of the hovered Slider drag handle.
|
|
78
|
+
/// @group slider
|
|
33
79
|
$kendo-slider-draghandle-hover-gradient: null !default;
|
|
34
80
|
|
|
81
|
+
/// The background color of the active Slider drag handle.
|
|
82
|
+
/// @group slider
|
|
35
83
|
$kendo-slider-draghandle-pressed-bg: if($kendo-enable-color-system, k-color( primary-active ), k-try-shade( $kendo-color-primary, 2 )) !default;
|
|
84
|
+
/// The text color of the active Slider drag handle.
|
|
85
|
+
/// @group slider
|
|
36
86
|
$kendo-slider-draghandle-pressed-text: null !default;
|
|
87
|
+
/// The border color of the active Slider drag handle.
|
|
88
|
+
/// @group slider
|
|
37
89
|
$kendo-slider-draghandle-pressed-border: if($kendo-enable-color-system, k-color( primary-active ), k-try-shade( $kendo-slider-draghandle-pressed-bg, 2 )) !default;
|
|
90
|
+
/// The gradient of the active Slider drag handle.
|
|
91
|
+
/// @group slider
|
|
38
92
|
$kendo-slider-draghandle-pressed-gradient: null !default;
|
|
39
93
|
|
|
94
|
+
/// The shadow of the focused Slider drag handle.
|
|
95
|
+
/// @group slider
|
|
40
96
|
$kendo-slider-draghandle-focus-shadow: 0 0 4px 0 if($kendo-enable-color-system, rgba( k-color( primary, true ), .75 ), rgba( $kendo-slider-draghandle-border, .75 )) !default;
|
|
41
97
|
|
|
98
|
+
/// The transition speed of the Slider.
|
|
99
|
+
/// @group slider
|
|
42
100
|
$kendo-slider-transition-speed: .3s !default;
|
|
101
|
+
/// The transition function of the Slider.
|
|
102
|
+
/// @group slider
|
|
43
103
|
$kendo-slider-transition-function: ease-out !default;
|
|
104
|
+
/// The transition speed of the Slider drag handle.
|
|
105
|
+
/// @group slider
|
|
44
106
|
$kendo-slider-draghandle-transition-speed: .4s !default;
|
|
107
|
+
/// The transition function of the Slider drag handle.
|
|
108
|
+
/// @group slider
|
|
45
109
|
$kendo-slider-draghandle-transition-function: cubic-bezier(.25, .8, .25, 1) !default;
|
|
46
110
|
|
|
111
|
+
/// The background color of the Slider track.
|
|
112
|
+
/// @group slider
|
|
47
113
|
$kendo-slider-track-bg: if($kendo-enable-color-system, k-color( base ), k-try-shade( $kendo-component-bg, 1 )) !default;
|
|
114
|
+
/// The background color of the Slider's track selection.
|
|
115
|
+
/// @group slider
|
|
48
116
|
$kendo-slider-selection-bg: $kendo-color-primary !default;
|
|
117
|
+
/// @group slider
|
|
118
|
+
/// The opacity of the disabled Slider.
|
|
49
119
|
$kendo-slider-disabled-opacity: null !default;
|
|
@@ -1,66 +1,167 @@
|
|
|
1
1
|
// Timeline
|
|
2
|
+
|
|
3
|
+
/// The horizontal spacing of the Timeline.
|
|
4
|
+
/// @group timeline
|
|
2
5
|
$kendo-timeline-spacing-x: 40px !default;
|
|
6
|
+
/// The vertical spacing of the Timeline.
|
|
7
|
+
/// @group timeline
|
|
3
8
|
$kendo-timeline-spacing-y: 40px !default;
|
|
9
|
+
/// The padding between the Timeline's track items.
|
|
10
|
+
/// @group timeline
|
|
4
11
|
$kendo-timeline-items-padding: 16px !default;
|
|
5
12
|
|
|
13
|
+
/// The font family of the Timeline.
|
|
14
|
+
/// @group timeline
|
|
6
15
|
$kendo-timeline-font-family: $kendo-font-family !default;
|
|
16
|
+
/// The font size of the Timeline.
|
|
17
|
+
/// @group timeline
|
|
7
18
|
$kendo-timeline-font-size: $kendo-font-size-md !default;
|
|
19
|
+
/// The line height of the Timeline.
|
|
20
|
+
/// @group timeline
|
|
8
21
|
$kendo-timeline-line-height: $kendo-line-height-md !default;
|
|
9
22
|
|
|
23
|
+
/// The horizontal spacing of the mobile Timeline.
|
|
24
|
+
/// @group timeline
|
|
10
25
|
$kendo-timeline-mobile-spacing-x: 16px !default;
|
|
26
|
+
/// The vertical spacing of the mobile Timeline.
|
|
27
|
+
/// @group timeline
|
|
11
28
|
$kendo-timeline-mobile-spacing-y: 16px !default;
|
|
12
29
|
|
|
30
|
+
/// The width of the Timeline track arrow.
|
|
31
|
+
/// @group timeline
|
|
13
32
|
$kendo-timeline-track-arrow-width: 30px !default;
|
|
33
|
+
/// The height of the Timeline track arrow.
|
|
34
|
+
/// @group timeline
|
|
14
35
|
$kendo-timeline-track-arrow-height: 30px !default;
|
|
15
36
|
|
|
37
|
+
/// The background color of the disabled Timeline track arrow.
|
|
38
|
+
/// @group timeline
|
|
16
39
|
$kendo-timeline-track-arrow-disabled-bg: if($kendo-enable-color-system, rgba( k-color( base, true ), .6 ), k-true-mix( $kendo-button-bg, $kendo-body-bg, 65% )) !default;
|
|
40
|
+
/// The text color of the disabled Timeline track arrow.
|
|
41
|
+
/// @group timeline
|
|
17
42
|
$kendo-timeline-track-arrow-disabled-text: if($kendo-enable-color-system, rgba( k-color( on-base, true ), .6 ), k-true-mix( $kendo-button-text, $kendo-body-bg, 65% )) !default;
|
|
43
|
+
/// The border color of the disabled Timeline track arrow.
|
|
44
|
+
/// @group timeline
|
|
18
45
|
$kendo-timeline-track-arrow-disabled-border: if($kendo-enable-color-system, rgba( k-color( border, true ), .15 ), k-true-mix( #000000, $kendo-body-bg, 4.8% )) !default;
|
|
19
46
|
|
|
47
|
+
/// The size of the Timeline track.
|
|
48
|
+
/// @group timeline
|
|
20
49
|
$kendo-timeline-track-size: 6px !default;
|
|
50
|
+
/// The bottom padding of the Timeline's track wrapper.
|
|
51
|
+
/// @group timeline
|
|
21
52
|
$kendo-timeline-track-wrap-padding-bottom: k-math-div( $kendo-timeline-track-size, 2 ) !default;
|
|
53
|
+
/// The border width of the Timeline track.
|
|
54
|
+
/// @group timeline
|
|
22
55
|
$kendo-timeline-track-border-width: 1px !default;
|
|
56
|
+
/// The bottom margin of the Timeline track.
|
|
57
|
+
/// @group timeline
|
|
23
58
|
$kendo-timeline-track-margin-bottom: 16px !default;
|
|
59
|
+
/// The bottom offset of the Timeline track.
|
|
60
|
+
/// @group timeline
|
|
24
61
|
$kendo-timeline-track-bottom-calc: calc(#{k-math-div( $kendo-timeline-track-arrow-height, 2 )} + #{$kendo-timeline-track-wrap-padding-bottom}) !default;
|
|
62
|
+
/// The left offset of the Timeline track.
|
|
63
|
+
/// @group timeline
|
|
25
64
|
$kendo-timeline-track-start-calc: calc(#{$kendo-timeline-track-arrow-width} - 2 * #{$kendo-timeline-track-border-width}) !default;
|
|
65
|
+
/// The right offset of the Timeline track.
|
|
66
|
+
/// @group timeline
|
|
26
67
|
$kendo-timeline-track-end-calc: calc(#{$kendo-timeline-track-arrow-width} - 2 * #{$kendo-timeline-track-border-width}) !default;
|
|
68
|
+
/// The background color of the Timeline track.
|
|
69
|
+
/// @group timeline
|
|
27
70
|
$kendo-timeline-track-bg: $kendo-button-bg !default;
|
|
71
|
+
/// The border color of the Timeline track.
|
|
72
|
+
/// @group timeline
|
|
28
73
|
$kendo-timeline-track-border-color: $kendo-button-border !default;
|
|
29
74
|
|
|
75
|
+
/// The shadow of the Timeline's focused track items.
|
|
76
|
+
/// @group timeline
|
|
30
77
|
$kendo-timeline-track-item-focus-shadow: k-elevation(2) !default;
|
|
31
78
|
|
|
79
|
+
/// The offset of the Timeline track event.
|
|
80
|
+
/// @group timeline
|
|
32
81
|
$kendo-timeline-track-event-offset: 36px !default;
|
|
33
82
|
|
|
83
|
+
/// The horizontal padding of the Timeline flag.
|
|
84
|
+
/// @group timeline
|
|
34
85
|
$kendo-timeline-flag-padding-x: $kendo-button-padding-x !default;
|
|
86
|
+
/// The vertical padding of the Timeline flag.
|
|
87
|
+
/// @group timeline
|
|
35
88
|
$kendo-timeline-flag-padding-y: $kendo-button-padding-y !default;
|
|
89
|
+
/// The line height of the Timeline flag.
|
|
90
|
+
/// @group timeline
|
|
36
91
|
$kendo-timeline-flag-line-height: $kendo-button-line-height !default;
|
|
92
|
+
/// The minimum width of the Timeline flag.
|
|
93
|
+
/// @group timeline
|
|
37
94
|
$kendo-timeline-flag-min-width: 80px !default;
|
|
95
|
+
/// The maximum width of the Timeline flag.
|
|
96
|
+
/// @group timeline
|
|
38
97
|
$kendo-timeline-flag-max-width: calc(#{$kendo-timeline-flag-min-width} + 2 * #{$kendo-timeline-spacing-x}) !default;
|
|
98
|
+
/// The maximum width of the mobile Timeline flag.
|
|
99
|
+
/// @group timeline
|
|
39
100
|
$kendo-timeline-mobile-flag-max-width: calc(#{$kendo-timeline-flag-min-width} + 2 * #{$kendo-timeline-mobile-spacing-x}) !default;
|
|
101
|
+
/// The minimum width of the horizontal Timeline flag.
|
|
102
|
+
/// @group timeline
|
|
40
103
|
$kendo-timeline-horizontal-flag-min-width: 60px !default;
|
|
104
|
+
/// The background color of the Timeline flag.
|
|
105
|
+
/// @group timeline
|
|
41
106
|
$kendo-timeline-flag-bg: $kendo-color-primary !default;
|
|
107
|
+
/// The text color of the Timeline flag.
|
|
108
|
+
/// @group timeline
|
|
42
109
|
$kendo-timeline-flag-text: if($kendo-enable-color-system, k-color( on-primary ), k-contrast-legacy( $kendo-timeline-flag-bg )) !default;
|
|
43
110
|
|
|
111
|
+
/// The width of the Timeline's flag callout.
|
|
112
|
+
/// @group timeline
|
|
44
113
|
$kendo-timeline-flag-callout-width: 10px !default;
|
|
114
|
+
/// The height of the Timeline's flag callout.
|
|
115
|
+
/// @group timeline
|
|
45
116
|
$kendo-timeline-flag-callout-height: 10px !default;
|
|
46
117
|
|
|
118
|
+
/// The bottom offset of the Timeline flag.
|
|
119
|
+
/// @group timeline
|
|
47
120
|
$kendo-timeline-flag-offset-bottom: 4px !default;
|
|
121
|
+
/// The bottom margin of the Timeline flag.
|
|
122
|
+
/// @group timeline
|
|
48
123
|
$kendo-timeline-flag-margin-bottom-calc: calc(#{$kendo-timeline-track-size} + 2 * #{$kendo-timeline-track-border-width} + #{$kendo-timeline-flag-offset-bottom} + #{$kendo-timeline-flag-callout-height}) !default;
|
|
49
124
|
|
|
125
|
+
/// The width of the Timeline date.
|
|
126
|
+
/// @group timeline
|
|
50
127
|
$kendo-timeline-date-width: 50px !default;
|
|
128
|
+
/// The bottom margin of the Timeline date.
|
|
129
|
+
/// @group timeline
|
|
51
130
|
$kendo-timeline-date-margin-bottom: 8px !default;
|
|
52
131
|
|
|
132
|
+
/// The padding of the vertical Timeline.
|
|
133
|
+
/// @group timeline
|
|
53
134
|
$kendo-timeline-vertical-padding-calc: calc(#{$kendo-timeline-spacing-x} + (#{$kendo-timeline-flag-min-width} - #{$kendo-timeline-track-size}) / 2) !default;
|
|
135
|
+
/// The padding of the vertical Timeline date.
|
|
136
|
+
/// @group timeline
|
|
54
137
|
$kendo-timeline-vertical-padding-with-dates-calc: calc(#{$kendo-timeline-vertical-padding-calc} + #{$kendo-timeline-date-width}) !default;
|
|
138
|
+
/// The padding of the vertical mobile Timeline.
|
|
139
|
+
/// @group timeline
|
|
55
140
|
$kendo-timeline-mobile-vertical-padding-calc: calc(#{$kendo-timeline-mobile-spacing-x} + (#{$kendo-timeline-flag-min-width} - #{$kendo-timeline-track-size}) / 2) !default;
|
|
141
|
+
/// The padding of the vertical mobile Timeline date.
|
|
142
|
+
/// @group timeline
|
|
56
143
|
$kendo-timeline-mobile-vertical-padding-with-dates-calc: calc(#{$kendo-timeline-mobile-vertical-padding-calc} + #{$kendo-timeline-date-width}) !default;
|
|
57
144
|
|
|
145
|
+
/// The width of the Timeline circle.
|
|
146
|
+
/// @group timeline
|
|
58
147
|
$kendo-timeline-circle-width: 16px !default;
|
|
148
|
+
/// The height of the Timeline circle.
|
|
149
|
+
/// @group timeline
|
|
59
150
|
$kendo-timeline-circle-height: 16px !default;
|
|
151
|
+
/// The background color of the Timeline circle.
|
|
152
|
+
/// @group timeline
|
|
60
153
|
$kendo-timeline-circle-bg: $kendo-color-primary !default;
|
|
61
154
|
|
|
155
|
+
/// The horizontal padding of the Timeline collapse arrow.
|
|
156
|
+
/// @group timeline
|
|
62
157
|
$kendo-timeline-collapse-arrow-padding-x: $kendo-padding-md-x !default;
|
|
63
158
|
|
|
159
|
+
/// The width of the Timeline event.
|
|
160
|
+
/// @group timeline
|
|
64
161
|
$kendo-timeline-event-width: 400px !default;
|
|
162
|
+
/// The height of the Timeline event.
|
|
163
|
+
/// @group timeline
|
|
65
164
|
$kendo-timeline-event-height: 600px !default;
|
|
165
|
+
/// The minimum height of the Timeline event.
|
|
166
|
+
/// @group timeline
|
|
66
167
|
$kendo-timeline-event-min-height-calc: calc(2 * (#{$kendo-timeline-track-event-offset} - #{$kendo-card-border-width})) !default;
|