@progress/kendo-theme-default 7.1.0-dev.6 → 7.1.0-dev.7
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 +168 -11
- package/dist/all.scss +243 -10
- package/dist/meta/sassdoc-data.json +928 -388
- package/dist/meta/sassdoc-raw-data.json +442 -192
- package/dist/meta/variables.json +34 -2
- package/lib/swatches/default-blue.json +1 -1
- package/lib/swatches/default-dataviz-v4.json +1 -1
- package/lib/swatches/default-green.json +1 -1
- package/lib/swatches/default-main-dark.json +1 -1
- package/lib/swatches/default-main.json +1 -1
- package/lib/swatches/default-nordic.json +1 -1
- package/lib/swatches/default-ocean-blue-a11y.json +1 -1
- package/lib/swatches/default-ocean-blue.json +1 -1
- package/lib/swatches/default-orange.json +1 -1
- package/lib/swatches/default-purple.json +1 -1
- package/lib/swatches/default-turquoise.json +1 -1
- package/lib/swatches/default-urban.json +1 -1
- package/package.json +4 -4
- package/scss/_variables.scss +13 -0
- package/scss/drawer/_layout.scss +1 -0
- package/scss/dropdowntree/_layout.scss +16 -0
- package/scss/input/_layout.scss +35 -9
- package/scss/input/_theme.scss +151 -0
- package/scss/input/_variables.scss +22 -1
package/dist/meta/variables.json
CHANGED
|
@@ -551,6 +551,22 @@
|
|
|
551
551
|
"type": "Null",
|
|
552
552
|
"value": "null"
|
|
553
553
|
},
|
|
554
|
+
"kendo-valid-bg": {
|
|
555
|
+
"type": "String",
|
|
556
|
+
"value": "initial"
|
|
557
|
+
},
|
|
558
|
+
"kendo-valid-text": {
|
|
559
|
+
"type": "Color",
|
|
560
|
+
"value": "#37b400"
|
|
561
|
+
},
|
|
562
|
+
"kendo-valid-border": {
|
|
563
|
+
"type": "Color",
|
|
564
|
+
"value": "#37b400"
|
|
565
|
+
},
|
|
566
|
+
"kendo-valid-shadow": {
|
|
567
|
+
"type": "Null",
|
|
568
|
+
"value": "null"
|
|
569
|
+
},
|
|
554
570
|
"kendo-loading-opacity": {
|
|
555
571
|
"type": "Number",
|
|
556
572
|
"value": "0.3"
|
|
@@ -3507,14 +3523,22 @@
|
|
|
3507
3523
|
"type": "Null",
|
|
3508
3524
|
"value": "null"
|
|
3509
3525
|
},
|
|
3510
|
-
"kendo-input-separator-
|
|
3526
|
+
"kendo-input-separator-text": {
|
|
3511
3527
|
"type": "Color",
|
|
3512
|
-
"value": "
|
|
3528
|
+
"value": "rgba(0, 0, 0, 0.08)"
|
|
3513
3529
|
},
|
|
3514
3530
|
"kendo-input-separator-opacity": {
|
|
3515
3531
|
"type": "Number",
|
|
3516
3532
|
"value": "0.5"
|
|
3517
3533
|
},
|
|
3534
|
+
"kendo-input-prefix-text": {
|
|
3535
|
+
"type": "Color",
|
|
3536
|
+
"value": "#666666"
|
|
3537
|
+
},
|
|
3538
|
+
"kendo-input-suffix-text": {
|
|
3539
|
+
"type": "Color",
|
|
3540
|
+
"value": "#666666"
|
|
3541
|
+
},
|
|
3518
3542
|
"kendo-input-invalid-border": {
|
|
3519
3543
|
"type": "Color",
|
|
3520
3544
|
"value": "#f31700"
|
|
@@ -3523,6 +3547,14 @@
|
|
|
3523
3547
|
"type": "Null",
|
|
3524
3548
|
"value": "null"
|
|
3525
3549
|
},
|
|
3550
|
+
"kendo-input-valid-border": {
|
|
3551
|
+
"type": "Color",
|
|
3552
|
+
"value": "#37b400"
|
|
3553
|
+
},
|
|
3554
|
+
"kendo-input-valid-shadow": {
|
|
3555
|
+
"type": "Null",
|
|
3556
|
+
"value": "null"
|
|
3557
|
+
},
|
|
3526
3558
|
"kendo-picker-bg": {
|
|
3527
3559
|
"type": "Color",
|
|
3528
3560
|
"value": "#f5f5f5"
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progress/kendo-theme-default",
|
|
3
3
|
"description": "SASS resources for the default Kendo UI theme",
|
|
4
|
-
"version": "7.1.0-dev.
|
|
4
|
+
"version": "7.1.0-dev.7",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"keywords": [
|
|
@@ -52,12 +52,12 @@
|
|
|
52
52
|
},
|
|
53
53
|
"dependencies": {
|
|
54
54
|
"@progress/kendo-svg-icons": "2.1.0",
|
|
55
|
-
"@progress/kendo-theme-core": "7.1.0-dev.
|
|
56
|
-
"@progress/kendo-theme-utils": "7.1.0-dev.
|
|
55
|
+
"@progress/kendo-theme-core": "7.1.0-dev.7",
|
|
56
|
+
"@progress/kendo-theme-utils": "7.1.0-dev.7"
|
|
57
57
|
},
|
|
58
58
|
"directories": {
|
|
59
59
|
"doc": "docs",
|
|
60
60
|
"lib": "lib"
|
|
61
61
|
},
|
|
62
|
-
"gitHead": "
|
|
62
|
+
"gitHead": "4bacca4f18a86fbe5bd6cf1cbf192e82c5504709"
|
|
63
63
|
}
|
package/scss/_variables.scss
CHANGED
|
@@ -447,6 +447,19 @@ $kendo-invalid-border: $kendo-color-error !default;
|
|
|
447
447
|
/// @group component
|
|
448
448
|
$kendo-invalid-shadow: null !default;
|
|
449
449
|
|
|
450
|
+
/// Background color of the valid items.
|
|
451
|
+
/// @group component
|
|
452
|
+
$kendo-valid-bg: null !default;
|
|
453
|
+
/// Text color of the valid items.
|
|
454
|
+
/// @group component
|
|
455
|
+
$kendo-valid-text: $kendo-color-success !default;
|
|
456
|
+
/// Border color of the valid items.
|
|
457
|
+
/// @group component
|
|
458
|
+
$kendo-valid-border: $kendo-color-success !default;
|
|
459
|
+
/// Shadow of the valid items.
|
|
460
|
+
/// @group component
|
|
461
|
+
$kendo-valid-shadow: null !default;
|
|
462
|
+
|
|
450
463
|
// Loading
|
|
451
464
|
$kendo-loading-opacity: .3 !default;
|
|
452
465
|
$kendo-zindex-loading: 100 !default;
|
package/scss/drawer/_layout.scss
CHANGED
|
@@ -18,6 +18,22 @@
|
|
|
18
18
|
}
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
+
.k-multiselecttree {
|
|
22
|
+
.k-input-values {
|
|
23
|
+
width: auto;
|
|
24
|
+
max-width: 100%;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.k-input-inner::before {
|
|
28
|
+
content: "\200b";
|
|
29
|
+
width: 0px;
|
|
30
|
+
overflow: hidden;
|
|
31
|
+
flex: none;
|
|
32
|
+
display: inline-block;
|
|
33
|
+
vertical-align: top;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
|
|
21
37
|
}
|
|
22
38
|
|
|
23
39
|
|
package/scss/input/_layout.scss
CHANGED
|
@@ -190,12 +190,20 @@
|
|
|
190
190
|
.k-input-suffix {
|
|
191
191
|
border-color: inherit;
|
|
192
192
|
display: flex;
|
|
193
|
-
flex-flow: row nowrap;
|
|
194
193
|
align-items: center;
|
|
195
194
|
flex: none;
|
|
196
195
|
|
|
197
196
|
> * {
|
|
198
197
|
flex-shrink: 0;
|
|
198
|
+
border: none;
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
&-vertical {
|
|
202
|
+
flex-flow: column wrap;
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
&-horizontal {
|
|
206
|
+
flex-flow: row wrap;
|
|
199
207
|
}
|
|
200
208
|
}
|
|
201
209
|
|
|
@@ -203,21 +211,27 @@
|
|
|
203
211
|
// Input separator
|
|
204
212
|
.k-input-separator {
|
|
205
213
|
margin: 0;
|
|
206
|
-
width: 0;
|
|
207
|
-
height: $kendo-icon-size;
|
|
208
|
-
border-width: 0 0 0 1px;
|
|
209
214
|
border-style: solid;
|
|
210
215
|
border-color: inherit;
|
|
211
|
-
|
|
216
|
+
height: auto;
|
|
217
|
+
align-self: stretch;
|
|
218
|
+
|
|
219
|
+
&-horizontal {
|
|
220
|
+
margin-inline: $kendo-input-md-padding-y;
|
|
221
|
+
border-width: 1px 0 0;
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
&-vertical {
|
|
225
|
+
margin-block: $kendo-input-md-padding-y;
|
|
226
|
+
border-width: 0 0 0 1px;
|
|
227
|
+
}
|
|
212
228
|
}
|
|
213
229
|
|
|
214
230
|
|
|
215
231
|
// Input with icon styles
|
|
216
232
|
.k-input-icon,
|
|
217
233
|
.k-input-validation-icon,
|
|
218
|
-
.k-input-loading-icon
|
|
219
|
-
.k-input-prefix > .k-icon,
|
|
220
|
-
.k-input-suffix > .k-icon {
|
|
234
|
+
.k-input-loading-icon {
|
|
221
235
|
flex: none;
|
|
222
236
|
align-self: center;
|
|
223
237
|
display: inline-flex;
|
|
@@ -435,12 +449,24 @@
|
|
|
435
449
|
.k-input-loading-icon,
|
|
436
450
|
.k-clear-value,
|
|
437
451
|
.k-input-prefix > .k-icon,
|
|
438
|
-
.k-input-
|
|
452
|
+
.k-input-prefix > .k-input-prefix-text,
|
|
453
|
+
.k-input-suffix > .k-icon,
|
|
454
|
+
.k-input-suffix > .k-input-suffix-text {
|
|
439
455
|
padding-block: $_padding-y;
|
|
440
456
|
padding-inline: $_padding-y;
|
|
441
457
|
box-sizing: content-box;
|
|
442
458
|
}
|
|
443
459
|
|
|
460
|
+
.k-input-separator {
|
|
461
|
+
&-horizontal {
|
|
462
|
+
margin-inline: $_padding-y;
|
|
463
|
+
}
|
|
464
|
+
|
|
465
|
+
&-vertical {
|
|
466
|
+
margin-block: $_padding-y;
|
|
467
|
+
}
|
|
468
|
+
}
|
|
469
|
+
|
|
444
470
|
&.k-icon-picker .k-input-inner {
|
|
445
471
|
width: calc( #{ $_line-height * 1em } );
|
|
446
472
|
height: calc( #{ $_line-height * 1em } );
|
package/scss/input/_theme.scss
CHANGED
|
@@ -70,6 +70,37 @@
|
|
|
70
70
|
}
|
|
71
71
|
}
|
|
72
72
|
|
|
73
|
+
// Valid
|
|
74
|
+
&.k-valid,
|
|
75
|
+
&.ng-valid.ng-touched,
|
|
76
|
+
&.ng-valid.ng-dirty {
|
|
77
|
+
@include fill( $border: $kendo-input-valid-border );
|
|
78
|
+
|
|
79
|
+
.k-input-validation-icon {
|
|
80
|
+
color: $kendo-valid-text;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
&:focus,
|
|
84
|
+
&.k-focus {
|
|
85
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
86
|
+
}
|
|
87
|
+
&:focus-within {
|
|
88
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
// Prefix & Suffix
|
|
93
|
+
.k-input-prefix {
|
|
94
|
+
color: $kendo-input-prefix-text;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.k-input-suffix {
|
|
98
|
+
color: $kendo-input-suffix-text;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.k-input-separator {
|
|
102
|
+
border-color: $kendo-input-separator-text;
|
|
103
|
+
}
|
|
73
104
|
}
|
|
74
105
|
|
|
75
106
|
|
|
@@ -146,6 +177,25 @@
|
|
|
146
177
|
@include focus-indicator( $kendo-input-invalid-shadow );
|
|
147
178
|
}
|
|
148
179
|
}
|
|
180
|
+
|
|
181
|
+
// Valid
|
|
182
|
+
&.k-valid,
|
|
183
|
+
&.ng-valid.ng-touched,
|
|
184
|
+
&.ng-valid.ng-dirty {
|
|
185
|
+
@include fill( $border: $kendo-input-valid-border );
|
|
186
|
+
|
|
187
|
+
.k-input-validation-icon {
|
|
188
|
+
color: $kendo-valid-text;
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
&:focus,
|
|
192
|
+
&.k-focus {
|
|
193
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
194
|
+
}
|
|
195
|
+
&:focus-within {
|
|
196
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
197
|
+
}
|
|
198
|
+
}
|
|
149
199
|
}
|
|
150
200
|
|
|
151
201
|
|
|
@@ -231,6 +281,37 @@
|
|
|
231
281
|
}
|
|
232
282
|
}
|
|
233
283
|
|
|
284
|
+
// Valid
|
|
285
|
+
&.k-valid,
|
|
286
|
+
&.ng-valid.ng-touched,
|
|
287
|
+
&.ng-valid.ng-dirty {
|
|
288
|
+
@include fill( $border: $kendo-input-valid-border );
|
|
289
|
+
|
|
290
|
+
.k-input-validation-icon {
|
|
291
|
+
color: $kendo-valid-text;
|
|
292
|
+
}
|
|
293
|
+
|
|
294
|
+
&:focus,
|
|
295
|
+
&.k-focus {
|
|
296
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
297
|
+
}
|
|
298
|
+
&:focus-within {
|
|
299
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
300
|
+
}
|
|
301
|
+
}
|
|
302
|
+
|
|
303
|
+
// Prefix & Suffix
|
|
304
|
+
.k-input-prefix {
|
|
305
|
+
color: $kendo-input-prefix-text;
|
|
306
|
+
}
|
|
307
|
+
|
|
308
|
+
.k-input-suffix {
|
|
309
|
+
color: $kendo-input-suffix-text;
|
|
310
|
+
}
|
|
311
|
+
|
|
312
|
+
.k-input-separator {
|
|
313
|
+
border-color: $kendo-input-separator-text;
|
|
314
|
+
}
|
|
234
315
|
}
|
|
235
316
|
|
|
236
317
|
|
|
@@ -313,6 +394,25 @@
|
|
|
313
394
|
@include focus-indicator( $kendo-input-invalid-shadow );
|
|
314
395
|
}
|
|
315
396
|
}
|
|
397
|
+
|
|
398
|
+
// Valid
|
|
399
|
+
&.k-valid,
|
|
400
|
+
&.ng-valid.ng-touched,
|
|
401
|
+
&.ng-valid.ng-dirty {
|
|
402
|
+
@include fill( $border: $kendo-input-valid-border );
|
|
403
|
+
|
|
404
|
+
.k-input-validation-icon {
|
|
405
|
+
color: $kendo-valid-text;
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
&:focus,
|
|
409
|
+
&.k-focus {
|
|
410
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
411
|
+
}
|
|
412
|
+
&:focus-within {
|
|
413
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
414
|
+
}
|
|
415
|
+
}
|
|
316
416
|
}
|
|
317
417
|
|
|
318
418
|
|
|
@@ -384,6 +484,38 @@
|
|
|
384
484
|
@include focus-indicator( $kendo-input-invalid-shadow );
|
|
385
485
|
}
|
|
386
486
|
}
|
|
487
|
+
|
|
488
|
+
// Valid
|
|
489
|
+
&.k-valid,
|
|
490
|
+
&.ng-valid.ng-touched,
|
|
491
|
+
&.ng-valid.ng-dirty {
|
|
492
|
+
@include fill( $border: $kendo-input-valid-border );
|
|
493
|
+
|
|
494
|
+
.k-input-validation-icon {
|
|
495
|
+
color: $kendo-valid-text;
|
|
496
|
+
}
|
|
497
|
+
|
|
498
|
+
&:focus,
|
|
499
|
+
&.k-focus {
|
|
500
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
501
|
+
}
|
|
502
|
+
&:focus-within {
|
|
503
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
504
|
+
}
|
|
505
|
+
}
|
|
506
|
+
|
|
507
|
+
// Prefix & Suffix
|
|
508
|
+
.k-input-prefix {
|
|
509
|
+
color: $kendo-input-prefix-text;
|
|
510
|
+
}
|
|
511
|
+
|
|
512
|
+
.k-input-suffix {
|
|
513
|
+
color: $kendo-input-suffix-text;
|
|
514
|
+
}
|
|
515
|
+
|
|
516
|
+
.k-input-separator {
|
|
517
|
+
border-color: $kendo-input-separator-text;
|
|
518
|
+
}
|
|
387
519
|
}
|
|
388
520
|
|
|
389
521
|
|
|
@@ -466,6 +598,25 @@
|
|
|
466
598
|
@include focus-indicator( $kendo-input-invalid-shadow );
|
|
467
599
|
}
|
|
468
600
|
}
|
|
601
|
+
|
|
602
|
+
// Valid
|
|
603
|
+
&.k-valid,
|
|
604
|
+
&.ng-valid.ng-touched,
|
|
605
|
+
&.ng-valid.ng-dirty {
|
|
606
|
+
@include fill( $border: $kendo-input-valid-border );
|
|
607
|
+
|
|
608
|
+
.k-input-validation-icon {
|
|
609
|
+
color: $kendo-valid-text;
|
|
610
|
+
}
|
|
611
|
+
|
|
612
|
+
&:focus,
|
|
613
|
+
&.k-focus {
|
|
614
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
615
|
+
}
|
|
616
|
+
&:focus-within {
|
|
617
|
+
@include focus-indicator( $kendo-input-valid-shadow );
|
|
618
|
+
}
|
|
619
|
+
}
|
|
469
620
|
}
|
|
470
621
|
|
|
471
622
|
}
|
|
@@ -267,11 +267,25 @@ $kendo-input-spinner-icon-offset: null !default;
|
|
|
267
267
|
|
|
268
268
|
/// The color of the Input separator.
|
|
269
269
|
/// @group input
|
|
270
|
-
$kendo-input-separator-
|
|
270
|
+
$kendo-input-separator-text: $kendo-input-border !default;
|
|
271
271
|
/// The opacity of the Input separator.
|
|
272
272
|
/// @group input
|
|
273
273
|
$kendo-input-separator-opacity: .5 !default;
|
|
274
274
|
|
|
275
|
+
/// The text color of the Input prefix.
|
|
276
|
+
/// @group input
|
|
277
|
+
$kendo-input-prefix-text: $kendo-subtle-text !default;
|
|
278
|
+
/// The text color of the Input suffix.
|
|
279
|
+
/// @group input
|
|
280
|
+
$kendo-input-suffix-text: $kendo-subtle-text !default;
|
|
281
|
+
|
|
282
|
+
/// The text color of the Input prefix.
|
|
283
|
+
/// @group input
|
|
284
|
+
$kendo-input-prefix-text: $kendo-subtle-text !default;
|
|
285
|
+
/// The text color of the Input suffix.
|
|
286
|
+
/// @group input
|
|
287
|
+
$kendo-input-suffix-text: $kendo-subtle-text !default;
|
|
288
|
+
|
|
275
289
|
/// The border color of the invalid Input components.
|
|
276
290
|
/// @group input
|
|
277
291
|
$kendo-input-invalid-border: $kendo-invalid-border !default;
|
|
@@ -279,6 +293,13 @@ $kendo-input-invalid-border: $kendo-invalid-border !default;
|
|
|
279
293
|
/// @group input
|
|
280
294
|
$kendo-input-invalid-shadow: $kendo-invalid-shadow !default;
|
|
281
295
|
|
|
296
|
+
/// The border color of the valid Input components.
|
|
297
|
+
/// @group input
|
|
298
|
+
$kendo-input-valid-border: $kendo-valid-border !default;
|
|
299
|
+
/// The shadow of the valid Input components.
|
|
300
|
+
/// @group input
|
|
301
|
+
$kendo-input-valid-shadow: $kendo-valid-shadow !default;
|
|
302
|
+
|
|
282
303
|
/// The background color of the Picker components.
|
|
283
304
|
/// @group picker
|
|
284
305
|
$kendo-picker-bg: $kendo-button-bg !default;
|