@progress/kendo-theme-classic 5.6.1-dev.7 → 5.8.1-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.
package/dist/all.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  // This file is auto-generated. Do not edit!
2
- // baka:source undefinedpackages/classic/scss/all.scss
2
+ // baka:source packages/classic/scss/all.scss
3
3
 
4
4
  // #region @import "index.scss"; -> packages/classic/scss/index.scss
5
5
  // #region @import "core/_index.scss"; -> packages/classic/scss/core/_index.scss
@@ -1486,7 +1486,7 @@ $line-height-xs: 1 !default;
1486
1486
  $line-height-sm: 1.25 !default;
1487
1487
  $line-height-md: $line-height !default;
1488
1488
  $line-height-lg: 1.5 !default;
1489
- $line-height-em: $line-height * 1em !default;
1489
+ $line-height-em: calc( #{$line-height} * 1em ) !default;
1490
1490
 
1491
1491
 
1492
1492
  // Font weight
@@ -1719,7 +1719,6 @@ $display4-letter-spacing: null !default;
1719
1719
  @include exports( "common/disabled" ) {
1720
1720
 
1721
1721
  // Disabled state
1722
- .k-state-disabled,
1723
1722
  .k-disabled,
1724
1723
  .k-widget[disabled],
1725
1724
  .k-disabled {
@@ -1734,8 +1733,7 @@ $display4-letter-spacing: null !default;
1734
1733
 
1735
1734
  // Nested disabled
1736
1735
  [disabled],
1737
- .k-disabled,
1738
- .k-state-disabled {
1736
+ .k-disabled {
1739
1737
  opacity: 1;
1740
1738
  filter: grayscale(0);
1741
1739
  }
@@ -4513,18 +4511,28 @@ $utils-border-radius: (
4513
4511
  @include exports( "common/decoration/color" ) {
4514
4512
 
4515
4513
  // sass-lint:disable-block no-important
4514
+ // sass-lint:disable-block class-name-format
4516
4515
  // stylelint-disable block-opening-brace-space-before
4517
4516
 
4518
4517
  .k-text-base,
4519
4518
  .k-color-base {
4520
4519
  color: $base-text;
4521
4520
  }
4521
+ .\!k-text-base,
4522
+ .\!k-color-base {
4523
+ color: $base-text !important;
4524
+ }
4522
4525
 
4523
4526
  .k-color-inherit { color: inherit; }
4527
+ .\!k-color-inherit { color: inherit !important; }
4524
4528
 
4525
4529
  @each $name, $color in $kendo-theme-colors {
4526
4530
  .k-text-#{$name},
4527
4531
  .k-color-#{$name} {
4532
+ color: $color;
4533
+ }
4534
+ .\!k-text-#{$name},
4535
+ .\!k-color-#{$name} {
4528
4536
  color: $color !important;
4529
4537
  }
4530
4538
  }
@@ -4535,63 +4543,19 @@ $utils-border-radius: (
4535
4543
  @include exports( "common/decoration/background" ) {
4536
4544
 
4537
4545
  // sass-lint:disable-block no-important
4546
+ // sass-lint:disable-block class-name-format
4538
4547
 
4539
4548
  @each $name, $bg-color in $kendo-theme-colors {
4540
4549
  .k-bg-#{$name} {
4550
+ background-color: $bg-color;
4551
+ }
4552
+ .\!k-bg-#{$name} {
4541
4553
  background-color: $bg-color !important;
4542
4554
  }
4543
4555
  }
4544
4556
 
4545
4557
  }
4546
4558
 
4547
-
4548
- @mixin variant( $base ) {
4549
- background-color: tint($base, 10);
4550
- color: shade($base, 6);
4551
- border-color: tint($base, 9);
4552
- }
4553
-
4554
- @include exports( "common/decoration/variant" ) {
4555
-
4556
- @each $name, $variant in $kendo-theme-colors {
4557
- .k-state-#{$name} {
4558
- @include variant( $variant );
4559
- }
4560
- }
4561
- }
4562
-
4563
-
4564
- @include exports( "common/decoration/legacy" ) {
4565
-
4566
- .k-info-colored {
4567
- color: #50607f;
4568
- border-color: #d0d9df;
4569
- background-color: #f0f9ff;
4570
- }
4571
-
4572
- .k-success-colored {
4573
- color: #507f50;
4574
- border-color: #d0dfd0;
4575
- background-color: #f0fff0;
4576
- }
4577
-
4578
- .k-error-colored {
4579
- color: #7f5050;
4580
- border-color: #dfd0d0;
4581
- background-color: #fff0f0;
4582
- }
4583
-
4584
- .k-shadow {
4585
- // Shadow moved to popup/_layout.scss due to variable flow
4586
- // box-shadow: $popup-shadow;
4587
- }
4588
-
4589
- .k-inset {
4590
- box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .03), inset 0 4px 5px 0 rgba(0, 0, 0, .04);
4591
- }
4592
-
4593
- }
4594
-
4595
4559
  // #endregion
4596
4560
 
4597
4561
  // #endregion
@@ -9178,8 +9142,7 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
9178
9142
  @include disabled( $disabled-styling );
9179
9143
 
9180
9144
  [disabled] &,
9181
- .k-disabled &,
9182
- .k-state-disabled & {
9145
+ .k-disabled & {
9183
9146
  opacity: 1;
9184
9147
  filter: grayscale(0);
9185
9148
  }
@@ -9200,8 +9163,7 @@ $kendo-input-invalid-shadow: $invalid-shadow !default;
9200
9163
  @include disabled( $disabled-styling );
9201
9164
 
9202
9165
  [disabled] &,
9203
- .k-disabled &,
9204
- .k-state-disabled & {
9166
+ .k-disabled & {
9205
9167
  opacity: 1;
9206
9168
  filter: grayscale(0);
9207
9169
  }
@@ -10122,7 +10084,6 @@ $floating-label-focus-text: null !default;
10122
10084
  width: auto;
10123
10085
  }
10124
10086
 
10125
- &.k-state-empty,
10126
10087
  &.k-empty {
10127
10088
  > .k-label {
10128
10089
  top: $floating-label-offset-y;
@@ -10133,8 +10094,6 @@ $floating-label-focus-text: null !default;
10133
10094
  }
10134
10095
 
10135
10096
  > .k-label,
10136
- // &:focus-within > .k-label,
10137
- &.k-state-focused > .k-label,
10138
10097
  &.k-focus > .k-label {
10139
10098
  top: $floating-label-focus-offset-y;
10140
10099
  left: $floating-label-focus-offset-x;
@@ -10146,7 +10105,6 @@ $floating-label-focus-text: null !default;
10146
10105
  transform: scale( $floating-label-focus-scale );
10147
10106
  }
10148
10107
 
10149
- &.k-state-empty:not(.k-state-focused) ::placeholder,
10150
10108
  &.k-empty:not(.k-focus):not(:focus-within) ::placeholder {
10151
10109
  color: transparent;
10152
10110
  }
@@ -10160,7 +10118,6 @@ $floating-label-focus-text: null !default;
10160
10118
  transition: transform $floating-label-transition, color $floating-label-transition, top $floating-label-transition, right $floating-label-transition;
10161
10119
  }
10162
10120
 
10163
- &.k-state-empty,
10164
10121
  &.k-empty {
10165
10122
  > .k-label {
10166
10123
  left: auto;
@@ -10169,8 +10126,6 @@ $floating-label-focus-text: null !default;
10169
10126
  }
10170
10127
 
10171
10128
  > .k-label,
10172
- // &:focus-within > .k-label,
10173
- &.k-state-focused > .k-label,
10174
10129
  &.k-focus > .k-label {
10175
10130
  left: auto;
10176
10131
  right: $floating-label-focus-offset-x;
@@ -10201,8 +10156,7 @@ $floating-label-focus-text: null !default;
10201
10156
  );
10202
10157
  }
10203
10158
 
10204
- &.k-focus > .k-label,
10205
- &.k-state-focused > .k-label {
10159
+ &.k-focus > .k-label {
10206
10160
  @include fill(
10207
10161
  $color: $floating-label-focus-text,
10208
10162
  $bg: $floating-label-focus-bg
@@ -12558,8 +12512,11 @@ $loader-container-font-size-lg: $font-size-lg !default;
12558
12512
  }
12559
12513
 
12560
12514
  .k-loader-container-inner {
12561
- .k-text-secondary {
12562
- color: $loader-secondary-bg !important; // sass-lint:disable-line no-important
12515
+ // sass-lint:disable-block no-important
12516
+ // sass-lint:disable-block class-name-format
12517
+ .k-text-secondary,
12518
+ .\!k-text-secondary {
12519
+ color: $loader-secondary-bg !important;
12563
12520
  }
12564
12521
  }
12565
12522
 
@@ -13883,7 +13840,7 @@ $form-spacer: $padding-x * 2 !default;
13883
13840
 
13884
13841
  $form-font-size: $font-size !default;
13885
13842
  $form-line-height: $line-height !default;
13886
- $form-line-height-em: $form-line-height * 1em !default;
13843
+ $form-line-height-em: calc( #{$form-line-height} * 1em ) !default;
13887
13844
  $form-line-height-sm: $line-height-sm !default;
13888
13845
  $form-line-height-lg: $line-height-lg !default;
13889
13846
 
@@ -15220,7 +15177,6 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15220
15177
 
15221
15178
 
15222
15179
  // Selection
15223
- > .k-state-selected,
15224
15180
  > .k-selected {
15225
15181
  border-width: 0;
15226
15182
  border-style: solid;
@@ -15291,7 +15247,6 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15291
15247
  flex-direction: row;
15292
15248
  }
15293
15249
 
15294
- > .k-state-selected,
15295
15250
  > .k-selected {
15296
15251
  width: 0;
15297
15252
  width: calc( var( --kendo-progressbar-progress, 0 ) * 1% ); // sass-lint:disable-line no-duplicate-properties
@@ -15318,7 +15273,6 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15318
15273
  // Horizontal reverse
15319
15274
  &.k-progressbar-reverse {
15320
15275
 
15321
- > .k-state-selected,
15322
15276
  > .k-selected {
15323
15277
  flex-direction: row-reverse;
15324
15278
  justify-self: flex-end;
@@ -15343,7 +15297,6 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15343
15297
  writing-mode: vertical-lr;
15344
15298
  }
15345
15299
 
15346
- > .k-state-selected,
15347
15300
  > .k-selected {
15348
15301
  height: 0;
15349
15302
  height: calc( var( --kendo-progressbar-progress, 0 ) * 1% ); // sass-lint:disable-line no-duplicate-properties
@@ -15373,7 +15326,6 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15373
15326
  &.k-progressbar-reverse {
15374
15327
  flex-direction: column;
15375
15328
 
15376
- > .k-state-selected,
15377
15329
  > .k-selected {
15378
15330
  flex-direction: column;
15379
15331
  align-self: flex-start;
@@ -15385,7 +15337,6 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15385
15337
  // Indeterminate
15386
15338
  .k-progressbar-indeterminate {
15387
15339
  .k-progress-status-wrap,
15388
- .k-state-selected,
15389
15340
  .k-selected,
15390
15341
  .k-item {
15391
15342
  display: none;
@@ -15396,9 +15347,7 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15396
15347
  // Blazor specific
15397
15348
  .telerik-blazor.k-progressbar-horizontal {
15398
15349
 
15399
- > .k-state-selected,
15400
15350
  > .k-selected,
15401
- > .k-state-selected > .k-progress-status-wrap,
15402
15351
  > .k-selected > .k-progress-status-wrap {
15403
15352
  transition: width .1s ease-in-out;
15404
15353
  }
@@ -15427,7 +15376,6 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15427
15376
  display: -ms-inline-grid;
15428
15377
 
15429
15378
  > .k-progress-status-wrap,
15430
- > .k-state-selected,
15431
15379
  > .k-selected {
15432
15380
  -ms-grid-column: 1;
15433
15381
  -ms-grid-row: 1;
@@ -15437,7 +15385,6 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15437
15385
  -ms-grid-columns: 1fr;
15438
15386
  -ms-grid-rows: $progressbar-height;
15439
15387
 
15440
- &.k-progressbar-reverse > .k-state-selected,
15441
15388
  &.k-progressbar-reverse > .k-selected {
15442
15389
  -ms-grid-column-align: end;
15443
15390
  }
@@ -15446,12 +15393,10 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15446
15393
  -ms-grid-columns: $progressbar-height;
15447
15394
  -ms-grid-rows: 1fr;
15448
15395
 
15449
- > .k-state-selected,
15450
15396
  > .k-selected {
15451
15397
  -ms-grid-row-align: end;
15452
15398
  }
15453
15399
 
15454
- &.k-progressbar-reverse > .k-state-selected,
15455
15400
  &.k-progressbar-reverse > .k-selected {
15456
15401
  -ms-grid-row-align: start;
15457
15402
  }
@@ -15517,7 +15462,6 @@ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
15517
15462
  .k-progressbar {
15518
15463
  @include fill( $progressbar-text, $progressbar-bg, $progressbar-border, $progressbar-gradient );
15519
15464
 
15520
- .k-state-selected,
15521
15465
  .k-selected {
15522
15466
  @include fill( $progressbar-fill-text, $progressbar-fill-bg, $progressbar-fill-border, $progressbar-fill-gradient );
15523
15467
  }
@@ -15900,7 +15844,6 @@ $kendo-radio-ripple-opacity: .25 !default;
15900
15844
  }
15901
15845
 
15902
15846
  .k-radio:focus,
15903
- .k-radio.k-state-focus,
15904
15847
  .k-radio.k-focus {
15905
15848
  box-shadow: none !important; // sass-lint:disable-line no-important
15906
15849
 
@@ -15964,7 +15907,6 @@ $kendo-radio-ripple-opacity: .25 !default;
15964
15907
 
15965
15908
  // Hover state
15966
15909
  .k-radio:hover,
15967
- .k-radio.k-state-hover,
15968
15910
  .k-radio.k-hover {
15969
15911
  @include fill(
15970
15912
  $kendo-radio-hover-text,
@@ -15976,7 +15918,6 @@ $kendo-radio-ripple-opacity: .25 !default;
15976
15918
 
15977
15919
  // Focus state
15978
15920
  .k-radio:focus,
15979
- .k-radio.k-state-focus,
15980
15921
  .k-radio.k-focus {
15981
15922
  @include fill( $border: $kendo-radio-focus-border );
15982
15923
  @include box-shadow( $kendo-radio-focus-shadow );
@@ -15985,13 +15926,11 @@ $kendo-radio-ripple-opacity: .25 !default;
15985
15926
 
15986
15927
  // Invalid state
15987
15928
  .k-radio.k-invalid,
15988
- .k-radio.k-state-invalid,
15989
15929
  .k-radio.ng-invalid.ng-touched,
15990
15930
  .k-radio.ng-invalid.ng-dirty {
15991
15931
  @include fill( $border: $kendo-radio-invalid-border );
15992
15932
  }
15993
15933
  .k-radio.k-invalid + .k-radio-label,
15994
- .k-radio.k-state-invalid + .k-radio-label,
15995
15934
  .k-radio.ng-invalid.ng-touched + .k-radio-label,
15996
15935
  .k-radio.ng-invalid.ng-dirty + .k-radio-label {
15997
15936
  @include fill( $color: $kendo-radio-invalid-text );
@@ -16008,7 +15947,6 @@ $kendo-radio-ripple-opacity: .25 !default;
16008
15947
  );
16009
15948
  }
16010
15949
  .k-radio:checked:focus,
16011
- .k-radio.k-checked.k-state-focus,
16012
15950
  .k-radio.k-checked.k-focus {
16013
15951
  @include fill( $border: $kendo-radio-focus-checked-border );
16014
15952
  @include box-shadow( $kendo-radio-focus-checked-shadow );
@@ -16179,7 +16117,6 @@ $slider-disabled-opacity: null !default;
16179
16117
  }
16180
16118
 
16181
16119
 
16182
- &.k-state-disabled,
16183
16120
  &.k-disabled {
16184
16121
  .k-tick,
16185
16122
  .k-slider-track,
@@ -16636,20 +16573,17 @@ $slider-disabled-opacity: null !default;
16636
16573
  }
16637
16574
 
16638
16575
  &:focus,
16639
- &.k-state-focused,
16640
16576
  &.k-focus {
16641
16577
  @include box-shadow( $slider-draghandle-focused-shadow );
16642
16578
  }
16643
16579
  }
16644
16580
 
16645
- &.k-state-focused,
16646
16581
  &.k-focus {
16647
16582
  .k-draghandle {
16648
16583
  @include box-shadow( $slider-draghandle-focused-shadow );
16649
16584
  }
16650
16585
  }
16651
16586
 
16652
- &.k-state-disabled,
16653
16587
  &.k-disabled {
16654
16588
  opacity: $slider-disabled-opacity;
16655
16589
  }
@@ -17301,7 +17235,6 @@ $kendo-calendar-sizes: (
17301
17235
  }
17302
17236
 
17303
17237
  // // styles are applied to the k-link element inside
17304
- // .k-state-selected,
17305
17238
  // .k-selected {
17306
17239
  // color: inherit;
17307
17240
  // background: transparent;
@@ -17429,10 +17362,8 @@ $kendo-calendar-sizes: (
17429
17362
 
17430
17363
  &:hover,
17431
17364
  &.k-hover,
17432
- &.k-state-hover,
17433
17365
  &:focus,
17434
- &.k-focus,
17435
- &.k-state-focus {
17366
+ &.k-focus {
17436
17367
  color: $calendar-today-nav-hover-text;
17437
17368
  }
17438
17369
  }
@@ -17453,8 +17384,7 @@ $kendo-calendar-sizes: (
17453
17384
  .k-calendar-cell-inner {
17454
17385
  box-shadow: inset 0 0 0 1px $calendar-today-color;
17455
17386
  }
17456
- &.k-focus .k-calendar-cell-inner,
17457
- &.k-state-focused .k-calendar-cell-inner {
17387
+ &.k-focus .k-calendar-cell-inner {
17458
17388
  box-shadow: inset 0 0 0 1px $calendar-today-color, $calendar-cell-focused-shadow;
17459
17389
  }
17460
17390
  } @else if $calendar-today-style == color {
@@ -17488,8 +17418,7 @@ $kendo-calendar-sizes: (
17488
17418
 
17489
17419
  // Interactive states
17490
17420
  .k-calendar-td:hover .k-calendar-cell-inner,
17491
- .k-calendar-td.k-hover .k-calendar-cell-inner,
17492
- .k-calendar-td.k-state-hover .k-calendar-cell-inner {
17421
+ .k-calendar-td.k-hover .k-calendar-cell-inner {
17493
17422
  @include fill(
17494
17423
  $calendar-cell-hover-text,
17495
17424
  $calendar-cell-hover-bg,
@@ -17497,8 +17426,7 @@ $kendo-calendar-sizes: (
17497
17426
  $calendar-cell-hover-gradient
17498
17427
  );
17499
17428
  }
17500
- .k-calendar-td.k-selected .k-calendar-cell-inner,
17501
- .k-calendar-td.k-state-selected .k-calendar-cell-inner {
17429
+ .k-calendar-td.k-selected .k-calendar-cell-inner {
17502
17430
  @include fill(
17503
17431
  $calendar-cell-selected-text,
17504
17432
  $calendar-cell-selected-bg,
@@ -17507,8 +17435,7 @@ $kendo-calendar-sizes: (
17507
17435
  );
17508
17436
  }
17509
17437
  .k-calendar-td.k-selected:hover .k-calendar-cell-inner,
17510
- .k-calendar-td.k-selected.k-hover .k-calendar-cell-inner,
17511
- .k-calendar-td.k-state-selected:hover .k-calendar-cell-inner {
17438
+ .k-calendar-td.k-selected.k-hover .k-calendar-cell-inner {
17512
17439
  @include fill(
17513
17440
  $calendar-cell-selected-hover-text,
17514
17441
  $calendar-cell-selected-hover-bg,
@@ -17517,14 +17444,11 @@ $kendo-calendar-sizes: (
17517
17444
  );
17518
17445
  }
17519
17446
  .k-calendar-td:focus .k-calendar-cell-inner,
17520
- .k-calendar-td.k-focus .k-calendar-cell-inner,
17521
- .k-calendar-td.k-state-focus .k-calendar-cell-inner,
17522
- .k-calendar-td.k-state-focused .k-calendar-cell-inner {
17447
+ .k-calendar-td.k-focus .k-calendar-cell-inner {
17523
17448
  box-shadow: $calendar-cell-focused-shadow;
17524
17449
  }
17525
17450
  .k-calendar-td.k-selected:focus .k-calendar-cell-inner,
17526
- .k-calendar-td.k-selected.k-focus .k-calendar-cell-inner,
17527
- .k-calendar-td.k-state-selected.k-state-focus .k-calendar-cell-inner {
17451
+ .k-calendar-td.k-selected.k-focus .k-calendar-cell-inner {
17528
17452
  box-shadow: $calendar-cell-selected-focus-shadow;
17529
17453
  }
17530
17454
 
@@ -17538,8 +17462,7 @@ $kendo-calendar-sizes: (
17538
17462
  box-shadow: inset -1px 0 $calendar-navigation-border;
17539
17463
 
17540
17464
  li:hover,
17541
- li.k-hover,
17542
- li.k-state-hover {
17465
+ li.k-hover {
17543
17466
  color: $calendar-today-nav-hover-text;
17544
17467
  }
17545
17468
  }
@@ -17562,7 +17485,6 @@ $kendo-calendar-sizes: (
17562
17485
  // Invalid
17563
17486
  &.k-invalid,
17564
17487
  &.k-invalid:hover,
17565
- &.k-state-invalid,
17566
17488
  &.ng-invalid.ng-touched,
17567
17489
  &.ng-invalid.ng-dirty {
17568
17490
  border-color: $invalid-border;
@@ -17610,9 +17532,7 @@ $kendo-calendar-sizes: (
17610
17532
  }
17611
17533
 
17612
17534
  .k-range-start.k-active,
17613
- .k-range-start.k-state-active,
17614
- .k-range-end.k-active,
17615
- .k-range-end.k-state-active {
17535
+ .k-range-end.k-active {
17616
17536
  .k-calendar-cell-inner {
17617
17537
  box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, .2);
17618
17538
  }
@@ -17848,7 +17768,6 @@ $kendo-time-selector-sizes: (
17848
17768
  display: block;
17849
17769
  }
17850
17770
 
17851
- &.k-state-focused,
17852
17771
  &.k-focus {
17853
17772
  &::before,
17854
17773
  &::after {
@@ -18023,7 +17942,6 @@ $kendo-time-selector-sizes: (
18023
17942
  color: $time-list-title-text;
18024
17943
  }
18025
17944
 
18026
- &.k-state-focused,
18027
17945
  &.k-focus {
18028
17946
  .k-title {
18029
17947
  color: $time-list-title-focus-text;
@@ -18341,18 +18259,14 @@ $colorpalette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inset 0 0 0
18341
18259
  -ms-high-contrast-adjust: none;
18342
18260
 
18343
18261
  &:hover,
18344
- &.k-state-hover,
18345
18262
  &.k-hover {
18346
18263
  position: relative;
18347
18264
  z-index: 101;
18348
18265
  }
18349
18266
 
18350
18267
  &:focus,
18351
- &.k-state-focus,
18352
18268
  &.k-focus,
18353
- &.k-state-selected,
18354
18269
  &.k-selected,
18355
- &.k-state-selected:hover,
18356
18270
  &.k-selected:hover {
18357
18271
  position: relative;
18358
18272
  z-index: 100;
@@ -18372,20 +18286,15 @@ $colorpalette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inset 0 0 0
18372
18286
  .k-colorpalette-tile {
18373
18287
 
18374
18288
  &:focus,
18375
- &.k-state-focus,
18376
18289
  &.k-focus {
18377
18290
  @include box-shadow( $colorpalette-tile-focus-shadow );
18378
18291
  }
18379
18292
 
18380
18293
  &:hover,
18381
- &.k-state-hover,
18382
18294
  &.k-hover {
18383
18295
  @include box-shadow( $colorpalette-tile-hover-shadow );
18384
18296
  }
18385
18297
 
18386
- &.k-state-selected,
18387
- &.k-selected,
18388
- &.k-state-selected:hover,
18389
18298
  &.k-selected,
18390
18299
  &.k-selected:hover {
18391
18300
  @include box-shadow( $colorpalette-tile-selected-shadow );
@@ -18765,7 +18674,6 @@ $colorgradient-contrast-spacer: ( $colorgradient-spacer / 1.5 ) !default;
18765
18674
  }
18766
18675
 
18767
18676
  .k-colorgradient:focus,
18768
- .k-colorgradient.k-state-focus,
18769
18677
  .k-colorgradient.k-focus {
18770
18678
  @include fill( $border: $colorgradient-focus-border );
18771
18679
  @include box-shadow( $colorgradient-focus-shadow );
@@ -18786,16 +18694,15 @@ $colorgradient-contrast-spacer: ( $colorgradient-spacer / 1.5 ) !default;
18786
18694
  @include box-shadow( $colorgradient-draghandle-shadow );
18787
18695
 
18788
18696
  &:focus,
18789
- &.k-state-focus,
18790
18697
  &.k-focus {
18791
18698
  @include fill( $bg: transparent, $border: $white );
18792
18699
  @include box-shadow( $colorgradient-draghandle-focus-shadow );
18793
18700
  }
18794
18701
 
18795
- &:active,
18796
18702
  &:hover,
18797
- &.k-state-hover,
18798
- &.k-hover {
18703
+ &.k-hover,
18704
+ &.k-active,
18705
+ &:active {
18799
18706
  @include fill( $bg: transparent, $border: $white );
18800
18707
  @include box-shadow( $colorgradient-draghandle-hover-shadow );
18801
18708
  }
@@ -18991,7 +18898,6 @@ $coloreditor-views-gap: $coloreditor-spacer !default;
18991
18898
  }
18992
18899
 
18993
18900
  .k-coloreditor:focus,
18994
- .k-coloreditor.k-state-focus,
18995
18901
  .k-coloreditor.k-focus {
18996
18902
  @include fill( $border: $coloreditor-focus-border );
18997
18903
  @include box-shadow( $coloreditor-focus-shadow );
@@ -20286,7 +20192,7 @@ $rating-icon-focused-selected-shadow: 0 2px 4px rgba( $black, .1) !default;
20286
20192
  box-sizing: border-box;
20287
20193
  }
20288
20194
 
20289
- &.k-state-readonly {
20195
+ &.k-readonly {
20290
20196
  pointer-events: none;
20291
20197
  }
20292
20198
  }
@@ -20366,7 +20272,6 @@ $rating-icon-focused-selected-shadow: 0 2px 4px rgba( $black, .1) !default;
20366
20272
  color: $component-text;
20367
20273
 
20368
20274
  &:focus,
20369
- &.k-state-focused,
20370
20275
  &.k-focus {
20371
20276
 
20372
20277
  .k-rating-item {
@@ -20374,7 +20279,6 @@ $rating-icon-focused-selected-shadow: 0 2px 4px rgba( $black, .1) !default;
20374
20279
  text-shadow: $rating-icon-focused-shadow;
20375
20280
  }
20376
20281
 
20377
- &.k-state-selected > .k-icon,
20378
20282
  &.k-selected > .k-icon {
20379
20283
  text-shadow: $rating-icon-focused-selected-shadow;
20380
20284
  }
@@ -20385,19 +20289,16 @@ $rating-icon-focused-selected-shadow: 0 2px 4px rgba( $black, .1) !default;
20385
20289
  .k-rating-item {
20386
20290
  color: $rating-icon-text;
20387
20291
 
20388
- &.k-state-selected,
20389
20292
  &.k-selected {
20390
20293
  color: $rating-icon-selected-text;
20391
20294
 
20392
20295
  &:focus,
20393
- &.k-state-focused,
20394
20296
  &.k-focus {
20395
20297
  color: $rating-icon-focused-text;
20396
20298
  }
20397
20299
  }
20398
20300
 
20399
20301
  &:hover,
20400
- &.k-state-hover,
20401
20302
  &.k-hover {
20402
20303
  color: $rating-icon-hover-text;
20403
20304
  cursor: pointer;
@@ -20405,7 +20306,6 @@ $rating-icon-focused-selected-shadow: 0 2px 4px rgba( $black, .1) !default;
20405
20306
  }
20406
20307
  }
20407
20308
 
20408
-
20409
20309
  // #endregion
20410
20310
 
20411
20311
  // #endregion
@@ -21629,7 +21529,6 @@ $upload-focused-shadow: 0 0 0 2px rgba(0, 0, 0, .13) !default;
21629
21529
  z-index: 1;
21630
21530
  }
21631
21531
  input[disabled],
21632
- input.k-state-disabled,
21633
21532
  input.k-disabled {
21634
21533
  visibility: hidden;
21635
21534
  }
@@ -21677,12 +21576,10 @@ $upload-focused-shadow: 0 0 0 2px rgba(0, 0, 0, .13) !default;
21677
21576
 
21678
21577
  .k-file {
21679
21578
 
21680
- &.k-state-focused,
21681
21579
  &.k-focus {
21682
21580
  box-shadow: inset $upload-focused-shadow;
21683
21581
  }
21684
21582
 
21685
- .k-upload-action.k-state-focused,
21686
21583
  .k-upload-action.k-focus {
21687
21584
  box-shadow: $upload-focused-shadow;
21688
21585
  }
@@ -21774,7 +21671,6 @@ $upload-focused-shadow: 0 0 0 2px rgba(0, 0, 0, .13) !default;
21774
21671
  }
21775
21672
 
21776
21673
  // Invalid,
21777
- &.k-state-invalid,
21778
21674
  &.k-invalid,
21779
21675
  &.ng-invalid.ng-touched,
21780
21676
  &.ng-invalid.ng-dirty {
@@ -22809,7 +22705,6 @@ $actionsheet-item-disabled-shadow: null !default;
22809
22705
 
22810
22706
  // Hover state
22811
22707
  &:hover,
22812
- &.k-state-hover,
22813
22708
  &.k-hover {
22814
22709
  @include fill(
22815
22710
  $actionsheet-item-hover-text,
@@ -22823,7 +22718,6 @@ $actionsheet-item-disabled-shadow: null !default;
22823
22718
 
22824
22719
  // Focus state
22825
22720
  &:focus,
22826
- &.k-state-focus,
22827
22721
  &.k-focus {
22828
22722
  @include fill(
22829
22723
  $actionsheet-item-focus-text,
@@ -22837,7 +22731,6 @@ $actionsheet-item-disabled-shadow: null !default;
22837
22731
 
22838
22732
  // Disabed state
22839
22733
  &:disabled,
22840
- &.k-state-disabled,
22841
22734
  &.k-disabled {
22842
22735
  @include fill(
22843
22736
  $actionsheet-item-disabled-text,
@@ -23082,7 +22975,6 @@ $actionsheet-item-disabled-shadow: null !default;
23082
22975
 
23083
22976
  .k-window {
23084
22977
  &:focus,
23085
- &.k-state-focused,
23086
22978
  &.k-focus {
23087
22979
  @include box-shadow( $window-focused-shadow );
23088
22980
  }
@@ -23567,33 +23459,28 @@ $drawer-selected-hover-text: $selected-hover-text !default;
23567
23459
  .k-drawer-item {
23568
23460
 
23569
23461
  &:hover,
23570
- &.k-state-hover,
23571
23462
  &.k-hover {
23572
23463
  color: $drawer-hovered-text;
23573
23464
  background-color: $drawer-hovered-bg;
23574
23465
  }
23575
23466
 
23576
23467
  &:focus,
23577
- &.k-state-focused,
23578
23468
  &.k-focus {
23579
23469
  background-color: $drawer-focused-bg;
23580
23470
  box-shadow: $drawer-focused-shadow;
23581
23471
 
23582
23472
  &:hover,
23583
- &.k-state-hover,
23584
23473
  &.k-hover {
23585
23474
  color: $drawer-hovered-text;
23586
23475
  background-color: $drawer-hovered-bg;
23587
23476
  }
23588
23477
  }
23589
23478
 
23590
- &.k-state-selected,
23591
23479
  &.k-selected {
23592
23480
  color: $drawer-selected-text;
23593
23481
  background-color: $drawer-selected-bg;
23594
23482
 
23595
23483
  &:hover,
23596
- &.k-state-hover,
23597
23484
  &.k-hover {
23598
23485
  color: $drawer-selected-hover-text;
23599
23486
  background-color: $drawer-selected-hover-bg;
@@ -24336,8 +24223,7 @@ $card-callout-height: 20px !default;
24336
24223
  }
24337
24224
 
24338
24225
  &:focus,
24339
- &.k-focus,
24340
- &.k-state-focus {
24226
+ &.k-focus {
24341
24227
  @include fill(
24342
24228
  $card-focus-text,
24343
24229
  $card-focus-bg,
@@ -24346,8 +24232,7 @@ $card-callout-height: 20px !default;
24346
24232
  @include box-shadow( $card-focus-shadow );
24347
24233
  }
24348
24234
 
24349
- &.k-selected,
24350
- &.k-state-selected {
24235
+ &.k-selected {
24351
24236
  @include box-shadow( $card-focus-shadow );
24352
24237
  }
24353
24238
  }
@@ -24399,10 +24284,8 @@ $card-callout-height: 20px !default;
24399
24284
 
24400
24285
 
24401
24286
  .k-card-wrap {
24402
- &.k-state-focused,
24403
- &.k-focus,
24404
24287
  &:focus,
24405
- &.k-state-selected,
24288
+ &.k-focus,
24406
24289
  &.k-selected {
24407
24290
  > .k-card {
24408
24291
  @include box-shadow( $card-focus-shadow );
@@ -24836,7 +24719,6 @@ $bottom-nav-flat-border: $component-border !default;
24836
24719
  outline: 0;
24837
24720
  }
24838
24721
  }
24839
- .k-bottom-nav-item.k-state-disabled,
24840
24722
  .k-bottom-nav-item.k-disabled {
24841
24723
  background-color: initial;
24842
24724
  }
@@ -24883,15 +24765,11 @@ $bottom-nav-flat-border: $component-border !default;
24883
24765
  $bg: $color
24884
24766
  );
24885
24767
 
24886
- .k-bottom-nav-item.k-state-focus,
24887
- .k-bottom-nav-item.k-focus,
24888
- .k-bottom-nav-item.k-state-focused,
24889
24768
  .k-bottom-nav-item.k-focus,
24890
24769
  .k-bottom-nav-item:focus {
24891
24770
  @include fill( $bg: rgba(true-mix( $color, contrast-wcag( $color ), 35%), .2));
24892
24771
  }
24893
24772
 
24894
- .k-bottom-nav-item.k-state-selected,
24895
24773
  .k-bottom-nav-item.k-selected {
24896
24774
  @include fill( $color: contrast-wcag( $color ) );
24897
24775
  }
@@ -24906,16 +24784,12 @@ $bottom-nav-flat-border: $component-border !default;
24906
24784
  $bottom-nav-flat-border
24907
24785
  );
24908
24786
 
24909
- .k-bottom-nav-item.k-state-focus,
24910
- .k-bottom-nav-item.k-focus,
24911
- .k-bottom-nav-item.k-state-focused,
24912
24787
  .k-bottom-nav-item.k-focus,
24913
24788
  .k-bottom-nav-item:focus {
24914
24789
  @include fill( $bg: rgba($bottom-nav-flat-text, .05) );
24915
24790
  }
24916
24791
 
24917
24792
  @each $name, $color in $kendo-theme-colors {
24918
- &.k-bottom-nav-#{$name} .k-bottom-nav-item.k-state-selected,
24919
24793
  &.k-bottom-nav-#{$name} .k-bottom-nav-item.k-selected {
24920
24794
  @if $name == "secondary" or $name == "light" {
24921
24795
  @include fill( $color: try-shade($color, 3) );
@@ -25176,7 +25050,6 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
25176
25050
  );
25177
25051
 
25178
25052
  &:focus,
25179
- &.k-state-focused,
25180
25053
  &.k-focus {
25181
25054
  @include box-shadow( $breadcrumb-focused-shadow );
25182
25055
  }
@@ -25193,7 +25066,6 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
25193
25066
 
25194
25067
  // Hovered state
25195
25068
  &:hover,
25196
- &.k-state-hover,
25197
25069
  &.k-hover {
25198
25070
  @include fill(
25199
25071
  $breadcrumb-link-hovered-text,
@@ -25204,7 +25076,6 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
25204
25076
 
25205
25077
  // Focused state
25206
25078
  &:focus,
25207
- &.k-state-focused,
25208
25079
  &.k-focus {
25209
25080
  @include fill(
25210
25081
  $breadcrumb-link-focused-text,
@@ -25226,7 +25097,6 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
25226
25097
 
25227
25098
  // Hovered state
25228
25099
  &:hover,
25229
- &.k-state-hover,
25230
25100
  &.k-hover {
25231
25101
  @include fill(
25232
25102
  $breadcrumb-root-link-hovered-text,
@@ -25237,7 +25107,6 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
25237
25107
 
25238
25108
  // Focused state
25239
25109
  &:focus,
25240
- &.k-state-focused,
25241
25110
  &.k-focus {
25242
25111
  @include fill(
25243
25112
  $breadcrumb-root-link-focused-text,
@@ -25387,7 +25256,6 @@ $pager-dropdown-width: 5em !default;
25387
25256
 
25388
25257
  // Focused state
25389
25258
  &:focus,
25390
- &.k-state-focus,
25391
25259
  &.k-focus {
25392
25260
  z-index: 3;
25393
25261
  }
@@ -25441,7 +25309,6 @@ $pager-dropdown-width: 5em !default;
25441
25309
  &:hover {
25442
25310
  z-index: 2;
25443
25311
  }
25444
- &.k-state-disabled,
25445
25312
  &.k-disabled {
25446
25313
  color: inherit;
25447
25314
  }
@@ -25491,7 +25358,6 @@ $pager-dropdown-width: 5em !default;
25491
25358
  }
25492
25359
 
25493
25360
  // Selected state
25494
- .k-state-selected,
25495
25361
  .k-selected {
25496
25362
  cursor: inherit;
25497
25363
  z-index: 2;
@@ -25639,9 +25505,6 @@ $pager-dropdown-width: 5em !default;
25639
25505
  );
25640
25506
 
25641
25507
  &:focus,
25642
- &.k-focus,
25643
- &.k-state-focus,
25644
- &.k-state-focused,
25645
25508
  &.k-focus {
25646
25509
  @include fill( $bg: $pager-focus-bg );
25647
25510
  @include box-shadow( $pager-focus-shadow );
@@ -25657,7 +25520,6 @@ $pager-dropdown-width: 5em !default;
25657
25520
  );
25658
25521
 
25659
25522
  &:hover,
25660
- &.k-state-hover,
25661
25523
  &.k-hover {
25662
25524
  @include fill(
25663
25525
  $pager-item-hover-text,
@@ -25666,7 +25528,6 @@ $pager-dropdown-width: 5em !default;
25666
25528
  );
25667
25529
  }
25668
25530
 
25669
- &.k-state-selected,
25670
25531
  &.k-selected {
25671
25532
  @include fill(
25672
25533
  $pager-item-selected-text,
@@ -25676,7 +25537,6 @@ $pager-dropdown-width: 5em !default;
25676
25537
  }
25677
25538
 
25678
25539
  &:focus,
25679
- &.k-state-focus,
25680
25540
  &.k-focus {
25681
25541
  background-color: $pager-item-focus-bg;
25682
25542
  @include box-shadow( $pager-item-focus-shadow );
@@ -25700,7 +25560,6 @@ $pager-dropdown-width: 5em !default;
25700
25560
  );
25701
25561
 
25702
25562
  &:hover,
25703
- &.k-state-hover,
25704
25563
  &.k-hover {
25705
25564
  @include fill(
25706
25565
  $pager-number-hover-text,
@@ -25710,13 +25569,11 @@ $pager-dropdown-width: 5em !default;
25710
25569
  }
25711
25570
 
25712
25571
  &:focus,
25713
- &.k-state-focus,
25714
25572
  &.k-focus {
25715
25573
  background-color: $pager-number-focus-bg;
25716
25574
  @include box-shadow( $pager-number-focus-shadow );
25717
25575
  }
25718
25576
 
25719
- &.k-state-selected,
25720
25577
  &.k-selected {
25721
25578
  @include fill(
25722
25579
  $pager-number-selected-text,
@@ -25749,7 +25606,6 @@ $pager-dropdown-width: 5em !default;
25749
25606
  );
25750
25607
 
25751
25608
  &:hover,
25752
- &.k-state-hover,
25753
25609
  &.k-hover {
25754
25610
  @include fill(
25755
25611
  $dropdownlist-hovered-text,
@@ -25759,7 +25615,7 @@ $pager-dropdown-width: 5em !default;
25759
25615
  }
25760
25616
  }
25761
25617
 
25762
- &.k-state-expanded {
25618
+ &.k-expanded {
25763
25619
  @include fill(
25764
25620
  $popup-text,
25765
25621
  $popup-bg,
@@ -25770,7 +25626,6 @@ $pager-dropdown-width: 5em !default;
25770
25626
  .k-link {
25771
25627
 
25772
25628
  &:hover,
25773
- &.k-state-hover,
25774
25629
  &.k-hover {
25775
25630
  @include fill(
25776
25631
  $kendo-list-item-hover-text,
@@ -25778,7 +25633,6 @@ $pager-dropdown-width: 5em !default;
25778
25633
  );
25779
25634
  }
25780
25635
 
25781
- &.k-state-selected,
25782
25636
  &.k-selected {
25783
25637
  @include fill(
25784
25638
  $kendo-list-item-selected-text,
@@ -26381,7 +26235,6 @@ $stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0ms !def
26381
26235
  $bg: $stepper-progressbar-bg
26382
26236
  );
26383
26237
 
26384
- .k-state-selected,
26385
26238
  .k-selected {
26386
26239
  @include fill(
26387
26240
  $color: $stepper-progressbar-fill-text,
@@ -26632,13 +26485,11 @@ $tabstrip-content-border-focused: $component-text !default;
26632
26485
  position: relative;
26633
26486
  z-index: 1;
26634
26487
 
26635
- &.k-state-active,
26636
26488
  &.k-active {
26637
26489
  display: block;
26638
26490
  }
26639
26491
 
26640
26492
  &:focus,
26641
- &.k-state-focused,
26642
26493
  &.k-focus {
26643
26494
  outline-width: 1px;
26644
26495
  outline-style: dotted;
@@ -26727,7 +26578,6 @@ $tabstrip-content-border-focused: $component-text !default;
26727
26578
  margin-left: $tabstrip-item-gap;
26728
26579
  }
26729
26580
 
26730
- .k-item.k-state-active,
26731
26581
  .k-item.k-active {
26732
26582
  border-bottom-color: transparent;
26733
26583
  }
@@ -26757,7 +26607,6 @@ $tabstrip-content-border-focused: $component-text !default;
26757
26607
  margin-left: $tabstrip-item-gap;
26758
26608
  }
26759
26609
 
26760
- .k-item.k-state-active,
26761
26610
  .k-item.k-active {
26762
26611
  border-top-color: transparent;
26763
26612
  }
@@ -26791,7 +26640,6 @@ $tabstrip-content-border-focused: $component-text !default;
26791
26640
  margin-top: $tabstrip-item-gap;
26792
26641
  }
26793
26642
 
26794
- .k-item.k-state-active,
26795
26643
  .k-item.k-active {
26796
26644
  border-right-color: transparent;
26797
26645
  }
@@ -26827,7 +26675,6 @@ $tabstrip-content-border-focused: $component-text !default;
26827
26675
  margin-top: $tabstrip-item-gap;
26828
26676
  }
26829
26677
 
26830
- .k-item.k-state-active,
26831
26678
  .k-item.k-active {
26832
26679
  border-left-color: transparent;
26833
26680
  }
@@ -26873,7 +26720,6 @@ $tabstrip-content-border-focused: $component-text !default;
26873
26720
  border-left-width: $tabstrip-indicator-size;
26874
26721
  }
26875
26722
  }
26876
- .k-item.k-state-active::after,
26877
26723
  .k-item.k-active::after {
26878
26724
  display: block;
26879
26725
  }
@@ -26947,7 +26793,6 @@ $tabstrip-content-border-focused: $component-text !default;
26947
26793
  );
26948
26794
 
26949
26795
  &:hover,
26950
- &.k-state-hover,
26951
26796
  &.k-hover {
26952
26797
  @include fill(
26953
26798
  $tabstrip-item-hovered-text,
@@ -26958,9 +26803,7 @@ $tabstrip-content-border-focused: $component-text !default;
26958
26803
  }
26959
26804
 
26960
26805
  &:active,
26961
- &.k-state-active,
26962
26806
  &.k-active,
26963
- &.k-state-selected,
26964
26807
  &.k-selected {
26965
26808
  @include fill(
26966
26809
  $tabstrip-item-selected-text,
@@ -26971,7 +26814,6 @@ $tabstrip-content-border-focused: $component-text !default;
26971
26814
  }
26972
26815
 
26973
26816
  &:focus,
26974
- &.k-state-focused,
26975
26817
  &.k-focus {
26976
26818
  @include box-shadow( $tabstrip-item-focused-shadow );
26977
26819
  }
@@ -26994,7 +26836,6 @@ $tabstrip-content-border-focused: $component-text !default;
26994
26836
  );
26995
26837
 
26996
26838
  &:focus,
26997
- &.k-state-focused,
26998
26839
  &.k-focus {
26999
26840
  outline-color: $tabstrip-content-border-focused;
27000
26841
  }
@@ -27005,7 +26846,6 @@ $tabstrip-content-border-focused: $component-text !default;
27005
26846
  @if ($tabstrip-indicator-size) {
27006
26847
 
27007
26848
  .k-tabstrip-items-wrapper {
27008
- .k-item.k-state-active::after,
27009
26849
  .k-item.k-active::after {
27010
26850
  border-color: $tabstrip-indicator-color;
27011
26851
  }
@@ -27099,7 +26939,6 @@ $wizard-focused-shadow: inset 0 0 0 2px rgba(0, 0, 0, .13) !default;
27099
26939
  justify-content: space-between;
27100
26940
 
27101
26941
  &:focus,
27102
- &.k-state-focused,
27103
26942
  &.k-focus {
27104
26943
  outline-width: 1px;
27105
26944
  outline-style: dotted;
@@ -27194,20 +27033,20 @@ $wizard-focused-shadow: inset 0 0 0 2px rgba(0, 0, 0, .13) !default;
27194
27033
  // #region @import "_theme.scss"; -> packages/classic/scss/wizard/_theme.scss
27195
27034
  // #region @import "~@progress/kendo-theme-default/scss/wizard/_theme.scss"; -> packages/classic/node_modules/@progress/kendo-theme-default/scss/wizard/_theme.scss
27196
27035
  @include exports("wizard/theme") {
27036
+
27197
27037
  .k-wizard-step {
27198
27038
  &:focus,
27199
- &.k-state-focused,
27200
27039
  &.k-focus {
27201
27040
  outline-color: $wizard-step-border-focused;
27202
27041
  }
27203
27042
 
27204
27043
  .k-ie &:focus,
27205
- .k-ie &.k-state-focused,
27206
27044
  .k-ie &.k-focus {
27207
27045
  @include box-shadow($wizard-focused-shadow);
27208
27046
  outline: none;
27209
27047
  }
27210
27048
  }
27049
+
27211
27050
  }
27212
27051
 
27213
27052
  // #endregion
@@ -27373,7 +27212,6 @@ $expander-content-padding-y: $padding-y * 4 !default;
27373
27212
  $expander-border
27374
27213
  );
27375
27214
 
27376
- &.k-state-focus,
27377
27215
  &.k-focus {
27378
27216
  box-shadow: $expander-focus-shadow;
27379
27217
  }
@@ -27388,13 +27226,10 @@ $expander-content-padding-y: $padding-y * 4 !default;
27388
27226
  outline: none;
27389
27227
 
27390
27228
  &:hover,
27391
- &.k-state-hover,
27392
27229
  &.k-hover {
27393
27230
  background-color: $expander-header-hover-bg;
27394
27231
  }
27395
27232
 
27396
- // Should be removed
27397
- &.k-state-focused,
27398
27233
  &.k-focus {
27399
27234
  background-color: $expander-header-focused-bg;
27400
27235
  box-shadow: $expander-header-focused-shadow;
@@ -27641,6 +27476,10 @@ $panelbar-header-expanded-gradient: null !default;
27641
27476
  }
27642
27477
  }
27643
27478
 
27479
+ // Panelbar item
27480
+ .k-panelbar-item {
27481
+ outline-style: none;
27482
+ }
27644
27483
 
27645
27484
  // Panelbar content
27646
27485
  .k-panelbar-content {
@@ -27742,7 +27581,6 @@ $panelbar-header-expanded-gradient: null !default;
27742
27581
  > .k-item,
27743
27582
  > .k-panelbar-header {
27744
27583
 
27745
- &.k-state-expanded.k-level-0 > .k-link,
27746
27584
  &.k-expanded.k-level-0 > .k-link {
27747
27585
  @include fill(
27748
27586
  $panelbar-header-expanded-text,
@@ -27769,7 +27607,6 @@ $panelbar-header-expanded-gradient: null !default;
27769
27607
 
27770
27608
  // Hover
27771
27609
  > .k-link:hover,
27772
- > .k-link.k-state-hover,
27773
27610
  > .k-link.k-hover {
27774
27611
  @include fill(
27775
27612
  $panelbar-header-hovered-text,
@@ -27781,9 +27618,6 @@ $panelbar-header-expanded-gradient: null !default;
27781
27618
 
27782
27619
  // Focus
27783
27620
  > .k-link:focus,
27784
- > .k-link.k-state-focus,
27785
- > .k-link.k-focus,
27786
- > .k-link.k-state-focused,
27787
27621
  > .k-link.k-focus {
27788
27622
  @include fill(
27789
27623
  $panelbar-header-focused-text,
@@ -27796,7 +27630,6 @@ $panelbar-header-expanded-gradient: null !default;
27796
27630
 
27797
27631
  // Focus & Hover
27798
27632
  > .k-link:focus:hover,
27799
- > .k-link.k-state-focus.k-state-hover,
27800
27633
  > .k-link.k-focus.k-hover {
27801
27634
  @include fill(
27802
27635
  $panelbar-header-hovered-focused-text,
@@ -27807,7 +27640,6 @@ $panelbar-header-expanded-gradient: null !default;
27807
27640
  }
27808
27641
 
27809
27642
  // Selected
27810
- > .k-link.k-state-selected,
27811
27643
  > .k-link.k-selected {
27812
27644
  @include fill(
27813
27645
  $panelbar-header-selected-text,
@@ -27823,9 +27655,7 @@ $panelbar-header-expanded-gradient: null !default;
27823
27655
  }
27824
27656
 
27825
27657
  // Selected Hover
27826
- > .k-link.k-state-selected:hover,
27827
27658
  > .k-link.k-selected:hover,
27828
- > .k-link.k-state-selected.k-state-hover,
27829
27659
  > .k-link.k-selected.k-hover {
27830
27660
  @include fill(
27831
27661
  $panelbar-header-selected-hovered-text,
@@ -27836,12 +27666,8 @@ $panelbar-header-expanded-gradient: null !default;
27836
27666
  }
27837
27667
 
27838
27668
  // Selected Focus
27839
- > .k-link.k-state-selected:focus,
27840
27669
  > .k-link.k-selected:focus,
27841
- > .k-link.k-state-selected.k-state-focus,
27842
- > .k-link.k-selected.k-focus,
27843
- > .k-link.k-state-selected.k-state-focused,
27844
- > .k-link.k-selected.k-focused {
27670
+ > .k-link.k-selected.k-focus {
27845
27671
  @include fill(
27846
27672
  $panelbar-header-selected-focused-text,
27847
27673
  $panelbar-header-selected-focused-bg,
@@ -27851,12 +27677,8 @@ $panelbar-header-expanded-gradient: null !default;
27851
27677
  }
27852
27678
 
27853
27679
  // Selected Focus & Hover
27854
- > .k-link.k-state-selected:hover:focus,
27855
27680
  > .k-link.k-selected:hover:focus,
27856
- > .k-link.k-state-selected.k-state-hover.k-state-focus,
27857
- > .k-link.k-selected.k-hover.k-state-focus,
27858
- > .k-link.k-state-selected.k-state-hover.k-state-focused,
27859
- > .k-link.k-selected.k-hover.k-state-focused {
27681
+ > .k-link.k-selected.k-hover.k-focus {
27860
27682
  @include fill(
27861
27683
  $panelbar-header-selected-hovered-focused-text,
27862
27684
  $panelbar-header-selected-hovered-focused-bg,
@@ -27873,10 +27695,8 @@ $panelbar-header-expanded-gradient: null !default;
27873
27695
 
27874
27696
  // Hover
27875
27697
  > .k-item > .k-link:hover,
27876
- > .k-item > .k-link.k-state-hover,
27877
27698
  > .k-item > .k-link.k-hover,
27878
27699
  > .k-panelbar-item > .k-link:hover,
27879
- > .k-panelbar-item > .k-link.k-state-hover,
27880
27700
  > .k-panelbar-item > .k-link.k-hover {
27881
27701
  @include fill(
27882
27702
  $panelbar-item-hovered-text,
@@ -27888,14 +27708,8 @@ $panelbar-header-expanded-gradient: null !default;
27888
27708
 
27889
27709
  // Focus
27890
27710
  > .k-item > .k-link:focus,
27891
- > .k-item > .k-link.k-state-focus,
27892
- > .k-item > .k-link.k-focus,
27893
- > .k-item > .k-link.k-state-focused,
27894
27711
  > .k-item > .k-link.k-focus,
27895
27712
  > .k-panelbar-item > .k-link:focus,
27896
- > .k-panelbar-item > .k-link.k-state-focus,
27897
- > .k-panelbar-item > .k-link.k-focus,
27898
- > .k-panelbar-item > .k-link.k-state-focused,
27899
27713
  > .k-panelbar-item > .k-link.k-focus {
27900
27714
  @include fill(
27901
27715
  $panelbar-item-focused-text,
@@ -27908,10 +27722,8 @@ $panelbar-header-expanded-gradient: null !default;
27908
27722
 
27909
27723
  // Focus & Hover
27910
27724
  > .k-item > .k-link:focus:hover,
27911
- > .k-item > .k-link.k-state-focus.k-state-hover,
27912
27725
  > .k-item > .k-link.k-focus.k-hover,
27913
27726
  > .k-panelbar-item > .k-link:focus:hover,
27914
- > .k-panelbar-item > .k-link.k-state-focus.k-state-hover,
27915
27727
  > .k-panelbar-item > .k-link.k-focus.k-hover {
27916
27728
  @include fill(
27917
27729
  $panelbar-item-hovered-focused-text,
@@ -27922,9 +27734,7 @@ $panelbar-header-expanded-gradient: null !default;
27922
27734
  }
27923
27735
 
27924
27736
  // Selected
27925
- > .k-item > .k-link.k-state-selected,
27926
27737
  > .k-item > .k-link.k-selected,
27927
- > .k-panelbar-item > .k-link.k-state-selected,
27928
27738
  > .k-panelbar-item > .k-link.k-selected {
27929
27739
  @include fill(
27930
27740
  $panelbar-item-selected-text,
@@ -27935,13 +27745,9 @@ $panelbar-header-expanded-gradient: null !default;
27935
27745
  }
27936
27746
 
27937
27747
  // Selected Hover
27938
- > .k-item > .k-link.k-state-selected:hover,
27939
27748
  > .k-item > .k-link.k-selected:hover,
27940
- > .k-item > .k-link.k-state-selected.k-state-hover,
27941
27749
  > .k-item > .k-link.k-selected.k-hover,
27942
- > .k-panelbar-item > .k-link.k-state-selected:hover,
27943
27750
  > .k-panelbar-item > .k-link.k-selected:hover,
27944
- > .k-panelbar-item > .k-link.k-state-selected.k-state-hover,
27945
27751
  > .k-panelbar-item > .k-link.k-selected.k-hover {
27946
27752
  @include fill(
27947
27753
  $panelbar-item-selected-hovered-text,
@@ -27952,18 +27758,10 @@ $panelbar-header-expanded-gradient: null !default;
27952
27758
  }
27953
27759
 
27954
27760
  // Selected Focus
27955
- > .k-item > .k-link.k-state-selected:focus,
27956
27761
  > .k-item > .k-link.k-selected:focus,
27957
- > .k-item > .k-link.k-state-selected.k-state-focus,
27958
27762
  > .k-item > .k-link.k-selected.k-focus,
27959
- > .k-item > .k-link.k-state-selected.k-state-focused,
27960
- > .k-item > .k-link.k-selected.k-focused,
27961
- > .k-panelbar-item > .k-link.k-state-selected:focus,
27962
27763
  > .k-panelbar-item > .k-link.k-selected:focus,
27963
- > .k-panelbar-item > .k-link.k-state-selected.k-state-focus,
27964
- > .k-panelbar-item > .k-link.k-selected.k-focus,
27965
- > .k-item > .k-link.k-state-selected.k-state-focused,
27966
- > .k-item > .k-link.k-selected.k-focused {
27764
+ > .k-panelbar-item > .k-link.k-selected.k-focus {
27967
27765
  @include fill(
27968
27766
  $panelbar-item-selected-focused-text,
27969
27767
  $panelbar-item-selected-focused-bg,
@@ -27973,18 +27771,10 @@ $panelbar-header-expanded-gradient: null !default;
27973
27771
  }
27974
27772
 
27975
27773
  // Selected Focus & Hover
27976
- > .k-item > .k-link.k-state-selected:focus:hover,
27977
27774
  > .k-item > .k-link.k-selected:focus:hover,
27978
- > .k-item > .k-link.k-state-selected.k-state-focus.k-state-hover,
27979
- > .k-item > .k-link.k-selected.k-focus.k-state-hover,
27980
- > .k-item > .k-link.k-state-selected.k-state-focused.k-state-hover,
27981
- > .k-item > .k-link.k-selected.k-focused.k-state-hover,
27982
- > .k-panelbar-item > .k-link.k-state-selected:focus:hover,
27775
+ > .k-item > .k-link.k-selected.k-focus.k-hover,
27983
27776
  > .k-panelbar-item > .k-link.k-selected:focus:hover,
27984
- > .k-panelbar-item > .k-link.k-state-selected.k-state-focus.k-state-hover,
27985
- > .k-panelbar-item > .k-link.k-selected.k-focus.k-state-hover,
27986
- > .k-item > .k-link.k-state-selected.k-state-focused.k-state-hover,
27987
- > .k-item > .k-link.k-selected.k-focused.k-state-hover {
27777
+ > .k-panelbar-item > .k-link.k-selected.k-focus.k-hover {
27988
27778
  @include fill(
27989
27779
  $panelbar-item-selected-hovered-focused-text,
27990
27780
  $panelbar-item-selected-hovered-focused-bg,
@@ -28222,7 +28012,7 @@ $splitbar-selected-text: $selected-text !default;
28222
28012
 
28223
28013
  .k-pane,
28224
28014
  .k-pane-flex {
28225
- &.k-state-hidden,
28015
+ &.k-hidden,
28226
28016
  &[hidden] {
28227
28017
  // sass-lint:disable-block no-important
28228
28018
  // hidden panes need to be zero-width to allow pane animation
@@ -28271,7 +28061,6 @@ $splitbar-selected-text: $selected-text !default;
28271
28061
  background-color: $splitbar-bg;
28272
28062
  }
28273
28063
  .k-splitbar:hover,
28274
- .k-splitbar.k-state-hover,
28275
28064
  .k-splitbar.k-hover,
28276
28065
  .k-splitbar-horizontal-hover,
28277
28066
  .k-splitbar-vertical-hover {
@@ -28279,9 +28068,6 @@ $splitbar-selected-text: $selected-text !default;
28279
28068
  background-color: $splitbar-hover-bg;
28280
28069
  }
28281
28070
  .k-splitbar:focus,
28282
- .k-splitbar.k-state-focus,
28283
- .k-splitbar.k-focus,
28284
- .k-splitbar.k-state-focused,
28285
28071
  .k-splitbar.k-focus {
28286
28072
  color: $splitbar-selected-text;
28287
28073
  background: $splitbar-selected-bg;
@@ -28392,9 +28178,6 @@ $tilelayout-hint-border: $component-border !default;
28392
28178
  }
28393
28179
 
28394
28180
  .k-tilelayout-item:focus,
28395
- .k-tilelayout-item.k-focus,
28396
- .k-tilelayout-item.k-state-focus,
28397
- .k-tilelayout-item.k-state-focused,
28398
28181
  .k-tilelayout-item.k-focus {
28399
28182
  @include box-shadow($tilelayout-card-focus-shadow);
28400
28183
  }
@@ -29074,12 +28857,10 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
29074
28857
 
29075
28858
  .k-column-menu {
29076
28859
 
29077
- .k-listgroup-item.k-state-selected,
29078
28860
  .k-listgroup-item.k-selected {
29079
28861
  color: $adaptive-grid-sort-text;
29080
28862
  background: none;
29081
28863
  }
29082
- .k-listgroup-item.k-state-selected .k-link,
29083
28864
  .k-listgroup-item.k-selected .k-link {
29084
28865
  color: inherit;
29085
28866
  }
@@ -30706,33 +30487,28 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
30706
30487
  }
30707
30488
 
30708
30489
  // Hover state
30709
- tbody>tr:not(.k-detail-row):hover,
30710
- tbody>tr:not(.k-detail-row).k-state-hover,
30711
- tbody>tr:not(.k-detail-row).k-hover {
30490
+ tbody > tr:not(.k-detail-row):hover,
30491
+ tbody > tr:not(.k-detail-row).k-hover {
30712
30492
  color: $grid-hovered-text;
30713
30493
  background-color: $grid-hovered-bg;
30714
30494
  }
30715
30495
 
30716
30496
  // Selected state
30717
- td.k-state-selected,
30718
30497
  td.k-selected,
30719
- tr.k-state-selected > td,
30720
30498
  tr.k-selected > td {
30721
30499
  color: $grid-selected-text;
30722
30500
  background-color: $grid-selected-bg;
30723
30501
  }
30724
30502
 
30725
30503
  // Focused state
30726
- td.k-state-focused,
30504
+ td:focus,
30727
30505
  td.k-focus,
30728
- th.k-state-focused,
30729
- th.k-focus,
30730
30506
  th:focus,
30507
+ th.k-focus,
30731
30508
  .k-master-row > td:focus,
30732
30509
  .k-grouping-row > td:focus,
30733
30510
  .k-detail-row > td:focus,
30734
30511
  .k-group-footer > td:focus,
30735
- .k-grid-pager.k-state-focused,
30736
30512
  .k-grid-pager.k-focus {
30737
30513
  box-shadow: $grid-focused-shadow;
30738
30514
  }
@@ -30776,20 +30552,16 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
30776
30552
  }
30777
30553
 
30778
30554
  // Selected state
30779
- .k-state-selected td,
30780
30555
  .k-selected td {
30781
30556
  @include fill( $bg: $grid-sticky-selected-bg );
30782
30557
  }
30783
30558
 
30784
- .k-state-selected.k-alt td,
30785
30559
  .k-selected.k-alt td {
30786
30560
  @include fill( $bg: $grid-sticky-selected-alt-bg );
30787
30561
  }
30788
30562
 
30789
30563
  // Selected hover
30790
- .k-state-selected:hover td,
30791
30564
  .k-selected:hover td,
30792
- .k-state-selected.k-state-hover td,
30793
30565
  .k-selected.k-hover td {
30794
30566
  @include fill( $bg: $grid-sticky-selected-hovered-bg );
30795
30567
  }
@@ -30833,12 +30605,9 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
30833
30605
  background-color: $kendo-button-hover-bg;
30834
30606
  }
30835
30607
  &:focus,
30836
- &.k-state-focus,
30837
- &.k-focus,
30838
- &.k-state-border-down {
30608
+ &.k-focus {
30839
30609
  box-shadow: inset 0 0 0 2px rgba( 0, 0, 0, .1 );
30840
30610
  }
30841
- &.k-state-active,
30842
30611
  &.k-active {
30843
30612
  color: $selected-text;
30844
30613
  background-color: $selected-bg;
@@ -30894,20 +30663,14 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
30894
30663
  }
30895
30664
 
30896
30665
  // Selected state
30897
- &.k-state-selected .k-grid-content-sticky,
30898
30666
  &.k-selected .k-grid-content-sticky,
30899
- &.k-state-selected .k-grid-row-sticky,
30900
30667
  &.k-selected .k-grid-row-sticky,
30901
- td.k-grid-content-sticky.k-state-selected,
30902
30668
  td.k-grid-content-sticky.k-selected {
30903
30669
  @include fill( $bg: $grid-sticky-selected-bg );
30904
30670
  }
30905
30671
 
30906
- &.k-state-selected.k-alt .k-grid-content-sticky,
30907
30672
  &.k-selected.k-alt .k-grid-content-sticky,
30908
- &.k-state-selected.k-alt .k-grid-row-sticky,
30909
30673
  &.k-selected.k-alt .k-grid-row-sticky,
30910
- &.k-alt td.k-grid-content-sticky.k-state-selected,
30911
30674
  &.k-alt td.k-grid-content-sticky.k-selected {
30912
30675
  @include fill( $bg: $grid-sticky-selected-alt-bg );
30913
30676
  }
@@ -30916,26 +30679,18 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
30916
30679
  // Hovered state
30917
30680
  &:hover .k-grid-content-sticky,
30918
30681
  &:hover .k-grid-row-sticky,
30919
- &.k-state-hover .k-grid-content-sticky,
30920
30682
  &.k-hover .k-grid-content-sticky,
30921
- &.k-state-hover .k-grid-row-sticky,
30922
30683
  &.k-hover .k-grid-row-sticky {
30923
30684
  background-color: $grid-sticky-hovered-bg;
30924
30685
  }
30925
30686
 
30926
30687
 
30927
30688
  // Selected hover
30928
- &.k-state-selected:hover .k-grid-content-sticky,
30929
30689
  &.k-selected:hover .k-grid-content-sticky,
30930
- &.k-state-selected:hover .k-grid-row-sticky,
30931
30690
  &.k-selected:hover .k-grid-row-sticky,
30932
- &.k-state-selected.k-state-hover .k-grid-content-sticky,
30933
30691
  &.k-selected.k-hover .k-grid-content-sticky,
30934
- &.k-state-selected.k-state-hover .k-grid-row-sticky,
30935
30692
  &.k-selected.k-hover .k-grid-row-sticky,
30936
- &:hover td.k-grid-content-sticky.k-state-selected,
30937
30693
  &:hover td.k-grid-content-sticky.k-selected,
30938
- &.k-state-hover td.k-grid-content-sticky.k-state-selected,
30939
30694
  &.k-hover td.k-grid-content-sticky.k-selected {
30940
30695
  background-color: $grid-sticky-selected-hovered-bg;
30941
30696
  }
@@ -30949,7 +30704,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
30949
30704
  background-color: $grid-sticky-bg;
30950
30705
 
30951
30706
  &:hover,
30952
- &.k-state-hover,
30953
30707
  &.k-hover {
30954
30708
  background-color: $grid-sticky-hovered-bg;
30955
30709
  }
@@ -30963,7 +30717,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
30963
30717
  }
30964
30718
 
30965
30719
  &:hover td,
30966
- &.k-state-hover td,
30967
30720
  &.k-hover td {
30968
30721
  background-color: $grid-sticky-hovered-bg;
30969
30722
  }
@@ -30975,66 +30728,43 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
30975
30728
  }
30976
30729
 
30977
30730
  // Selected state
30978
- tr.k-state-selected .k-grid-content-sticky,
30979
30731
  tr.k-selected .k-grid-content-sticky,
30980
- .k-state-selected.k-grid-row-sticky td,
30981
30732
  .k-selected.k-grid-row-sticky td,
30982
- .k-grid-row-sticky td.k-state-selected,
30983
30733
  .k-grid-row-sticky td.k-selected,
30984
- .k-state-selected.k-grid-content-sticky,
30985
30734
  .k-selected.k-grid-content-sticky {
30986
30735
  @include fill( $bg: $grid-sticky-selected-bg );
30987
30736
  }
30988
30737
 
30989
- tr.k-state-selected.k-alt .k-grid-content-sticky,
30990
30738
  tr.k-selected.k-alt .k-grid-content-sticky,
30991
- .k-state-selected.k-alt.k-grid-row-sticky td,
30992
30739
  .k-selected.k-alt.k-grid-row-sticky td,
30993
- .k-alt .k-state-selected.k-grid-content-sticky,
30994
30740
  .k-alt .k-selected.k-grid-content-sticky {
30995
30741
  @include fill( $bg: $grid-sticky-selected-alt-bg );
30996
30742
  }
30997
30743
 
30998
30744
  // Hover state
30999
30745
  tr:hover .k-grid-content-sticky,
31000
- tr.k-state-hover .k-grid-content-sticky,
31001
30746
  tr.k-hover .k-grid-content-sticky,
31002
30747
  .k-grid-row-sticky:hover td,
31003
- .k-grid-row-sticky.k-state-hover td,
31004
30748
  .k-grid-row-sticky.k-hover td,
31005
30749
  .k-grid-row-sticky.k-alt:hover td,
31006
- .k-grid-row-sticky.k-alt.k-state-hover td,
31007
30750
  .k-grid-row-sticky.k-alt.k-hover td,
31008
30751
  .k-alt:hover .k-grid-content-sticky,
31009
- .k-alt.k-state-hover .k-grid-content-sticky,
31010
30752
  .k-alt.k-hover .k-grid-content-sticky {
31011
30753
  background-color: $grid-sticky-hovered-bg;
31012
30754
  }
31013
30755
 
31014
30756
  // Selected + Hover
31015
- tr.k-state-selected:hover .k-grid-content-sticky,
31016
30757
  tr.k-selected:hover .k-grid-content-sticky,
31017
- tr.k-state-selected.k-state-hover .k-grid-content-sticky,
31018
30758
  tr.k-selected.k-hover .k-grid-content-sticky,
31019
- .k-state-selected.k-grid-row-sticky:hover td,
31020
30759
  .k-selected.k-grid-row-sticky:hover td,
31021
- .k-state-selected.k-grid-row-sticky.k-state-hover td,
31022
30760
  .k-selected.k-grid-row-sticky.k-hover td,
31023
- .k-state-selected.k-alt.k-grid-row-sticky:hover td,
31024
30761
  .k-selected.k-alt.k-grid-row-sticky:hover td,
31025
- .k-state-selected.k-alt.k-grid-row-sticky.k-state-hover td,
31026
30762
  .k-selected.k-alt.k-grid-row-sticky.k-hover td,
31027
- tr.k-state-selected.k-alt:hover .k-grid-content-sticky,
31028
30763
  tr.k-selected.k-alt:hover .k-grid-content-sticky,
31029
- tr.k-state-selected.k-alt.k-state-hover .k-grid-content-sticky,
31030
30764
  tr.k-selected.k-alt.k-hover .k-grid-content-sticky,
31031
- .k-grid-row-sticky:hover td.k-state-selected,
31032
30765
  .k-grid-row-sticky:hover td.k-selected,
31033
- .k-grid-row-sticky.k-state-hover td.k-state-selected,
31034
30766
  .k-grid-row-sticky.k-hover td.k-selected,
31035
- tr:hover .k-grid-content-sticky.k-state-selected,
31036
30767
  tr:hover .k-grid-content-sticky.k-selected,
31037
- tr.k-state-hover .k-grid-content-sticky.k-state-selected,
31038
30768
  tr.k-hover .k-grid-content-sticky.k-selected {
31039
30769
  background-color: $grid-sticky-selected-hovered-bg;
31040
30770
  }
@@ -31046,7 +30776,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
31046
30776
  }
31047
30777
 
31048
30778
  &:hover .k-grid-content-sticky,
31049
- &.k-state-hover .k-grid-content-sticky,
31050
30779
  &.k-hover .k-grid-content-sticky {
31051
30780
  @include fill( $bg: $grid-sticky-hovered-bg );
31052
30781
  }
@@ -31060,13 +30789,11 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
31060
30789
  );
31061
30790
  }
31062
30791
  .k-columnmenu-item:focus,
31063
- .k-columnmenu-item.k-state-focus,
31064
30792
  .k-columnmenu-item.k-focus {
31065
30793
  @include box-shadow( $kendo-list-item-focus-shadow );
31066
30794
  }
31067
30795
 
31068
30796
  .k-columnmenu-item {
31069
- &.k-state-selected,
31070
30797
  &.k-selected {
31071
30798
  @include fill(
31072
30799
  $kendo-list-item-selected-text,
@@ -31092,7 +30819,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
31092
30819
  );
31093
30820
 
31094
30821
  &:hover,
31095
- &.k-state-hover,
31096
30822
  &.k-hover {
31097
30823
  @include fill(
31098
30824
  $kendo-list-item-hover-text,
@@ -31100,7 +30826,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
31100
30826
  );
31101
30827
  }
31102
30828
 
31103
- &.k-state-selected,
31104
30829
  &.k-selected {
31105
30830
  @include fill(
31106
30831
  $kendo-list-item-selected-text,
@@ -31109,7 +30834,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
31109
30834
  }
31110
30835
 
31111
30836
  &:focus,
31112
- &.k-state-focused,
31113
30837
  &.k-focus {
31114
30838
  @include box-shadow( $kendo-list-item-focus-shadow );
31115
30839
  }
@@ -31351,7 +31075,6 @@ $listview-item-focus-shadow: inset 0 0 0 2px rgba(0, 0, 0, .13) !default;
31351
31075
  // Listview content
31352
31076
  .k-listview-content {
31353
31077
 
31354
- > .k-state-focused,
31355
31078
  > .k-focus {
31356
31079
  @include fill(
31357
31080
  $listview-item-focus-text,
@@ -31361,7 +31084,6 @@ $listview-item-focus-shadow: inset 0 0 0 2px rgba(0, 0, 0, .13) !default;
31361
31084
  @include box-shadow( $listview-item-focus-shadow );
31362
31085
  }
31363
31086
 
31364
- > .k-state-selected,
31365
31087
  > .k-selected {
31366
31088
  @include fill(
31367
31089
  $listview-item-selected-text,
@@ -31573,7 +31295,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
31573
31295
  [data-tool="merge"],
31574
31296
  [data-tool="freeze"] {
31575
31297
  width: auto;
31576
- min-width: $form-line-height * 1em;
31298
+ min-width: calc( #{$form-line-height} * 1em );
31577
31299
  }
31578
31300
 
31579
31301
  .k-color-picker {
@@ -31742,7 +31464,6 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
31742
31464
  overflow: hidden;
31743
31465
 
31744
31466
  // disabled cells in the Spreadsheet should allow navigation if link is used
31745
- .k-state-disabled,
31746
31467
  .k-disabled {
31747
31468
  pointer-events: auto;
31748
31469
  }
@@ -32304,7 +32025,6 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
32304
32025
  background-position: 50% 50%;
32305
32026
 
32306
32027
  &:hover div,
32307
- &.k-state-hovered div,
32308
32028
  &.k-hover div {
32309
32029
  margin: 0;
32310
32030
  align-self: center;
@@ -32370,7 +32090,6 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
32370
32090
  .k-spreadsheet-insert-image-dialog {
32371
32091
  .k-spreadsheet-has-image {
32372
32092
  &:hover,
32373
- &.k-state-hovered,
32374
32093
  &.k-hover {
32375
32094
  border-radius: $spreadsheet-insert-image-dialog-preview-overlay-border-radius;
32376
32095
  }
@@ -32550,7 +32269,6 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
32550
32269
  );
32551
32270
  }
32552
32271
 
32553
- &.k-state-active,
32554
32272
  &.k-active {
32555
32273
  @include fill(
32556
32274
  $kendo-button-active-text,
@@ -32568,7 +32286,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
32568
32286
  > .k-menu,
32569
32287
  > .k-menu:not(.k-context-menu) {
32570
32288
 
32571
- .k-item.k-state-hover,
32289
+ .k-item:hover,
32572
32290
  .k-item.k-hover {
32573
32291
  @include fill(
32574
32292
  $kendo-list-item-hover-text,
@@ -32599,7 +32317,6 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
32599
32317
  .k-button {}
32600
32318
 
32601
32319
  .k-button:hover,
32602
- .k-button.k-state-hover,
32603
32320
  .k-button.k-hover {
32604
32321
  @include fill(
32605
32322
  $kendo-list-item-hover-text,
@@ -32607,9 +32324,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
32607
32324
  );
32608
32325
  }
32609
32326
  .k-button:active,
32610
- .k-button.k-state-active,
32611
32327
  .k-button.k-active,
32612
- .k-button.k-state-selected,
32613
32328
  .k-button.k-selected {
32614
32329
  @include fill(
32615
32330
  $kendo-list-item-selected-text,
@@ -32631,13 +32346,11 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
32631
32346
 
32632
32347
  .k-spreadsheet-has-image {
32633
32348
  &:hover,
32634
- &.k-state-hovered,
32635
32349
  &.k-hover {
32636
32350
  box-shadow: $spreadsheet-insert-image-dialog-preview-overlay-shadow;
32637
32351
  }
32638
32352
 
32639
32353
  &:hover div,
32640
- &.k-state-hovered div,
32641
32354
  &.k-hover div {
32642
32355
  color: $spreadsheet-insert-image-dialog-overlay-hovered-text;
32643
32356
  }
@@ -32908,6 +32621,10 @@ $pivotgrid-remove-text: null !default;
32908
32621
  border-right-width: $pivotgrid-cell-border-width;
32909
32622
  border-bottom-style: solid;
32910
32623
  border-bottom-width: $pivotgrid-cell-border-width;
32624
+
32625
+ &:focus {
32626
+ outline: none;
32627
+ }
32911
32628
  }
32912
32629
 
32913
32630
 
@@ -32978,6 +32695,10 @@ $pivotgrid-remove-text: null !default;
32978
32695
  white-space: nowrap;
32979
32696
  vertical-align: top;
32980
32697
  overflow: hidden;
32698
+
32699
+ &:focus {
32700
+ outline: none;
32701
+ }
32981
32702
  }
32982
32703
 
32983
32704
  .k-pivotgrid-cell .k-icon {
@@ -33598,15 +33319,12 @@ $pivotgrid-remove-text: null !default;
33598
33319
 
33599
33320
 
33600
33321
  // Hover state
33601
- .k-pivotgrid-row-headers tbody > .k-pivotgrid-row.k-state-hover,
33602
- .k-pivotgrid-row-headers tbody > .k-pivotgrid-row.k-hover,
33603
33322
  .k-pivotgrid-row-headers tbody > .k-pivotgrid-row:hover,
33604
- .k-pivotgrid-column-headers tbody > .k-pivotgrid-row.k-state-hover,
33605
- .k-pivotgrid-column-headers tbody > .k-pivotgrid-row.k-hover,
33323
+ .k-pivotgrid-row-headers tbody > .k-pivotgrid-row.k-hover,
33606
33324
  .k-pivotgrid-column-headers tbody > .k-pivotgrid-row:hover,
33607
- .k-pivotgrid-values tbody > .k-pivotgrid-row.k-state-hover,
33608
- .k-pivotgrid-values tbody > .k-pivotgrid-row.k-hover,
33609
- .k-pivotgrid-values tbody > .k-pivotgrid-row:hover {
33325
+ .k-pivotgrid-column-headers tbody > .k-pivotgrid-row.k-hover,
33326
+ .k-pivotgrid-values tbody > .k-pivotgrid-row:hover,
33327
+ .k-pivotgrid-values tbody > .k-pivotgrid-row.k-hover {
33610
33328
  @include fill (
33611
33329
  $pivotgrid-hover-text,
33612
33330
  $pivotgrid-hover-bg,
@@ -33615,9 +33333,10 @@ $pivotgrid-remove-text: null !default;
33615
33333
  }
33616
33334
 
33617
33335
  // Focus state
33618
- .k-pivotgrid-cell.k-state-focus,
33619
- .k-pivotgrid-cell.k-focus,
33620
33336
  .k-pivotgrid-cell:focus,
33337
+ .k-pivotgrid-cell.k-focus,
33338
+ .k-pivotgrid-empty-cell:focus,
33339
+ .k-pivotgrid-empty-cell.k-focus,
33621
33340
  .k-master-row > .k-pivotgrid-cell:focus,
33622
33341
  .k-grouping-row > .k-pivotgrid-cell:focus,
33623
33342
  .k-detail-row > .k-pivotgrid-cell:focus,
@@ -33626,9 +33345,7 @@ $pivotgrid-remove-text: null !default;
33626
33345
  }
33627
33346
 
33628
33347
  // Selected state
33629
- .k-pivotgrid-cell.k-state-selected,
33630
33348
  .k-pivotgrid-cell.k-selected,
33631
- .k-pivotgrid-row.k-state-selected > .k-pivotgrid-cell,
33632
33349
  .k-pivotgrid-row.k-selected > .k-pivotgrid-cell {
33633
33350
  @include fill (
33634
33351
  $pivotgrid-selected-text,
@@ -33860,7 +33577,6 @@ $treelist-footer-row-border-width: 1px !default;
33860
33577
  }
33861
33578
 
33862
33579
  .k-treelist-dragging,
33863
- .k-treelist-dragging .k-state-hover,
33864
33580
  .k-treelist-dragging .k-hover {
33865
33581
  cursor: default;
33866
33582
  }
@@ -34591,7 +34307,6 @@ $filemanager-preview-icon-border: null !default;
34591
34307
  );
34592
34308
  }
34593
34309
 
34594
- &.k-state-selected .k-file-icon,
34595
34310
  &.k-selected .k-file-icon {
34596
34311
  @include fill(
34597
34312
  inherit,
@@ -34960,10 +34675,8 @@ $taskboard-drag-placeholder-border: $component-border !default;
34960
34675
 
34961
34676
  &:focus,
34962
34677
  &.k-focus,
34963
- &.k-state-focus,
34964
34678
  &:hover,
34965
- &.k-hover,
34966
- &.k-state-hover {
34679
+ &.k-hover {
34967
34680
  text-decoration: underline;
34968
34681
  }
34969
34682
  }
@@ -35055,7 +34768,6 @@ $taskboard-drag-placeholder-border: $component-border !default;
35055
34768
  );
35056
34769
  }
35057
34770
  .k-taskboard-column:focus,
35058
- .k-taskboard-column.k-state-focus,
35059
34771
  .k-taskboard-column.k-focus {
35060
34772
  @include fill(
35061
34773
  $taskboard-column-focus-text,
@@ -35094,39 +34806,33 @@ $taskboard-drag-placeholder-border: $component-border !default;
35094
34806
  @include fill( $color: $taskboard-card-header-text );
35095
34807
 
35096
34808
  &:focus,
35097
- &.k-focus,
35098
- &.k-state-focus {
34809
+ &.k-focus {
35099
34810
  @include fill( $color: $taskboard-card-header-focus-text );
35100
34811
  }
35101
34812
 
35102
34813
  &:hover,
35103
- &.k-hover,
35104
- &.k-state-hover {
34814
+ &.k-hover {
35105
34815
  @include fill( $color: $taskboard-card-header-hover-text );
35106
34816
  }
35107
34817
  }
35108
34818
 
35109
34819
  &:focus,
35110
- &.k-focus,
35111
- &.k-state-focus {
34820
+ &.k-focus {
35112
34821
  @include fill( $border: $taskboard-card-focus-border );
35113
34822
  @include box-shadow( $taskboard-card-focus-shadow );
35114
34823
  }
35115
34824
 
35116
34825
  &:hover,
35117
- &.k-hover,
35118
- &.k-state-hover {
34826
+ &.k-hover {
35119
34827
  @include fill( $border: $taskboard-card-hover-border );
35120
34828
  }
35121
34829
 
35122
- &.k-selected,
35123
- &.k-state-selected {
34830
+ &.k-selected {
35124
34831
  @include fill( $border: $taskboard-card-selected-border );
35125
34832
  @include box-shadow( $taskboard-card-selected-shadow );
35126
34833
  }
35127
34834
 
35128
- &.k-disabled,
35129
- &.k-state-disabled {
34835
+ &.k-disabled {
35130
34836
  @include disabled( $disabled-styling );
35131
34837
  }
35132
34838
  }
@@ -35258,7 +34964,6 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
35258
34964
  pointer-events: auto;
35259
34965
  }
35260
34966
 
35261
- .k-editor-content.k-state-focused,
35262
34967
  .k-editor-content.k-focus {
35263
34968
  outline-width: 1px;
35264
34969
  outline-style: dashed;
@@ -35713,7 +35418,6 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
35713
35418
  display: block;
35714
35419
  margin: auto;
35715
35420
 
35716
- &.k-state-selected,
35717
35421
  &.k-selected {
35718
35422
  color: inherit;
35719
35423
  border-width: 0;
@@ -35936,7 +35640,6 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
35936
35640
 
35937
35641
  kendo-editor {
35938
35642
  &.k-readonly {
35939
- .k-editor-content.k-state-focused,
35940
35643
  .k-editor-content.k-focus {
35941
35644
  outline-color: $body-text;
35942
35645
  }
@@ -35974,7 +35677,7 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
35974
35677
 
35975
35678
  // Hover & Actve state
35976
35679
  &:hover,
35977
- &.k-state-active,
35680
+ &.k-active,
35978
35681
  &.k-active {
35979
35682
  border-color: $panel-border;
35980
35683
  }
@@ -35992,7 +35695,6 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
35992
35695
 
35993
35696
  // Insert table
35994
35697
  .k-ct-popup {
35995
- .k-state-selected,
35996
35698
  .k-selected {
35997
35699
  @include fill( $selected-text, $selected-bg, $selected-border, none );
35998
35700
  }
@@ -36505,7 +36207,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
36505
36207
  }
36506
36208
 
36507
36209
  &.k-gantt-planned .k-grid-content tr {
36508
- height: calc( #{$line-height-em * 1.7} + #{$grid-cell-padding-y * 2} + #{$grid-cell-horizontal-border-width} );
36210
+ height: calc( #{$line-height-em} * 1.7 + #{$grid-cell-padding-y * 2} + #{$grid-cell-horizontal-border-width} );
36509
36211
  }
36510
36212
 
36511
36213
  // Layout
@@ -36550,7 +36252,6 @@ $gantt-validation-tooltip-invalid-border: $error !default;
36550
36252
  }
36551
36253
  }
36552
36254
 
36553
- tr.k-state-selected > td:last-child,
36554
36255
  tr.k-selected > td:last-child {
36555
36256
  background: transparent;
36556
36257
  }
@@ -36729,7 +36430,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
36729
36430
  padding: 0 !important; // sass-lint:disable-line no-important
36730
36431
  }
36731
36432
  .k-grid-header tr {
36732
- height: calc( #{$line-height-em * 2} + #{$grid-header-padding-y * 4} + 2px );
36433
+ height: calc( #{$line-height-em} * 2 + #{$grid-header-padding-y * 4} + 2px );
36733
36434
  vertical-align: bottom;
36734
36435
  }
36735
36436
  .k-grid-content {
@@ -36820,7 +36521,6 @@ $gantt-validation-tooltip-invalid-border: $error !default;
36820
36521
  border-color: currentColor;
36821
36522
  position: absolute;
36822
36523
  }
36823
- .k-gantt-line.k-state-selected,
36824
36524
  .k-gantt-line.k-selected {
36825
36525
  z-index: 3;
36826
36526
  }
@@ -36894,7 +36594,6 @@ $gantt-validation-tooltip-invalid-border: $error !default;
36894
36594
  transform: translate(-50%, -50%);
36895
36595
  }
36896
36596
  .k-task-dot:hover::before,
36897
- .k-task-dot.k-state-hover::before,
36898
36597
  .k-task-dot.k-hover::before {
36899
36598
  border-width: 1px;
36900
36599
  }
@@ -37368,7 +37067,6 @@ $gantt-validation-tooltip-invalid-border: $error !default;
37368
37067
  $border: $gantt-milestone-border
37369
37068
  );
37370
37069
  }
37371
- .k-task-milestone.k-state-selected .k-task-milestone-content,
37372
37070
  .k-task-milestone.k-selected .k-task-milestone-content {
37373
37071
  @include fill(
37374
37072
  $bg: $gantt-milestone-selected-bg,
@@ -37383,7 +37081,6 @@ $gantt-validation-tooltip-invalid-border: $error !default;
37383
37081
  stroke: $gantt-line-fill;
37384
37082
  }
37385
37083
 
37386
- polyline.k-state-selected,
37387
37084
  polyline.k-selected {
37388
37085
  stroke: $gantt-line-selected-fill;
37389
37086
  }
@@ -37437,7 +37134,6 @@ $gantt-validation-tooltip-invalid-border: $error !default;
37437
37134
  );
37438
37135
  }
37439
37136
  .k-task-dot:hover::before,
37440
- .k-task-dot.k-state-hover::before,
37441
37137
  .k-task-dot.k-hover::before {
37442
37138
  @include fill(
37443
37139
  $bg: $gantt-dot-hover-bg,
@@ -37463,7 +37159,6 @@ $gantt-validation-tooltip-invalid-border: $error !default;
37463
37159
  );
37464
37160
  }
37465
37161
  }
37466
- .k-task-milestone.k-state-selected,
37467
37162
  .k-task-milestone.k-selected {
37468
37163
  background-image: none;
37469
37164
  @include fill(
@@ -37494,7 +37189,6 @@ $gantt-validation-tooltip-invalid-border: $error !default;
37494
37189
  .k-task-advanced .k-task-summary-complete {
37495
37190
  color: $gantt-advanced-bg;
37496
37191
  }
37497
- .k-task-summary.k-state-selected,
37498
37192
  .k-task-summary.k-selected {
37499
37193
  color: $gantt-summary-selected-bg;
37500
37194
 
@@ -37538,7 +37232,6 @@ $gantt-validation-tooltip-invalid-border: $error !default;
37538
37232
  $bg: $gantt-advanced-bg
37539
37233
  );
37540
37234
  }
37541
- .k-task-single.k-state-selected,
37542
37235
  .k-task-single.k-selected {
37543
37236
  @include fill(
37544
37237
  $gantt-task-selected-text,
@@ -37555,7 +37248,6 @@ $gantt-validation-tooltip-invalid-border: $error !default;
37555
37248
  .k-gantt-line {
37556
37249
  color: $gantt-line-fill;
37557
37250
  }
37558
- .k-gantt-line.k-state-selected,
37559
37251
  .k-gantt-line.k-selected {
37560
37252
  color: $gantt-line-selected-fill;
37561
37253
  }
@@ -38214,7 +37906,6 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
38214
37906
  }
38215
37907
 
38216
37908
  &:hover,
38217
- &.k-state-hover,
38218
37909
  &.k-hover {
38219
37910
  .k-event-delete {
38220
37911
  opacity: 1;
@@ -38280,7 +37971,6 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
38280
37971
 
38281
37972
  // Hover
38282
37973
  &:hover,
38283
- &.k-state-hover,
38284
37974
  &.k-hover {
38285
37975
  .k-event-actions .k-event-delete,
38286
37976
  .k-resize-handle {
@@ -38538,11 +38228,9 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
38538
38228
  opacity: .5;
38539
38229
  visibility: hidden;
38540
38230
  }
38541
- .k-state-hover .k-task > .k-event-delete,
38542
38231
  .k-hover .k-task > .k-event-delete,
38543
38232
  .k-scheduler-content tr:hover .k-event-delete,
38544
38233
  .k-scheduler-content .k-scheduler-row:hover .k-event-delete,
38545
- .k-scheduler-content .k-scheduler-row.k-state-hover .k-event-delete,
38546
38234
  .k-scheduler-content .k-scheduler-row.k-hover .k-event-delete {
38547
38235
  visibility: visible;
38548
38236
  }
@@ -38616,7 +38304,6 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
38616
38304
  position: relative;
38617
38305
  }
38618
38306
 
38619
- td.k-state-selected,
38620
38307
  td.k-selected {
38621
38308
  background-color: inherit;
38622
38309
  }
@@ -38966,9 +38653,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
38966
38653
  );
38967
38654
  }
38968
38655
 
38969
- .k-scheduler-layout td.k-state-selected,
38970
38656
  .k-scheduler-layout td.k-selected,
38971
- .k-scheduler-layout .k-scheduler-cell.k-state-selected,
38972
38657
  .k-scheduler-layout .k-scheduler-cell.k-selected {
38973
38658
  background-color: rgba($selected-bg, .25);
38974
38659
  }
@@ -38991,7 +38676,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
38991
38676
  );
38992
38677
  @include box-shadow( $scheduler-event-shadow );
38993
38678
 
38994
- &.k-state-hover,
38679
+ &:hover,
38995
38680
  &.k-hover {
38996
38681
  @include fill(
38997
38682
  $scheduler-event-hover-text,
@@ -39002,7 +38687,6 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
39002
38687
  @include box-shadow( $scheduler-event-hover-shadow );
39003
38688
  }
39004
38689
 
39005
- &.k-state-selected,
39006
38690
  &.k-selected {
39007
38691
  @include fill(
39008
38692
  $scheduler-event-selected-text,
@@ -39069,10 +38753,8 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
39069
38753
 
39070
38754
  // Hover
39071
38755
  .k-scheduler-content tr:hover,
39072
- .k-scheduler-content tr.k-state-hover,
39073
38756
  .k-scheduler-content tr.k-hover,
39074
38757
  .k-scheduler-content .k-scheduler-row:hover,
39075
- .k-scheduler-content .k-scheduler-row.k-state-hover,
39076
38758
  .k-scheduler-content .k-scheduler-row.k-hover {
39077
38759
  @include fill(
39078
38760
  $hovered-text,
@@ -39084,9 +38766,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
39084
38766
 
39085
38767
  .k-scheduler-content tr:hover .k-scheduler-datecolumn,
39086
38768
  .k-scheduler-content tr:hover .k-scheduler-groupcolumn,
39087
- .k-scheduler-content tr.k-state-hover .k-scheduler-datecolumn,
39088
38769
  .k-scheduler-content tr.k-hover .k-scheduler-datecolumn,
39089
- .k-scheduler-content tr.k-state-hover .k-scheduler-groupcolumn,
39090
38770
  .k-scheduler-content tr.k-hover .k-scheduler-groupcolumn {
39091
38771
  @include fill(
39092
38772
  $scheduler-text,
@@ -39096,13 +38776,10 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
39096
38776
  }
39097
38777
 
39098
38778
  // Selected
39099
- .k-scheduler-content tr.k-state-selected,
39100
38779
  .k-scheduler-content tr.k-selected {
39101
38780
  background-color: rgba($selected-bg, .25);
39102
38781
  }
39103
- .k-scheduler-content tr.k-state-selected .k-scheduler-datecolumn,
39104
38782
  .k-scheduler-content tr.k-selected .k-scheduler-datecolumn,
39105
- .k-scheduler-content tr.k-state-selected .k-scheduler-groupcolumn,
39106
38783
  .k-scheduler-content tr.k-selected .k-scheduler-groupcolumn {
39107
38784
  background-color: $scheduler-bg;
39108
38785
  }
@@ -39120,7 +38797,6 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
39120
38797
  @include fill( $bg: $scheduler-yearview-indicator-bg );
39121
38798
  }
39122
38799
 
39123
- .k-state-selected .k-day-indicator,
39124
38800
  .k-selected .k-day-indicator {
39125
38801
  @include fill( $bg: $scheduler-yearview-indicator-selected-bg );
39126
38802
  }
@@ -39424,7 +39100,6 @@ $chat-quick-reply-hover-border: $primary !default;
39424
39100
 
39425
39101
 
39426
39102
  // Message states
39427
- .k-message.k-state-selected,
39428
39103
  .k-message.k-selected {
39429
39104
  margin-bottom: $chat-item-spacing-y;
39430
39105
  border: 0;
@@ -39553,7 +39228,6 @@ $chat-quick-reply-hover-border: $primary !default;
39553
39228
  align-items: center;
39554
39229
 
39555
39230
  &:focus,
39556
- &.k-state-focus,
39557
39231
  &.k-focus,
39558
39232
  &:focus-within {
39559
39233
  outline: 0;
@@ -39634,7 +39308,6 @@ $chat-quick-reply-hover-border: $primary !default;
39634
39308
  flex: 0 0 auto;
39635
39309
  }
39636
39310
 
39637
- &.k-state-selected,
39638
39311
  &.k-selected {
39639
39312
  background: none;
39640
39313
  }
@@ -39871,7 +39544,6 @@ $chat-quick-reply-hover-border: $primary !default;
39871
39544
  .k-bubble:hover {
39872
39545
  @include box-shadow( $chat-bubble-hover-shadow );
39873
39546
  }
39874
- .k-state-selected .k-bubble,
39875
39547
  .k-selected .k-bubble {
39876
39548
  @include box-shadow( $chat-bubble-selected-shadow );
39877
39549
  }
@@ -39887,7 +39559,6 @@ $chat-quick-reply-hover-border: $primary !default;
39887
39559
  .k-alt .k-bubble:hover {
39888
39560
  @include box-shadow( $chat-alt-bubble-hover-shadow );
39889
39561
  }
39890
- .k-alt .k-state-selected .k-bubble,
39891
39562
  .k-alt .k-selected .k-bubble {
39892
39563
  @include box-shadow( $chat-alt-bubble-selected-shadow );
39893
39564
  }
@@ -40686,7 +40357,6 @@ $timeline-event-min-height-calc: calc(2 * (#{$timeline-track-event-offset} - #{$
40686
40357
  color: $body-text;
40687
40358
  }
40688
40359
 
40689
- .k-timeline-arrow.k-state-disabled,
40690
40360
  .k-timeline-arrow.k-disabled {
40691
40361
  opacity: 1; // The arrow button in disabled mode should have a solid background
40692
40362
  color: $timeline-track-arrow-disabled-text;
@@ -40707,7 +40377,6 @@ $timeline-event-min-height-calc: calc(2 * (#{$timeline-track-event-offset} - #{$
40707
40377
  background-color: $timeline-flag-bg;
40708
40378
  }
40709
40379
 
40710
- .k-timeline-track-item.k-state-focus .k-timeline-circle,
40711
40380
  .k-timeline-track-item.k-focus .k-timeline-circle {
40712
40381
  @include box-shadow( $timeline-track-item-focus-shadow );
40713
40382
  }
@@ -40965,7 +40634,7 @@ $pdf-viewer-icon-size: calc( #{$icon-size} * 3 ) !default;
40965
40634
 
40966
40635
  .k-pdf-viewer-canvas > .k-search-panel {
40967
40636
  width: max-content;
40968
- margin-top: calc( (#{$kendo-button-calc-size} + #{$pdf-viewer-search-panel-border-width} + ( 2 * #{$pdf-viewer-search-dialog-padding-y} )) * -1 );
40637
+ margin-top: calc( (#{$kendo-button-calc-size} + ( 2 * #{$pdf-viewer-search-panel-border-width} ) + ( 2 * #{$pdf-viewer-search-dialog-padding-y} )) * -1 );
40969
40638
  border-width: $pdf-viewer-search-panel-border-width;
40970
40639
  border-style: solid;
40971
40640
  border-radius: $pdf-viewer-search-panel-border-radius;
@@ -41514,7 +41183,6 @@ $scrollview-transition-timing-function: ease-in-out !default;
41514
41183
  -webkit-tap-highlight-color: $scrollview-arrow-tap-highlight-color;
41515
41184
 
41516
41185
  &:focus,
41517
- &.k-state-focus,
41518
41186
  &.k-focus {
41519
41187
  color: $scrollview-navigation-color;
41520
41188
  opacity: $scrollview-navigation-hover-opacity;
@@ -41525,7 +41193,6 @@ $scrollview-transition-timing-function: ease-in-out !default;
41525
41193
  }
41526
41194
 
41527
41195
  &:hover,
41528
- &.k-state-hover,
41529
41196
  &.k-hover {
41530
41197
  color: $scrollview-navigation-color;
41531
41198
  opacity: $scrollview-navigation-hover-opacity;
@@ -41545,14 +41212,12 @@ $scrollview-transition-timing-function: ease-in-out !default;
41545
41212
  }
41546
41213
 
41547
41214
  &:focus,
41548
- &.k-state-focused,
41549
41215
  &.k-focus {
41550
41216
  box-shadow: $scrollview-pagebutton-shadow;
41551
41217
  }
41552
41218
  }
41553
41219
 
41554
41220
  .k-scrollview-nav > .k-link:hover,
41555
- .k-scrollview-nav > .k-link.k-state-hover,
41556
41221
  .k-scrollview-nav > .k-link.k-hover {
41557
41222
  box-shadow: $scrollview-pagebutton-shadow;
41558
41223
  }
@@ -42371,7 +42036,7 @@ $treemap-line-height: $line-height !default;
42371
42036
  .k-leaf.k-inverse {
42372
42037
  color: $component-text;
42373
42038
  }
42374
- .k-leaf.k-state-hover,
42039
+ .k-leaf:hover,
42375
42040
  .k-leaf.k-hover {
42376
42041
  box-shadow: inset 0 0 0 3px $component-border;
42377
42042
  }
@@ -42853,8 +42518,7 @@ $orgchart-line-v-height: 25px !default;
42853
42518
  }
42854
42519
 
42855
42520
  &:focus,
42856
- &.k-focus,
42857
- &.k-state-focus {
42521
+ &.k-focus {
42858
42522
  @include box-shadow( $orgchart-card-focus-shadow );
42859
42523
  }
42860
42524
  }
@@ -42868,9 +42532,6 @@ $orgchart-line-v-height: 25px !default;
42868
42532
  );
42869
42533
  }
42870
42534
  .k-orgchart-node-group-container:focus,
42871
- .k-orgchart-node-group-container.k-focus,
42872
- .k-orgchart-node-group-container.k-state-focus,
42873
- .k-orgchart-node-group-container.k-state-focused,
42874
42535
  .k-orgchart-node-group-container.k-focus {
42875
42536
  @include box-shadow( $orgchart-node-group-focus-shadow );
42876
42537
  @include fill ( $border: $orgchart-node-group-focus-border );
@@ -42911,40 +42572,42 @@ $kendo-signature-height: 84px !default;
42911
42572
  $kendo-signature-maximized-width: 750px !default;
42912
42573
  $kendo-signature-maximized-height: 252px !default;
42913
42574
 
42914
- $kendo-signature-padding: map-get( $spacing, 1 ) !default;
42915
- $kendo-signature-padding-sm: map-get( $spacing, 1 ) - map-get( $spacing, thin ) !default;
42916
- $kendo-signature-padding-md: $kendo-signature-padding !default;
42917
- $kendo-signature-padding-lg: map-get( $spacing, 1 ) + map-get( $spacing, thin ) !default;
42575
+ $kendo-signature-padding-x: map-get( $spacing, 1 ) !default;
42576
+ $kendo-signature-padding-x-sm: map-get( $spacing, 1 ) - map-get($spacing, thin) !default;
42577
+ $kendo-signature-padding-x-md: $kendo-signature-padding-x !default;
42578
+ $kendo-signature-padding-x-lg: map-get( $spacing, 2 ) !default;
42579
+
42580
+ $kendo-signature-padding-y: $kendo-signature-padding-x !default;
42581
+ $kendo-signature-padding-y-sm: $kendo-signature-padding-x-sm !default;
42582
+ $kendo-signature-padding-y-md: $kendo-signature-padding-x-md !default;
42583
+ $kendo-signature-padding-y-lg: $kendo-signature-padding-x-lg !default;
42918
42584
 
42919
42585
  $kendo-signature-line-width: 1px !default;
42920
42586
  $kendo-signature-line-style: dashed !default;
42921
42587
  $kendo-signature-line-color: rgba( $info, .24 ) !default;
42922
42588
 
42923
- $kendo-signature-line-size: calc( 100% - 2 * #{$kendo-signature-padding} ) !default;
42924
- $kendo-signature-line-size-sm: calc( 100% - 2 * #{$kendo-signature-padding-sm} ) !default;
42925
- $kendo-signature-line-size-md: calc( 100% - 2 * #{$kendo-signature-padding-md} ) !default;
42926
- $kendo-signature-line-size-lg: calc( 100% - 2 * #{$kendo-signature-padding-lg} ) !default;
42589
+ $kendo-signature-line-size: calc( 100% - 2 * #{$kendo-signature-padding-x} ) !default;
42590
+ $kendo-signature-line-size-sm: calc( 100% - 2 * #{$kendo-signature-padding-x-sm} ) !default;
42591
+ $kendo-signature-line-size-md: calc( 100% - 2 * #{$kendo-signature-padding-x-md} ) !default;
42592
+ $kendo-signature-line-size-lg: calc( 100% - 2 * #{$kendo-signature-padding-x-lg} ) !default;
42927
42593
 
42928
- $kendo-signature-line-bottom-offset: calc( #{$kendo-button-calc-size} + #{$kendo-signature-padding} ) !default;
42929
- $kendo-signature-line-bottom-offset-sm: calc( #{$kendo-button-calc-size} + #{$kendo-signature-padding-sm} ) !default;
42930
- $kendo-signature-line-bottom-offset-md: calc( #{$kendo-button-calc-size} + #{$kendo-signature-padding-md} ) !default;
42931
- $kendo-signature-line-bottom-offset-lg: calc( #{$kendo-button-calc-size} + #{$kendo-signature-padding-lg} ) !default;
42594
+ $kendo-signature-line-bottom-offset: 33% !default;
42932
42595
 
42933
42596
  $kendo-signature-sizes: (
42934
42597
  sm: (
42935
- padding: $kendo-signature-padding-sm,
42936
- line-size: $kendo-signature-line-size-sm,
42937
- line-offset: $kendo-signature-line-bottom-offset-sm
42598
+ padding-x: $kendo-signature-padding-x-sm,
42599
+ padding-y: $kendo-signature-padding-y-sm,
42600
+ line-size: $kendo-signature-line-size-sm
42938
42601
  ),
42939
42602
  md: (
42940
- padding: $kendo-signature-padding-md,
42941
- line-size: $kendo-signature-line-size-md,
42942
- line-offset: $kendo-signature-line-bottom-offset-md
42603
+ padding-x: $kendo-signature-padding-x-md,
42604
+ padding-y: $kendo-signature-padding-y-md,
42605
+ line-size: $kendo-signature-line-size-md
42943
42606
  ),
42944
42607
  lg: (
42945
- padding: $kendo-signature-padding-lg,
42946
- line-size: $kendo-signature-line-size-lg,
42947
- line-offset: $kendo-signature-line-bottom-offset-lg
42608
+ padding-x: $kendo-signature-padding-x-lg,
42609
+ padding-y: $kendo-signature-padding-y-lg,
42610
+ line-size: $kendo-signature-line-size-lg
42948
42611
  )
42949
42612
  ) !default;
42950
42613
 
@@ -42958,7 +42621,7 @@ $kendo-signature-maximized-line-width: map-get( $spacing, 1 ) - map-get( $spacin
42958
42621
 
42959
42622
  .k-signature {
42960
42623
  width: $kendo-signature-width;
42961
- height: $kendo-signature-height;
42624
+ min-height: $kendo-signature-height;
42962
42625
  position: relative;
42963
42626
  box-sizing: border-box;
42964
42627
  display: flex;
@@ -42995,27 +42658,30 @@ $kendo-signature-maximized-line-width: map-get( $spacing, 1 ) - map-get( $spacin
42995
42658
 
42996
42659
  .k-signature-line {
42997
42660
  position: absolute;
42998
- z-index: 0;
42661
+ bottom: $kendo-signature-line-bottom-offset;
42662
+ z-index: 2;
42663
+ pointer-events: none;
42999
42664
  border-bottom-width: $kendo-signature-line-width;
43000
42665
  border-bottom-style: $kendo-signature-line-style;
43001
42666
  }
43002
42667
 
43003
42668
  // Sizes
43004
42669
  @each $size, $size-props in $kendo-signature-sizes {
43005
- $_padding: map-get($size-props, padding);
42670
+ $_padding-x: map-get($size-props, padding-x);
42671
+ $_padding-y: map-get($size-props, padding-y);
43006
42672
  $_line-size: map-get($size-props, line-size);
43007
42673
  $_line-offset: map-get($size-props, line-offset);
43008
42674
 
43009
42675
  .k-signature-#{$size} {
43010
- padding: $_padding;
42676
+ padding-inline: $_padding-x;
42677
+ padding-block: $_padding-y;
43011
42678
 
43012
42679
  .k-signature-line {
43013
42680
  width: $_line-size;
43014
- bottom: $_line-offset;
43015
42681
  }
43016
42682
  }
43017
-
43018
42683
  }
42684
+
43019
42685
  }
43020
42686
 
43021
42687
  // #endregion