@progress/kendo-theme-material 5.2.0 → 5.2.1-dev.2
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 +92 -3
- package/dist/all.scss +44 -9
- 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 +3 -3
- package/scss/_variables.scss +4 -1
- package/scss/chip/_theme.scss +19 -1
- package/scss/chip/_variables.scss +1 -1
package/dist/all.css
CHANGED
|
@@ -995,15 +995,17 @@ kendo-sortable {
|
|
|
995
995
|
text-indent: -4000px;
|
|
996
996
|
text-align: center;
|
|
997
997
|
position: absolute;
|
|
998
|
+
color: currentColor;
|
|
998
999
|
}
|
|
999
1000
|
|
|
1000
1001
|
.k-loading-image {
|
|
1001
1002
|
z-index: 2;
|
|
1003
|
+
color: currentColor;
|
|
1002
1004
|
}
|
|
1003
1005
|
|
|
1004
1006
|
.k-loading-color {
|
|
1005
1007
|
background-color: white;
|
|
1006
|
-
opacity: .3;
|
|
1008
|
+
opacity: 0.3;
|
|
1007
1009
|
}
|
|
1008
1010
|
|
|
1009
1011
|
.k-i-loading {
|
|
@@ -13723,6 +13725,38 @@ kendo-badge-container {
|
|
|
13723
13725
|
margin: 0;
|
|
13724
13726
|
}
|
|
13725
13727
|
|
|
13728
|
+
.k-input:disabled, .k-input[disabled], .k-input.k-disabled,
|
|
13729
|
+
.k-picker:disabled,
|
|
13730
|
+
.k-picker[disabled],
|
|
13731
|
+
.k-picker.k-disabled {
|
|
13732
|
+
outline: none;
|
|
13733
|
+
cursor: default;
|
|
13734
|
+
opacity: 0.6;
|
|
13735
|
+
filter: grayscale(0.1);
|
|
13736
|
+
pointer-events: none;
|
|
13737
|
+
box-shadow: none;
|
|
13738
|
+
}
|
|
13739
|
+
|
|
13740
|
+
.k-input:disabled [disabled],
|
|
13741
|
+
.k-input:disabled .k-disabled,
|
|
13742
|
+
.k-input:disabled .k-state-disabled, .k-input[disabled] [disabled],
|
|
13743
|
+
.k-input[disabled] .k-disabled,
|
|
13744
|
+
.k-input[disabled] .k-state-disabled, .k-input.k-disabled [disabled],
|
|
13745
|
+
.k-input.k-disabled .k-disabled,
|
|
13746
|
+
.k-input.k-disabled .k-state-disabled,
|
|
13747
|
+
.k-picker:disabled [disabled],
|
|
13748
|
+
.k-picker:disabled .k-disabled,
|
|
13749
|
+
.k-picker:disabled .k-state-disabled,
|
|
13750
|
+
.k-picker[disabled] [disabled],
|
|
13751
|
+
.k-picker[disabled] .k-disabled,
|
|
13752
|
+
.k-picker[disabled] .k-state-disabled,
|
|
13753
|
+
.k-picker.k-disabled [disabled],
|
|
13754
|
+
.k-picker.k-disabled .k-disabled,
|
|
13755
|
+
.k-picker.k-disabled .k-state-disabled {
|
|
13756
|
+
opacity: 1;
|
|
13757
|
+
filter: grayscale(0);
|
|
13758
|
+
}
|
|
13759
|
+
|
|
13726
13760
|
input.k-input {
|
|
13727
13761
|
padding: 8px 16px;
|
|
13728
13762
|
}
|
|
@@ -15173,7 +15207,7 @@ textarea.k-input-inner {
|
|
|
15173
15207
|
.k-chip-solid-base {
|
|
15174
15208
|
border-color: rgba(192, 192, 192, 0.961);
|
|
15175
15209
|
color: rgba(0, 0, 0, 0.87);
|
|
15176
|
-
background-color: rgba(
|
|
15210
|
+
background-color: rgba(235, 235, 235, 0.987);
|
|
15177
15211
|
}
|
|
15178
15212
|
|
|
15179
15213
|
.k-chip-solid-base:focus, .k-chip-solid-base.k-focus {
|
|
@@ -15364,28 +15398,83 @@ textarea.k-input-inner {
|
|
|
15364
15398
|
border-color: transparent;
|
|
15365
15399
|
}
|
|
15366
15400
|
|
|
15401
|
+
.k-chip-solid-base:hover, .k-chip-solid-base.k-hover {
|
|
15402
|
+
color: rgba(0, 0, 0, 0.87);
|
|
15403
|
+
background-color: rgba(0, 0, 0, 0.16);
|
|
15404
|
+
}
|
|
15405
|
+
|
|
15367
15406
|
.k-chip-solid-base:focus, .k-chip-solid-base.k-focus {
|
|
15368
15407
|
box-shadow: none;
|
|
15408
|
+
color: rgba(0, 0, 0, 0.87);
|
|
15409
|
+
background-color: rgba(0, 0, 0, 0.24);
|
|
15410
|
+
}
|
|
15411
|
+
|
|
15412
|
+
.k-chip-solid-base.k-selected {
|
|
15413
|
+
color: rgba(0, 0, 0, 0.87);
|
|
15369
15414
|
background-color: rgba(0, 0, 0, 0.24);
|
|
15370
15415
|
}
|
|
15371
15416
|
|
|
15417
|
+
.k-chip-solid-error:hover, .k-chip-solid-error.k-hover {
|
|
15418
|
+
color: #f31700;
|
|
15419
|
+
background-color: rgba(243, 23, 0, 0.16);
|
|
15420
|
+
}
|
|
15421
|
+
|
|
15372
15422
|
.k-chip-solid-error:focus, .k-chip-solid-error.k-focus {
|
|
15373
15423
|
box-shadow: none;
|
|
15424
|
+
color: #f31700;
|
|
15374
15425
|
background-color: rgba(243, 23, 0, 0.24);
|
|
15375
15426
|
}
|
|
15376
15427
|
|
|
15428
|
+
.k-chip-solid-error.k-selected {
|
|
15429
|
+
color: #f31700;
|
|
15430
|
+
background-color: rgba(243, 23, 0, 0.24);
|
|
15431
|
+
}
|
|
15432
|
+
|
|
15433
|
+
.k-chip-solid-info:hover, .k-chip-solid-info.k-hover {
|
|
15434
|
+
color: #0058e9;
|
|
15435
|
+
background-color: rgba(0, 88, 233, 0.16);
|
|
15436
|
+
}
|
|
15437
|
+
|
|
15377
15438
|
.k-chip-solid-info:focus, .k-chip-solid-info.k-focus {
|
|
15378
15439
|
box-shadow: none;
|
|
15440
|
+
color: #0058e9;
|
|
15379
15441
|
background-color: rgba(0, 88, 233, 0.24);
|
|
15380
15442
|
}
|
|
15381
15443
|
|
|
15444
|
+
.k-chip-solid-info.k-selected {
|
|
15445
|
+
color: #0058e9;
|
|
15446
|
+
background-color: rgba(0, 88, 233, 0.24);
|
|
15447
|
+
}
|
|
15448
|
+
|
|
15449
|
+
.k-chip-solid-warning:hover, .k-chip-solid-warning.k-hover {
|
|
15450
|
+
color: #ffc000;
|
|
15451
|
+
background-color: rgba(255, 192, 0, 0.16);
|
|
15452
|
+
}
|
|
15453
|
+
|
|
15382
15454
|
.k-chip-solid-warning:focus, .k-chip-solid-warning.k-focus {
|
|
15383
15455
|
box-shadow: none;
|
|
15456
|
+
color: #ffc000;
|
|
15384
15457
|
background-color: rgba(255, 192, 0, 0.24);
|
|
15385
15458
|
}
|
|
15386
15459
|
|
|
15460
|
+
.k-chip-solid-warning.k-selected {
|
|
15461
|
+
color: #ffc000;
|
|
15462
|
+
background-color: rgba(255, 192, 0, 0.24);
|
|
15463
|
+
}
|
|
15464
|
+
|
|
15465
|
+
.k-chip-solid-success:hover, .k-chip-solid-success.k-hover {
|
|
15466
|
+
color: #37b400;
|
|
15467
|
+
background-color: rgba(55, 180, 0, 0.16);
|
|
15468
|
+
}
|
|
15469
|
+
|
|
15387
15470
|
.k-chip-solid-success:focus, .k-chip-solid-success.k-focus {
|
|
15388
15471
|
box-shadow: none;
|
|
15472
|
+
color: #37b400;
|
|
15473
|
+
background-color: rgba(55, 180, 0, 0.24);
|
|
15474
|
+
}
|
|
15475
|
+
|
|
15476
|
+
.k-chip-solid-success.k-selected {
|
|
15477
|
+
color: #37b400;
|
|
15389
15478
|
background-color: rgba(55, 180, 0, 0.24);
|
|
15390
15479
|
}
|
|
15391
15480
|
|
|
@@ -20628,7 +20717,7 @@ kendo-label > .k-label {
|
|
|
20628
20717
|
}
|
|
20629
20718
|
|
|
20630
20719
|
.k-popup-dropdowntree .k-check-all {
|
|
20631
|
-
padding: 8px 8px;
|
|
20720
|
+
padding: 8px 8px 0;
|
|
20632
20721
|
}
|
|
20633
20722
|
|
|
20634
20723
|
.k-popup-dropdowntree .k-treeview {
|
package/dist/all.scss
CHANGED
|
@@ -2132,7 +2132,10 @@ $placeholder-bg: rgba(0, 0, 0, .1) !default;
|
|
|
2132
2132
|
|
|
2133
2133
|
|
|
2134
2134
|
// Loading
|
|
2135
|
-
|
|
2135
|
+
$loading-bg: $component-bg !default;
|
|
2136
|
+
$loading-text: currentColor !default;
|
|
2137
|
+
$loading-opacity: .3 !default;
|
|
2138
|
+
$zindex-loading: 100 !default;
|
|
2136
2139
|
|
|
2137
2140
|
// Table
|
|
2138
2141
|
|
|
@@ -3589,7 +3592,7 @@ $display4-letter-spacing: null !default;
|
|
|
3589
3592
|
}
|
|
3590
3593
|
|
|
3591
3594
|
.k-loading-mask {
|
|
3592
|
-
z-index:
|
|
3595
|
+
z-index: $zindex-loading;
|
|
3593
3596
|
|
|
3594
3597
|
&.k-opaque {
|
|
3595
3598
|
.k-loading-color {
|
|
@@ -3601,13 +3604,15 @@ $display4-letter-spacing: null !default;
|
|
|
3601
3604
|
text-indent: -4000px;
|
|
3602
3605
|
text-align: center;
|
|
3603
3606
|
position: absolute;
|
|
3607
|
+
color: $loading-text;
|
|
3604
3608
|
}
|
|
3605
3609
|
.k-loading-image {
|
|
3606
3610
|
z-index: 2;
|
|
3611
|
+
color: $loading-text;
|
|
3607
3612
|
}
|
|
3608
3613
|
.k-loading-color {
|
|
3609
|
-
background-color: $
|
|
3610
|
-
opacity:
|
|
3614
|
+
background-color: $loading-bg;
|
|
3615
|
+
opacity: $loading-opacity;
|
|
3611
3616
|
}
|
|
3612
3617
|
|
|
3613
3618
|
// Loading indicator
|
|
@@ -3615,7 +3620,7 @@ $display4-letter-spacing: null !default;
|
|
|
3615
3620
|
position: relative;
|
|
3616
3621
|
background-color: transparent;
|
|
3617
3622
|
box-sizing: border-box;
|
|
3618
|
-
color:
|
|
3623
|
+
color: $loading-text;
|
|
3619
3624
|
|
|
3620
3625
|
&::before,
|
|
3621
3626
|
&::after {
|
|
@@ -10217,8 +10222,20 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
|
|
|
10217
10222
|
& > * {
|
|
10218
10223
|
margin: 0;
|
|
10219
10224
|
}
|
|
10220
|
-
}
|
|
10221
10225
|
|
|
10226
|
+
&:disabled,
|
|
10227
|
+
&[disabled],
|
|
10228
|
+
&.k-disabled {
|
|
10229
|
+
@include disabled( $disabled-styling );
|
|
10230
|
+
|
|
10231
|
+
[disabled],
|
|
10232
|
+
.k-disabled,
|
|
10233
|
+
.k-state-disabled {
|
|
10234
|
+
opacity: 1;
|
|
10235
|
+
filter: grayscale(0);
|
|
10236
|
+
}
|
|
10237
|
+
}
|
|
10238
|
+
}
|
|
10222
10239
|
|
|
10223
10240
|
// Input
|
|
10224
10241
|
.k-input {}
|
|
@@ -12291,7 +12308,7 @@ $kendo-chip-theme-colors: (
|
|
|
12291
12308
|
|
|
12292
12309
|
/// The base background color of solid chip.
|
|
12293
12310
|
/// @group chip
|
|
12294
|
-
$kendo-chip-solid-bg: try-tint( $kendo-chip-base-bg,
|
|
12311
|
+
$kendo-chip-solid-bg: try-tint( $kendo-chip-base-bg, 90% ) !default;
|
|
12295
12312
|
/// The base text color of solid chip.
|
|
12296
12313
|
/// @group chip
|
|
12297
12314
|
$kendo-chip-solid-text: $kendo-chip-base-bg !default;
|
|
@@ -12666,10 +12683,28 @@ $kendo-chip-list-sizes: (
|
|
|
12666
12683
|
}
|
|
12667
12684
|
@each $name, $color in $kendo-chip-theme-colors {
|
|
12668
12685
|
.k-chip-solid-#{$name} {
|
|
12686
|
+
&:hover,
|
|
12687
|
+
&.k-hover {
|
|
12688
|
+
@include fill(
|
|
12689
|
+
$bg: rgba($color, .16 ),
|
|
12690
|
+
$color: $color
|
|
12691
|
+
);
|
|
12692
|
+
}
|
|
12693
|
+
|
|
12669
12694
|
&:focus,
|
|
12670
12695
|
&.k-focus {
|
|
12671
12696
|
@include box-shadow( none );
|
|
12672
|
-
@include fill(
|
|
12697
|
+
@include fill(
|
|
12698
|
+
$bg: rgba($color, .24),
|
|
12699
|
+
$color: $color
|
|
12700
|
+
);
|
|
12701
|
+
}
|
|
12702
|
+
|
|
12703
|
+
&.k-selected {
|
|
12704
|
+
@include fill(
|
|
12705
|
+
$bg: rgba( $color, .24 ),
|
|
12706
|
+
$color: $color
|
|
12707
|
+
);
|
|
12673
12708
|
}
|
|
12674
12709
|
}
|
|
12675
12710
|
}
|
|
@@ -21341,7 +21376,7 @@ $dropdowntree-popup-padding-y: map-get( $spacing, 2 ) !default;
|
|
|
21341
21376
|
padding: 0;
|
|
21342
21377
|
|
|
21343
21378
|
.k-check-all {
|
|
21344
|
-
padding: $dropdowntree-popup-padding-y $dropdowntree-popup-padding-x;
|
|
21379
|
+
padding: $dropdowntree-popup-padding-y $dropdowntree-popup-padding-x 0;
|
|
21345
21380
|
}
|
|
21346
21381
|
|
|
21347
21382
|
.k-treeview {
|
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": "5.2.
|
|
4
|
+
"version": "5.2.1-dev.2",
|
|
5
5
|
"author": "Progress",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"keywords": [
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"postpublish": "echo 'no postpublish for material theme'"
|
|
51
51
|
},
|
|
52
52
|
"dependencies": {
|
|
53
|
-
"@progress/kendo-theme-default": "^5.2.
|
|
53
|
+
"@progress/kendo-theme-default": "^5.2.1-dev.2"
|
|
54
54
|
},
|
|
55
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "e446301962e9eba01d9e3c1920b77c5349ce68cf"
|
|
56
56
|
}
|
package/scss/_variables.scss
CHANGED
|
@@ -393,7 +393,10 @@ $placeholder-bg: rgba(0, 0, 0, .1) !default;
|
|
|
393
393
|
|
|
394
394
|
|
|
395
395
|
// Loading
|
|
396
|
-
|
|
396
|
+
$loading-bg: $component-bg !default;
|
|
397
|
+
$loading-text: currentColor !default;
|
|
398
|
+
$loading-opacity: .3 !default;
|
|
399
|
+
$zindex-loading: 100 !default;
|
|
397
400
|
|
|
398
401
|
// Table
|
|
399
402
|
|
package/scss/chip/_theme.scss
CHANGED
|
@@ -8,10 +8,28 @@
|
|
|
8
8
|
}
|
|
9
9
|
@each $name, $color in $kendo-chip-theme-colors {
|
|
10
10
|
.k-chip-solid-#{$name} {
|
|
11
|
+
&:hover,
|
|
12
|
+
&.k-hover {
|
|
13
|
+
@include fill(
|
|
14
|
+
$bg: rgba($color, .16 ),
|
|
15
|
+
$color: $color
|
|
16
|
+
);
|
|
17
|
+
}
|
|
18
|
+
|
|
11
19
|
&:focus,
|
|
12
20
|
&.k-focus {
|
|
13
21
|
@include box-shadow( none );
|
|
14
|
-
@include fill(
|
|
22
|
+
@include fill(
|
|
23
|
+
$bg: rgba($color, .24),
|
|
24
|
+
$color: $color
|
|
25
|
+
);
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
&.k-selected {
|
|
29
|
+
@include fill(
|
|
30
|
+
$bg: rgba( $color, .24 ),
|
|
31
|
+
$color: $color
|
|
32
|
+
);
|
|
15
33
|
}
|
|
16
34
|
}
|
|
17
35
|
}
|
|
@@ -74,7 +74,7 @@ $kendo-chip-theme-colors: (
|
|
|
74
74
|
|
|
75
75
|
/// The base background color of solid chip.
|
|
76
76
|
/// @group chip
|
|
77
|
-
$kendo-chip-solid-bg: try-tint( $kendo-chip-base-bg,
|
|
77
|
+
$kendo-chip-solid-bg: try-tint( $kendo-chip-base-bg, 90% ) !default;
|
|
78
78
|
/// The base text color of solid chip.
|
|
79
79
|
/// @group chip
|
|
80
80
|
$kendo-chip-solid-text: $kendo-chip-base-bg !default;
|