@progress/kendo-theme-material 8.0.0-dev.5 → 8.0.0-dev.6
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 +5 -5
- package/dist/all.scss +223 -37
- package/dist/meta/sassdoc-data.json +30482 -25562
- package/dist/meta/sassdoc-raw-data.json +5076 -2801
- package/dist/meta/variables.json +5 -5
- package/lib/swatches/material-aqua-dark.json +1 -1
- package/lib/swatches/material-arctic.json +1 -1
- package/lib/swatches/material-burnt-teal.json +1 -1
- package/lib/swatches/material-dataviz-v4.json +1 -1
- package/lib/swatches/material-eggplant.json +1 -1
- package/lib/swatches/material-lime-dark.json +1 -1
- package/lib/swatches/material-lime.json +1 -1
- package/lib/swatches/material-main-dark.json +1 -1
- package/lib/swatches/material-main.json +1 -1
- package/lib/swatches/material-nova.json +1 -1
- package/lib/swatches/material-pacific-dark.json +1 -1
- package/lib/swatches/material-pacific.json +1 -1
- package/lib/swatches/material-sky-dark.json +1 -1
- package/lib/swatches/material-sky.json +1 -1
- package/lib/swatches/material-smoke.json +1 -1
- package/package.json +5 -5
- package/scss/scheduler/_layout.scss +1 -1
- package/scss/scheduler/_variables.scss +144 -0
- package/scss/tabstrip/_variables.scss +70 -28
- package/scss/typography/_variables.scss +4 -4
package/dist/meta/variables.json
CHANGED
|
@@ -1165,19 +1165,19 @@
|
|
|
1165
1165
|
},
|
|
1166
1166
|
"kendo-display1-font-size": {
|
|
1167
1167
|
"type": "Calculation",
|
|
1168
|
-
"value": "calc(var(--kendo-font-size,
|
|
1168
|
+
"value": "calc(var(--kendo-font-size, 0.875rem) * 9.5)"
|
|
1169
1169
|
},
|
|
1170
1170
|
"kendo-display2-font-size": {
|
|
1171
1171
|
"type": "Calculation",
|
|
1172
|
-
"value": "calc(var(--kendo-font-size,
|
|
1172
|
+
"value": "calc(var(--kendo-font-size, 0.875rem) * 8.75)"
|
|
1173
1173
|
},
|
|
1174
1174
|
"kendo-display3-font-size": {
|
|
1175
1175
|
"type": "Calculation",
|
|
1176
|
-
"value": "calc(var(--kendo-font-size,
|
|
1176
|
+
"value": "calc(var(--kendo-font-size, 0.875rem) * 8)"
|
|
1177
1177
|
},
|
|
1178
1178
|
"kendo-display4-font-size": {
|
|
1179
1179
|
"type": "Calculation",
|
|
1180
|
-
"value": "calc(var(--kendo-font-size,
|
|
1180
|
+
"value": "calc(var(--kendo-font-size, 0.875rem) * 7.25)"
|
|
1181
1181
|
},
|
|
1182
1182
|
"kendo-display1-font-family": {
|
|
1183
1183
|
"type": "String",
|
|
@@ -1245,7 +1245,7 @@
|
|
|
1245
1245
|
},
|
|
1246
1246
|
"kendo-display": {
|
|
1247
1247
|
"type": "Map",
|
|
1248
|
-
"value": "(1: (font-size: calc(var(--kendo-font-size,
|
|
1248
|
+
"value": "(1: (font-size: calc(var(--kendo-font-size, 0.875rem) * 9.5), font-family: var(--kendo-font-family, inherit), line-height: 1.2, font-weight: var(--kendo-font-weight-light, normal), letter-spacing: var(--kendo-letter-spacing-tighter, normal)), 2: (font-size: calc(var(--kendo-font-size, 0.875rem) * 8.75), font-family: var(--kendo-font-family, inherit), line-height: 1.2, font-weight: var(--kendo-font-weight-light, normal), letter-spacing: var(--kendo-letter-spacing-tighter, normal)), 3: (font-size: calc(var(--kendo-font-size, 0.875rem) * 8), font-family: var(--kendo-font-family, inherit), line-height: 1.2, font-weight: var(--kendo-font-weight-light, normal), letter-spacing: var(--kendo-letter-spacing-tighter, normal)), 4: (font-size: calc(var(--kendo-font-size, 0.875rem) * 7.25), font-family: var(--kendo-font-family, inherit), line-height: 1.2, font-weight: var(--kendo-font-weight-light, normal), letter-spacing: var(--kendo-letter-spacing-tighter, normal)))"
|
|
1249
1249
|
},
|
|
1250
1250
|
"ki-embed-font": {
|
|
1251
1251
|
"type": "Bool",
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-theme-material",
|
|
3
3
|
"description": "Material theme for Kendo UI",
|
|
4
|
-
"version": "8.0.0-dev.
|
|
4
|
+
"version": "8.0.0-dev.6",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"keywords": [
|
|
@@ -54,13 +54,13 @@
|
|
|
54
54
|
},
|
|
55
55
|
"dependencies": {
|
|
56
56
|
"@progress/kendo-svg-icons": "2.3.0",
|
|
57
|
-
"@progress/kendo-theme-core": "8.0.0-dev.
|
|
58
|
-
"@progress/kendo-theme-default": "8.0.0-dev.
|
|
59
|
-
"@progress/kendo-theme-utils": "8.0.0-dev.
|
|
57
|
+
"@progress/kendo-theme-core": "8.0.0-dev.6",
|
|
58
|
+
"@progress/kendo-theme-default": "8.0.0-dev.6",
|
|
59
|
+
"@progress/kendo-theme-utils": "8.0.0-dev.6"
|
|
60
60
|
},
|
|
61
61
|
"directories": {
|
|
62
62
|
"doc": "docs",
|
|
63
63
|
"lib": "lib"
|
|
64
64
|
},
|
|
65
|
-
"gitHead": "
|
|
65
|
+
"gitHead": "56ff58288fe098a780c1d94cf5f0d793e81623e5"
|
|
66
66
|
}
|
|
@@ -70,7 +70,7 @@
|
|
|
70
70
|
line-height: normal;
|
|
71
71
|
|
|
72
72
|
.k-icon {
|
|
73
|
-
padding: calc( var( --kendo-font-size,
|
|
73
|
+
padding: calc( var( --kendo-font-size, .875rem) - var( --kendo-font-size-sm, .75rem) );
|
|
74
74
|
box-sizing: content-box;
|
|
75
75
|
vertical-align: unset;
|
|
76
76
|
}
|
|
@@ -1,92 +1,236 @@
|
|
|
1
1
|
// Scheduler
|
|
2
|
+
|
|
3
|
+
/// The width of the border around the Scheduler.
|
|
4
|
+
/// @group scheduler
|
|
2
5
|
$kendo-scheduler-border-width: 1px !default;
|
|
6
|
+
/// The font family of the Scheduler.
|
|
7
|
+
/// @group scheduler
|
|
3
8
|
$kendo-scheduler-font-family: var( --kendo-font-family, inherit ) !default;
|
|
9
|
+
/// The font size of the Scheduler.
|
|
10
|
+
/// @group scheduler
|
|
4
11
|
$kendo-scheduler-font-size: var( --kendo-font-size, inherit ) !default;
|
|
12
|
+
/// The line height of the Scheduler.
|
|
13
|
+
/// @group scheduler
|
|
5
14
|
$kendo-scheduler-line-height: var( --kendo-line-height, normal ) !default;
|
|
6
15
|
|
|
16
|
+
/// The background color of the Scheduler.
|
|
17
|
+
/// @group scheduler
|
|
7
18
|
$kendo-scheduler-bg: $kendo-component-bg !default;
|
|
19
|
+
/// The text color of the Scheduler.
|
|
20
|
+
/// @group scheduler
|
|
8
21
|
$kendo-scheduler-text: $kendo-component-text !default;
|
|
22
|
+
/// The border color of the Scheduler.
|
|
23
|
+
/// @group scheduler
|
|
9
24
|
$kendo-scheduler-border: $kendo-component-border !default;
|
|
10
25
|
|
|
26
|
+
/// The background color of the Scheduler ToolBar.
|
|
27
|
+
/// @group scheduler
|
|
11
28
|
$kendo-scheduler-toolbar-bg: if($kendo-enable-color-system, k-color( surface ), k-try-shade( $kendo-button-bg, .5 )) !default;
|
|
29
|
+
/// The text color of the Scheduler ToolBar.
|
|
30
|
+
/// @group scheduler
|
|
12
31
|
$kendo-scheduler-toolbar-text: null !default;
|
|
32
|
+
/// The border color of the Scheduler ToolBar.
|
|
33
|
+
/// @group scheduler
|
|
13
34
|
$kendo-scheduler-toolbar-border: null !default;
|
|
35
|
+
/// The gradient of the Scheduler ToolBar.
|
|
36
|
+
/// @group scheduler
|
|
14
37
|
$kendo-scheduler-toolbar-gradient: null !default;
|
|
15
38
|
|
|
39
|
+
/// The background color of the Scheduler footer.
|
|
40
|
+
/// @group scheduler
|
|
16
41
|
$kendo-scheduler-footer-bg: if($kendo-enable-color-system, k-color( surface ), k-try-shade( $kendo-button-bg, .5 )) !default;
|
|
42
|
+
/// The text color of the Scheduler footer.
|
|
43
|
+
/// @group scheduler
|
|
17
44
|
$kendo-scheduler-footer-text: null !default;
|
|
45
|
+
/// The border color of the Scheduler footer.
|
|
46
|
+
/// @group scheduler
|
|
18
47
|
$kendo-scheduler-footer-border: null !default;
|
|
48
|
+
/// The gradient of the Scheduler footer.
|
|
49
|
+
/// @group scheduler
|
|
19
50
|
$kendo-scheduler-footer-gradient: null !default;
|
|
20
51
|
|
|
52
|
+
/// The minimum height of the Scheduler event.
|
|
53
|
+
/// @group scheduler
|
|
21
54
|
$kendo-scheduler-event-min-height: 25px !default;
|
|
55
|
+
/// The border radius of the Scheduler event.
|
|
56
|
+
/// @group scheduler
|
|
22
57
|
$kendo-scheduler-event-border-radius: k-border-radius(md) !default;
|
|
58
|
+
/// The line height of the Scheduler event.
|
|
59
|
+
/// @group scheduler
|
|
23
60
|
$kendo-scheduler-event-line-height: calc( #{$kendo-scheduler-event-min-height} - (2 * #{$kendo-padding-sm-y}) ) !default;
|
|
24
61
|
|
|
62
|
+
/// The background color of the Scheduler event.
|
|
63
|
+
/// @group scheduler
|
|
25
64
|
$kendo-scheduler-event-bg: $kendo-color-primary !default;
|
|
65
|
+
/// The text color of the Scheduler event.
|
|
66
|
+
/// @group scheduler
|
|
26
67
|
$kendo-scheduler-event-text: if($kendo-enable-color-system, k-color( on-primary ), k-contrast-color( $kendo-scheduler-event-bg )) !default;
|
|
68
|
+
/// The border color of the Scheduler event.
|
|
69
|
+
/// @group scheduler
|
|
27
70
|
$kendo-scheduler-event-border: null !default;
|
|
71
|
+
/// The gradient of the Scheduler event.
|
|
72
|
+
/// @group scheduler
|
|
28
73
|
$kendo-scheduler-event-gradient: null !default;
|
|
74
|
+
/// The shadow of the Scheduler event.
|
|
75
|
+
/// @group scheduler
|
|
29
76
|
$kendo-scheduler-event-shadow: null !default;
|
|
30
77
|
|
|
78
|
+
/// The background color of the hovered Scheduler event.
|
|
79
|
+
/// @group scheduler
|
|
31
80
|
$kendo-scheduler-event-hover-bg: null !default;
|
|
81
|
+
/// The text color of the hovered Scheduler event.
|
|
82
|
+
/// @group scheduler
|
|
32
83
|
$kendo-scheduler-event-hover-text: null !default;
|
|
84
|
+
/// The border color of the hovered Scheduler event.
|
|
85
|
+
/// @group scheduler
|
|
33
86
|
$kendo-scheduler-event-hover-border: null !default;
|
|
87
|
+
/// The gradient of the hovered Scheduler event.
|
|
88
|
+
/// @group scheduler
|
|
34
89
|
$kendo-scheduler-event-hover-gradient: null !default;
|
|
90
|
+
/// The shadow of the hovered Scheduler event.
|
|
91
|
+
/// @group scheduler
|
|
35
92
|
$kendo-scheduler-event-hover-shadow: null !default;
|
|
36
93
|
|
|
94
|
+
/// The background color of the selected Scheduler event.
|
|
95
|
+
/// @group scheduler
|
|
37
96
|
$kendo-scheduler-event-selected-bg: if($kendo-enable-color-system, k-color( primary-active ), k-try-tint( $kendo-color-primary, 1 )) !default;
|
|
97
|
+
/// The text color of the selected Scheduler event.
|
|
98
|
+
/// @group scheduler
|
|
38
99
|
$kendo-scheduler-event-selected-text: if($kendo-enable-color-system, k-color( on-primary ), k-contrast-color( $kendo-scheduler-event-selected-bg )) !default;
|
|
100
|
+
/// The border color of the selected Scheduler event.
|
|
101
|
+
/// @group scheduler
|
|
39
102
|
$kendo-scheduler-event-selected-border: null !default;
|
|
103
|
+
/// The gradient of the selected Scheduler event.
|
|
104
|
+
/// @group scheduler
|
|
40
105
|
$kendo-scheduler-event-selected-gradient: null !default;
|
|
106
|
+
/// The shadow of the selected Scheduler event.
|
|
107
|
+
/// @group scheduler
|
|
41
108
|
$kendo-scheduler-event-selected-shadow: $box-shadow-depth-3 !default;
|
|
42
109
|
|
|
110
|
+
/// The shadow of the ongoing Scheduler event.
|
|
111
|
+
/// @group scheduler
|
|
43
112
|
$kendo-scheduler-event-ongoing-shadow: inset 0px 0px 0px 1px #ff0000 !default;
|
|
44
113
|
|
|
114
|
+
/// The horizontal padding of the Scheduler cell.
|
|
115
|
+
/// @group scheduler
|
|
45
116
|
$kendo-scheduler-cell-padding-x: k-spacing(2) !default;
|
|
117
|
+
/// The vertical padding of the Scheduler cell.
|
|
118
|
+
/// @group scheduler
|
|
46
119
|
$kendo-scheduler-cell-padding-y: k-spacing(2) !default;
|
|
120
|
+
/// The height of the Scheduler cell.
|
|
121
|
+
/// @group scheduler
|
|
47
122
|
$kendo-scheduler-cell-height: calc( var( --kendo-line-height, normal) * 1rem) !default;
|
|
123
|
+
/// The width of the Scheduler date column.
|
|
124
|
+
/// @group scheduler
|
|
48
125
|
$kendo-scheduler-datecolumn-width: 12rem !default;
|
|
126
|
+
|
|
127
|
+
/// The width of the Scheduler time column.
|
|
128
|
+
/// @group scheduler
|
|
49
129
|
$kendo-scheduler-timecolumn-width: 11rem !default;
|
|
50
130
|
|
|
131
|
+
/// The background color of the non-working hours in the Scheduler.
|
|
132
|
+
/// @group scheduler
|
|
51
133
|
$kendo-scheduler-nonwork-bg: if($kendo-enable-color-system, k-color( surface ), k-try-shade( $kendo-scheduler-bg, .5 )) !default;
|
|
134
|
+
/// The text color of the non-working hours in the Scheduler.
|
|
135
|
+
/// @group scheduler
|
|
52
136
|
$kendo-scheduler-nonwork-text: null !default;
|
|
53
137
|
|
|
138
|
+
/// The background color of the weekends in the Scheduler.
|
|
139
|
+
/// @group scheduler
|
|
54
140
|
$kendo-scheduler-weekend-bg: null !default;
|
|
141
|
+
/// The text color of the weekends in the Scheduler.
|
|
142
|
+
/// @group scheduler
|
|
55
143
|
$kendo-scheduler-weekend-text: null !default;
|
|
56
144
|
|
|
145
|
+
/// The background color of the preceding/subsequent month cells in the Calendar.
|
|
146
|
+
/// @group scheduler
|
|
57
147
|
$kendo-scheduler-othermonth-bg: if($kendo-enable-color-system, k-color( surface ), k-try-shade( $kendo-scheduler-bg, .5 )) !default;
|
|
148
|
+
/// The text color of the preceding/subsequent month cells in the Calendar.
|
|
149
|
+
/// @group scheduler
|
|
58
150
|
$kendo-scheduler-othermonth-text: null !default;
|
|
59
151
|
|
|
152
|
+
/// The horizontal padding of the year view in the Scheduler.
|
|
153
|
+
/// @group scheduler
|
|
60
154
|
$kendo-scheduler-yearview-padding-x: k-spacing(5) !default;
|
|
155
|
+
/// The vertical padding of the year view in the Scheduler.
|
|
156
|
+
/// @group scheduler
|
|
61
157
|
$kendo-scheduler-yearview-padding-y: $kendo-scheduler-yearview-padding-x !default;
|
|
62
158
|
|
|
159
|
+
/// The spacing between the calendars of the year view in the Scheduler.
|
|
160
|
+
/// @group scheduler
|
|
63
161
|
$kendo-scheduler-yearview-calendar-gap: k-spacing(5) !default;
|
|
64
162
|
|
|
163
|
+
/// The days with events indicator size of the year view in the Scheduler.
|
|
164
|
+
/// @group scheduler
|
|
65
165
|
$kendo-scheduler-yearview-indicator-size: 3px !default;
|
|
166
|
+
/// The top position of the days with events indicator of the year view in the Scheduler.
|
|
167
|
+
/// @group scheduler
|
|
66
168
|
$kendo-scheduler-yearview-indicator-calc-offset-top: calc( #{$kendo-calendar-cell-size} - (#{$kendo-calendar-cell-padding-y} * 2)) !default;
|
|
169
|
+
/// The left position of the days with events indicator of the year view in the Scheduler.
|
|
170
|
+
/// @group scheduler
|
|
67
171
|
$kendo-scheduler-yearview-indicator-calc-offset-left: calc( 50% - #{k-math-div( $kendo-scheduler-yearview-indicator-size, 2 )} ) !default;
|
|
172
|
+
/// The border radius of the days with events indicator of the year view in the Scheduler.
|
|
173
|
+
/// @group scheduler
|
|
68
174
|
$kendo-scheduler-yearview-indicator-border-radius: 50% !default;
|
|
175
|
+
/// The background color of the days with events indicator of the year view in the Scheduler.
|
|
176
|
+
/// @group scheduler
|
|
69
177
|
$kendo-scheduler-yearview-indicator-bg: $kendo-color-primary !default;
|
|
178
|
+
/// The background color of the selected days with events indicator of the year view in the Scheduler.
|
|
179
|
+
/// @group scheduler
|
|
70
180
|
$kendo-scheduler-yearview-indicator-selected-bg: $kendo-color-primary-contrast !default;
|
|
71
181
|
|
|
182
|
+
/// The horizontal padding of the Scheduler Tooltip.
|
|
183
|
+
/// @group scheduler
|
|
72
184
|
$kendo-scheduler-tooltip-padding-x: k-spacing(2) !default;
|
|
185
|
+
/// The vertical padding of the Scheduler Tooltip.
|
|
186
|
+
/// @group scheduler
|
|
73
187
|
$kendo-scheduler-tooltip-padding-y: k-spacing(2) !default;
|
|
188
|
+
/// The width of the border of the Scheduler Tooltip.
|
|
189
|
+
/// @group scheduler
|
|
74
190
|
$kendo-scheduler-tooltip-border-width: 0 !default;
|
|
191
|
+
/// The background color of the Scheduler Tooltip.
|
|
192
|
+
/// @group scheduler
|
|
75
193
|
$kendo-scheduler-tooltip-bg: $kendo-color-primary-contrast !default;
|
|
194
|
+
/// The text color of the Scheduler Tooltip.
|
|
195
|
+
/// @group scheduler
|
|
76
196
|
$kendo-scheduler-tooltip-text: $kendo-base-text !default;
|
|
197
|
+
/// The border color of the Scheduler Tooltip.
|
|
198
|
+
/// @group scheduler
|
|
77
199
|
$kendo-scheduler-tooltip-border: null !default;
|
|
200
|
+
/// The shadow of the Scheduler Tooltip.
|
|
201
|
+
/// @group scheduler
|
|
78
202
|
$kendo-scheduler-tooltip-shadow: $box-shadow-depth-2 !default;
|
|
79
203
|
|
|
204
|
+
/// The vertical margin of the Scheduler Tooltip title.
|
|
205
|
+
/// @group scheduler
|
|
80
206
|
$kendo-scheduler-tooltip-title-margin-y: k-spacing(2) !default;
|
|
207
|
+
/// The font size of the month inside the Scheduler Tooltip.
|
|
208
|
+
/// @group scheduler
|
|
81
209
|
$kendo-scheduler-tooltip-month-font-size: var( --kendo-font-size-sm, inherit ) !default;
|
|
210
|
+
/// The font size of the day inside the Scheduler Tooltip.
|
|
211
|
+
/// @group scheduler
|
|
82
212
|
$kendo-scheduler-tooltip-day-font-size: calc( #{$kendo-scheduler-tooltip-month-font-size} * 2 ) !default;
|
|
83
213
|
|
|
214
|
+
/// The max height of the events inside the Scheduler Tooltip.
|
|
215
|
+
/// @group scheduler
|
|
84
216
|
$kendo-scheduler-tooltip-events-max-height: 250px !default;
|
|
217
|
+
/// The spacing between the events inside the Scheduler Tooltip.
|
|
218
|
+
/// @group scheduler
|
|
85
219
|
$kendo-scheduler-tooltip-events-gap: k-spacing(1) !default;
|
|
86
220
|
|
|
221
|
+
/// The horizontal padding of the events inside the Scheduler Tooltip.
|
|
222
|
+
/// @group scheduler
|
|
87
223
|
$kendo-scheduler-tooltip-event-padding-x: k-spacing(2) !default;
|
|
224
|
+
/// The vertical padding of the events inside the Scheduler Tooltip.
|
|
225
|
+
/// @group scheduler
|
|
88
226
|
$kendo-scheduler-tooltip-event-padding-y: k-spacing(2) !default;
|
|
227
|
+
/// The border radius of the events inside the Scheduler Tooltip.
|
|
228
|
+
/// @group scheduler
|
|
89
229
|
$kendo-scheduler-tooltip-event-border-radius: k-border-radius(md) !default;
|
|
230
|
+
/// The spacing between the events items inside the Scheduler Tooltip.
|
|
231
|
+
/// @group scheduler
|
|
90
232
|
$kendo-scheduler-tooltip-event-gap: k-spacing(2) !default;
|
|
91
233
|
|
|
234
|
+
/// The color of the Scheduler Tooltip callout.
|
|
235
|
+
/// @group scheduler
|
|
92
236
|
$kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
|
|
@@ -1,115 +1,157 @@
|
|
|
1
|
-
//
|
|
1
|
+
// TabStrip
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
/// The horizontal padding of the TabStrip wrapper.
|
|
5
|
+
/// @group tabstrip
|
|
2
6
|
$kendo-tabstrip-wrapper-padding-x: k-spacing(0) !default;
|
|
7
|
+
/// The vertical padding of the TabStrip wrapper.
|
|
8
|
+
/// @group tabstrip
|
|
3
9
|
$kendo-tabstrip-wrapper-padding-y: k-spacing(0) !default;
|
|
10
|
+
/// The border width around the TabStrip wrapper.
|
|
11
|
+
/// @group tabstrip
|
|
4
12
|
$kendo-tabstrip-wrapper-border-width: 0px !default;
|
|
5
13
|
|
|
14
|
+
/// The font family of the TabStrip.
|
|
15
|
+
/// @group tabstrip
|
|
6
16
|
$kendo-tabstrip-font-family: var( --kendo-font-family, inherit ) !default;
|
|
17
|
+
/// The font size of the TabStrip.
|
|
18
|
+
/// @group tabstrip
|
|
7
19
|
$kendo-tabstrip-font-size: var( --kendo-font-size, inherit ) !default;
|
|
20
|
+
/// The line height of the TabStrip.
|
|
21
|
+
/// @group tabstrip
|
|
8
22
|
$kendo-tabstrip-line-height: k-math-div( 20, 14 ) !default;
|
|
23
|
+
/// The border width around the TabStrip.
|
|
24
|
+
/// @group tabstrip
|
|
9
25
|
$kendo-tabstrip-border-width: 1px !default;
|
|
10
26
|
|
|
27
|
+
/// The background color of the TabStrip wrapper.
|
|
28
|
+
/// @group tabstrip
|
|
11
29
|
$kendo-tabstrip-wrapper-bg: null !default;
|
|
30
|
+
/// The text color of the TabStrip wrapper.
|
|
31
|
+
/// @group tabstrip
|
|
12
32
|
$kendo-tabstrip-wrapper-text: null !default;
|
|
33
|
+
/// The border color of the TabStrip wrapper.
|
|
34
|
+
/// @group tabstrip
|
|
13
35
|
$kendo-tabstrip-wrapper-border: null !default;
|
|
14
36
|
|
|
15
|
-
///
|
|
37
|
+
/// The background color of the TabStrip.
|
|
16
38
|
/// @group tabstrip
|
|
17
39
|
$kendo-tabstrip-bg: null !default;
|
|
18
|
-
///
|
|
40
|
+
/// The text color of the TabStrip.
|
|
19
41
|
/// @group tabstrip
|
|
20
42
|
$kendo-tabstrip-text: $kendo-subtle-text !default;
|
|
21
|
-
///
|
|
43
|
+
/// The border color of the TabStrip.
|
|
22
44
|
/// @group tabstrip
|
|
23
45
|
$kendo-tabstrip-border: $kendo-component-border !default;
|
|
24
46
|
|
|
25
|
-
///
|
|
47
|
+
/// The horizontal padding of the TabStrip items.
|
|
26
48
|
/// @group tabstrip
|
|
27
49
|
$kendo-tabstrip-item-padding-x: k-spacing(6) !default;
|
|
28
|
-
///
|
|
50
|
+
/// The vertical padding of the TabStrip items.
|
|
29
51
|
/// @group tabstrip
|
|
30
52
|
$kendo-tabstrip-item-padding-y: k-spacing(3.5) !default;
|
|
31
|
-
///
|
|
53
|
+
/// The border width around the TabStrip items.
|
|
32
54
|
/// @group tabstrip
|
|
33
55
|
$kendo-tabstrip-item-border-width: 0px !default;
|
|
34
|
-
///
|
|
56
|
+
/// The border radius of the TabStrip items.
|
|
35
57
|
/// @group tabstrip
|
|
36
58
|
$kendo-tabstrip-item-border-radius: 0px !default;
|
|
37
|
-
///
|
|
59
|
+
/// The gap between the TabStrip items.
|
|
38
60
|
/// @group tabstrip
|
|
39
61
|
$kendo-tabstrip-item-gap: k-spacing(0) !default;
|
|
40
62
|
|
|
41
|
-
///
|
|
63
|
+
/// The background color of the TabStrip items.
|
|
42
64
|
/// @group tabstrip
|
|
43
65
|
$kendo-tabstrip-item-bg: null !default;
|
|
44
|
-
///
|
|
66
|
+
/// The text color of the TabStrip items.
|
|
45
67
|
/// @group tabstrip
|
|
46
68
|
$kendo-tabstrip-item-text: $kendo-subtle-text !default;
|
|
47
|
-
///
|
|
69
|
+
/// The border color of the TabStrip items.
|
|
48
70
|
/// @group tabstrip
|
|
49
71
|
$kendo-tabstrip-item-border: null !default;
|
|
50
|
-
///
|
|
72
|
+
/// The gradient of the TabStrip items.
|
|
51
73
|
/// @group tabstrip
|
|
52
74
|
$kendo-tabstrip-item-gradient: null !default;
|
|
53
75
|
|
|
54
|
-
///
|
|
76
|
+
/// The background color of the hovered TabStrip items.
|
|
55
77
|
/// @group tabstrip
|
|
56
78
|
$kendo-tabstrip-item-hover-bg: $kendo-hover-bg !default;
|
|
57
|
-
///
|
|
79
|
+
/// The text color of the hovered TabStrip items.
|
|
58
80
|
/// @group tabstrip
|
|
59
81
|
$kendo-tabstrip-item-hover-text: $kendo-body-text !default;
|
|
60
|
-
///
|
|
82
|
+
/// The border color of the hovered TabStrip items.
|
|
61
83
|
/// @group tabstrip
|
|
62
84
|
$kendo-tabstrip-item-hover-border: null !default;
|
|
63
|
-
///
|
|
85
|
+
/// The gradient of the hovered TabStrip items.
|
|
64
86
|
/// @group tabstrip
|
|
65
87
|
$kendo-tabstrip-item-hover-gradient: null !default;
|
|
66
88
|
|
|
67
|
-
///
|
|
89
|
+
/// The background color of the selected TabStrip items.
|
|
68
90
|
/// @group tabstrip
|
|
69
91
|
$kendo-tabstrip-item-selected-bg: null !default;
|
|
70
|
-
///
|
|
92
|
+
/// The text color of the selected TabStrip items.
|
|
71
93
|
/// @group tabstrip
|
|
72
94
|
$kendo-tabstrip-item-selected-text: $kendo-body-text !default;
|
|
73
|
-
///
|
|
95
|
+
/// The border color of the selected TabStrip items.
|
|
74
96
|
/// @group tabstrip
|
|
75
97
|
$kendo-tabstrip-item-selected-border: null !default;
|
|
76
|
-
///
|
|
98
|
+
/// The gradient of the selected TabStrip items.
|
|
77
99
|
/// @group tabstrip
|
|
78
100
|
$kendo-tabstrip-item-selected-gradient: null !default;
|
|
79
101
|
|
|
102
|
+
/// The shadow of the focused TabStrip items.
|
|
103
|
+
/// @group tabstrip
|
|
80
104
|
$kendo-tabstrip-item-focus-shadow: $kendo-list-item-focus-shadow !default;
|
|
81
105
|
|
|
106
|
+
/// The shadow of the dragged TabStrip items.
|
|
107
|
+
/// @group tabstrip
|
|
82
108
|
$kendo-tabstrip-item-dragging-shadow: $box-shadow-depth-3 !default;
|
|
83
109
|
|
|
110
|
+
/// The background color of the disabled TabStrip items.
|
|
111
|
+
/// @group tabstrip
|
|
84
112
|
$kendo-tabstrip-item-disabled-bg: null !default;
|
|
113
|
+
/// The text color of the disabled TabStrip items.
|
|
114
|
+
/// @group tabstrip
|
|
85
115
|
$kendo-tabstrip-item-disabled-text: if($kendo-enable-color-system, color-mix(in srgb, k-color( on-app-surface ) 32%, transparent), k-map-get( $theme, disabled-text )) !default;
|
|
116
|
+
/// The border color of the disabled TabStrip items.
|
|
117
|
+
/// @group tabstrip
|
|
86
118
|
$kendo-tabstrip-item-disabled-border: null !default;
|
|
119
|
+
/// The gradient of the disabled TabStrip items.
|
|
120
|
+
/// @group tabstrip
|
|
87
121
|
$kendo-tabstrip-item-disabled-gradient: null !default;
|
|
122
|
+
/// The opacity of the disabled TabStrip items.
|
|
123
|
+
/// @group tabstrip
|
|
88
124
|
$kendo-tabstrip-item-disabled-opacity: 1 !default;
|
|
125
|
+
/// The filter of the disabled TabStrip items.
|
|
126
|
+
/// @group tabstrip
|
|
89
127
|
$kendo-tabstrip-item-disabled-filter: none !default;
|
|
90
128
|
|
|
129
|
+
/// The border width of the TabStrip indicator.
|
|
130
|
+
/// @group tabstrip
|
|
91
131
|
$kendo-tabstrip-indicator-size: 2px !default;
|
|
132
|
+
/// The border color of the TabStrip ripple.
|
|
133
|
+
/// @group tabstrip
|
|
92
134
|
$kendo-tabstrip-indicator-color: $kendo-color-primary !default;
|
|
93
135
|
|
|
94
|
-
///
|
|
136
|
+
/// The horizontal padding of the TabStrip content.
|
|
95
137
|
/// @group tabstrip
|
|
96
138
|
$kendo-tabstrip-content-padding-x: k-spacing(4) !default;
|
|
97
|
-
///
|
|
139
|
+
/// The vertical padding of the TabStrip content.
|
|
98
140
|
/// @group tabstrip
|
|
99
141
|
$kendo-tabstrip-content-padding-y: k-spacing(4) !default;
|
|
100
|
-
///
|
|
142
|
+
/// The border width around the TabStrip content.
|
|
101
143
|
/// @group tabstrip
|
|
102
144
|
$kendo-tabstrip-content-border-width: 0px !default;
|
|
103
145
|
|
|
104
|
-
///
|
|
146
|
+
/// The background color of the TabStrip content.
|
|
105
147
|
/// @group tabstrip
|
|
106
148
|
$kendo-tabstrip-content-bg: transparent !default;
|
|
107
|
-
///
|
|
149
|
+
/// The text color of the TabStrip content.
|
|
108
150
|
/// @group tabstrip
|
|
109
151
|
$kendo-tabstrip-content-text: null !default;
|
|
110
|
-
///
|
|
152
|
+
/// The border color of the TabStrip content.
|
|
111
153
|
/// @group tabstrip
|
|
112
154
|
$kendo-tabstrip-content-border: null !default;
|
|
113
|
-
///
|
|
155
|
+
/// The border color of the focused TabStrip content.
|
|
114
156
|
/// @group tabstrip
|
|
115
157
|
$kendo-tabstrip-content-focus-border: $kendo-component-text !default;
|