@progress/kendo-theme-bootstrap 5.5.0 → 5.5.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.
Files changed (35) hide show
  1. package/dist/all.css +674 -437
  2. package/dist/all.scss +802 -374
  3. package/lib/swatches/bootstrap-3-dark.json +1 -1
  4. package/lib/swatches/bootstrap-3.json +1 -1
  5. package/lib/swatches/bootstrap-4-dark.json +1 -1
  6. package/lib/swatches/bootstrap-4.json +1 -1
  7. package/lib/swatches/bootstrap-dataviz-v4.json +1 -1
  8. package/lib/swatches/bootstrap-main-dark.json +1 -1
  9. package/lib/swatches/bootstrap-main.json +1 -1
  10. package/lib/swatches/bootstrap-nordic.json +1 -1
  11. package/lib/swatches/bootstrap-turquoise-dark.json +1 -1
  12. package/lib/swatches/bootstrap-turquoise.json +1 -1
  13. package/lib/swatches/bootstrap-urban.json +1 -1
  14. package/lib/swatches/bootstrap-vintage.json +1 -1
  15. package/package.json +8 -11
  16. package/scss/breadcrumb/_layout.scss +1 -1
  17. package/scss/breadcrumb/_theme.scss +1 -1
  18. package/scss/button/_variables.scss +36 -16
  19. package/scss/calendar/_variables.scss +44 -1
  20. package/scss/chip/_variables.scss +2 -2
  21. package/scss/grid/_theme.scss +25 -25
  22. package/scss/index.scss +1 -0
  23. package/scss/input/_variables.scss +21 -4
  24. package/scss/list/_variables.scss +8 -8
  25. package/scss/pager/_theme.scss +1 -1
  26. package/scss/progressbar/_variables.scss +5 -0
  27. package/scss/scrollview/_theme.scss +4 -4
  28. package/scss/signature/_index.scss +10 -0
  29. package/scss/signature/_layout.scss +1 -0
  30. package/scss/signature/_theme.scss +1 -0
  31. package/scss/signature/_variables.scss +45 -0
  32. package/scss/spreadsheet/_theme.scss +6 -6
  33. package/scss/tabstrip/_theme.scss +4 -4
  34. package/scss/timeselector/_variables.scss +38 -0
  35. package/scss/treeview/_variables.scss +5 -5
package/dist/all.scss CHANGED
@@ -8148,16 +8148,16 @@ $message-box-link-text-decoration: underline !default;
8148
8148
  /// Font size of the list component, if no size is set.
8149
8149
  /// @group list
8150
8150
  $kendo-list-font-size: null !default;
8151
- $kendo-list-font-size-sm: $font-size-md !default;
8151
+ $kendo-list-font-size-sm: $font-size-sm !default;
8152
8152
  $kendo-list-font-size-md: $font-size-md !default;
8153
8153
  $kendo-list-font-size-lg: $font-size-md !default;
8154
8154
 
8155
8155
  /// Line height of the list component, if no size is set.
8156
8156
  /// @group list
8157
8157
  $kendo-list-line-height: null !default;
8158
- $kendo-list-line-height-sm: null !default;
8159
- $kendo-list-line-height-md: null !default;
8160
- $kendo-list-line-height-lg: null !default;
8158
+ $kendo-list-line-height-sm: (20 / 14) !default;
8159
+ $kendo-list-line-height-md: $line-height-md !default;
8160
+ $kendo-list-line-height-lg: $line-height-md !default;
8161
8161
 
8162
8162
  /// Horizontal padding of list header, if no size is set.
8163
8163
  /// @group list
@@ -8171,9 +8171,9 @@ $kendo-list-header-padding-x-lg: map-get( $spacing, 4 ) !default;
8171
8171
  /// @group list
8172
8172
  $kendo-list-header-padding-y: null !default;
8173
8173
  $kendo-list-header-padding-y-base: map-get( $spacing, 1 ) !default;
8174
- $kendo-list-header-padding-y-sm: map-get( $spacing, 1 ) - map-get( $spacing, thin ) !default;
8174
+ $kendo-list-header-padding-y-sm: map-get( $spacing, 1 ) !default;
8175
8175
  $kendo-list-header-padding-y-md: map-get( $spacing, 1 ) !default;
8176
- $kendo-list-header-padding-y-lg: map-get( $spacing, 1 ) + map-get( $spacing, thin ) !default;
8176
+ $kendo-list-header-padding-y-lg: map-get( $spacing, 2 ) !default;
8177
8177
 
8178
8178
  /// Border width of list header.
8179
8179
  /// @group list
@@ -8209,9 +8209,9 @@ $kendo-list-item-padding-x-lg: map-get( $spacing, 4 ) !default;
8209
8209
  /// @group list
8210
8210
  $kendo-list-item-padding-y: null !default;
8211
8211
  $kendo-list-item-padding-y-base: map-get( $spacing, 1 ) !default;
8212
- $kendo-list-item-padding-y-sm: map-get( $spacing, 1 ) - map-get( $spacing, thin ) !default;
8212
+ $kendo-list-item-padding-y-sm: map-get( $spacing, 1 ) !default;
8213
8213
  $kendo-list-item-padding-y-md: map-get( $spacing, 1 ) !default;
8214
- $kendo-list-item-padding-y-lg: map-get( $spacing, 1 ) + map-get( $spacing, thin ) !default;
8214
+ $kendo-list-item-padding-y-lg: map-get( $spacing, 2 ) !default;
8215
8215
 
8216
8216
  /// Font size of list items, if no size is set.
8217
8217
  /// @group list
@@ -10124,34 +10124,33 @@ $kendo-button-border-radius: null !default;
10124
10124
  /// Horizontal padding of the button.
10125
10125
  /// @group button
10126
10126
  $kendo-button-padding-x: $btn-padding-x !default;
10127
- $kendo-button-padding-x-sm: $btn-padding-x !default;
10128
- $kendo-button-padding-x-md: $btn-padding-x !default;
10129
- $kendo-button-padding-x-lg: $btn-padding-x !default;
10130
-
10131
10127
  /// Vertical padding of the button.
10132
10128
  /// @group button
10133
10129
  $kendo-button-padding-y: $btn-padding-y !default;
10134
- $kendo-button-padding-y-sm: $btn-padding-y-sm !default;
10135
- $kendo-button-padding-y-md: $btn-padding-y !default;
10136
- $kendo-button-padding-y-lg: $btn-padding-y-lg !default;
10137
-
10138
10130
  /// Font family of the button.
10139
10131
  /// @group button
10140
10132
  $kendo-button-font-family: $font-family !default;
10141
-
10142
10133
  /// Font sizes of the button.
10143
10134
  /// @group button
10144
10135
  $kendo-button-font-size: $btn-font-size !default;
10145
- $kendo-button-font-size-sm: $btn-font-size !default;
10146
- $kendo-button-font-size-md: $btn-font-size !default;
10147
- $kendo-button-font-size-lg: $btn-font-size !default;
10148
-
10149
10136
  /// Line heights used along with $font-size.
10150
10137
  /// @group button
10151
10138
  $kendo-button-line-height: $btn-line-height !default;
10152
- $kendo-button-line-height-sm: $btn-line-height !default;
10153
- $kendo-button-line-height-md: $btn-line-height !default;
10154
- $kendo-button-line-height-lg: $btn-line-height !default;
10139
+
10140
+ $kendo-button-padding-x-sm: $btn-padding-x-sm !default;
10141
+ $kendo-button-padding-y-sm: $btn-padding-y-sm !default;
10142
+ $kendo-button-font-size-sm: $font-size-sm !default;
10143
+ $kendo-button-line-height-sm: ( 20 / 14 ) !default;
10144
+
10145
+ $kendo-button-padding-x-md: $btn-padding-x !default;
10146
+ $kendo-button-padding-y-md: $btn-padding-y !default;
10147
+ $kendo-button-font-size-md: $font-size-md !default;
10148
+ $kendo-button-line-height-md: $line-height-md !default;
10149
+
10150
+ $kendo-button-padding-x-lg: $btn-padding-x-lg !default;
10151
+ $kendo-button-padding-y-lg: $btn-padding-y-lg !default;
10152
+ $kendo-button-font-size-lg: $font-size-md !default;
10153
+ $kendo-button-line-height-lg: $line-height-md !default;
10155
10154
 
10156
10155
  /// Calculated height of the button.
10157
10156
  /// @group button
@@ -10161,6 +10160,27 @@ $kendo-button-calc-size: calc( #{$kendo-button-line-height * 1em} + #{$kendo-but
10161
10160
  /// @group button
10162
10161
  $kendo-button-inner-calc-size: calc( #{$kendo-button-line-height * 1em} + #{$kendo-button-padding-y * 2} ) !default;
10163
10162
 
10163
+ $kendo-button-sizes: (
10164
+ sm: (
10165
+ padding-x: $kendo-button-padding-x-sm,
10166
+ padding-y: $kendo-button-padding-y-sm,
10167
+ font-size: $kendo-button-font-size-sm,
10168
+ line-height: $kendo-button-line-height-sm
10169
+ ),
10170
+ md: (
10171
+ padding-x: $kendo-button-padding-x-md,
10172
+ padding-y: $kendo-button-padding-y-md,
10173
+ font-size: $kendo-button-font-size-md,
10174
+ line-height: $kendo-button-line-height-md
10175
+ ),
10176
+ lg: (
10177
+ padding-x: $kendo-button-padding-x-lg,
10178
+ padding-y: $kendo-button-padding-y-lg,
10179
+ font-size: $kendo-button-font-size-lg,
10180
+ line-height: $kendo-button-line-height-lg
10181
+ )
10182
+ ) !default;
10183
+
10164
10184
  /// Theme colors map for the button.
10165
10185
  /// @group button
10166
10186
  $kendo-button-theme-colors: map-merge(
@@ -10386,45 +10406,27 @@ $kendo-button-transition: $transition !default;
10386
10406
 
10387
10407
  .k-button-text {}
10388
10408
 
10389
- // Sizes
10390
- .k-button-sm {
10391
- padding: $kendo-button-padding-y-sm $kendo-button-padding-x-sm;
10392
- font-size: $kendo-button-font-size-sm;
10393
- line-height: $kendo-button-line-height-sm;
10394
- }
10395
- .k-button-md {
10396
- padding: $kendo-button-padding-y-md $kendo-button-padding-x-md;
10397
- font-size: $kendo-button-font-size-md;
10398
- line-height: $kendo-button-line-height-md;
10399
- }
10400
- .k-button-lg {
10401
- padding: $kendo-button-padding-y-lg $kendo-button-padding-x-lg;
10402
- font-size: $kendo-button-font-size-lg;
10403
- line-height: $kendo-button-line-height-lg;
10404
- }
10405
10409
 
10406
- .k-icon-button.k-button-sm {
10407
- padding: $kendo-button-padding-y-sm;
10410
+ // Sizes
10411
+ @each $size, $size-props in $kendo-button-sizes {
10412
+ $_padding-x: map-get( $size-props, padding-x );
10413
+ $_padding-y: map-get( $size-props, padding-y );
10414
+ $_font-size: map-get( $size-props, font-size );
10415
+ $_line-height: map-get( $size-props, line-height );
10408
10416
 
10409
- > .k-button-icon {
10410
- min-width: calc( #{$kendo-button-font-size-sm} * #{$kendo-button-line-height-sm} );
10411
- min-height: calc( #{$kendo-button-font-size-sm} * #{$kendo-button-line-height-sm} );
10417
+ .k-button-#{$size} {
10418
+ padding: $_padding-y $_padding-x;
10419
+ font-size: $_font-size;
10420
+ line-height: $_line-height;
10412
10421
  }
10413
- }
10414
- .k-icon-button.k-button-md {
10415
- padding: $kendo-button-padding-y-md;
10416
10422
 
10417
- > .k-button-icon {
10418
- min-width: calc( #{$kendo-button-font-size-md} * #{$kendo-button-line-height-md} );
10419
- min-height: calc( #{$kendo-button-font-size-md} * #{$kendo-button-line-height-md} );
10420
- }
10421
- }
10422
- .k-icon-button.k-button-lg {
10423
- padding: $kendo-button-padding-y-lg;
10423
+ .k-button-#{$size}.k-icon-button {
10424
+ padding: $_padding-y;
10424
10425
 
10425
- > .k-button-icon {
10426
- min-width: calc( #{$kendo-button-font-size-lg} * #{$kendo-button-line-height-lg} );
10427
- min-height: calc( #{$kendo-button-font-size-lg} * #{$kendo-button-line-height-lg} );
10426
+ > .k-button-icon {
10427
+ min-width: calc( #{$_font-size} * #{$_line-height} );
10428
+ min-height: calc( #{$_font-size} * #{$_line-height} );
10429
+ }
10428
10430
  }
10429
10431
  }
10430
10432
 
@@ -10952,29 +10954,46 @@ $kendo-button-transition: $transition !default;
10952
10954
  // Component
10953
10955
  // #region @import "_variables.scss"; -> packages/bootstrap/scss/input/_variables.scss
10954
10956
  // Input
10957
+
10958
+ /// Default width of input components.
10959
+ /// @group input
10955
10960
  $kendo-input-default-width: 100% !default;
10956
10961
 
10962
+ /// Border width of input components.
10963
+ /// @group input
10957
10964
  $kendo-input-border-width: $input-border-width !default;
10958
10965
  $kendo-input-border-height: ( $kendo-input-border-width * 2 ) !default;
10966
+ /// Border radius of input components.
10967
+ /// @group input
10959
10968
  $kendo-input-border-radius: null !default;
10960
10969
 
10970
+ /// Horizontal padding of input components.
10971
+ /// @group input
10961
10972
  $kendo-input-padding-x: $input-padding-x !default;
10973
+ /// Vertical padding of input components.
10974
+ /// @group input
10962
10975
  $kendo-input-padding-y: $input-padding-y !default;
10976
+ /// Font family of input components.
10977
+ /// @group input
10963
10978
  $kendo-input-font-family: $font-family !default;
10979
+ /// Font size of input components.
10980
+ /// @group input
10964
10981
  $kendo-input-font-size: $font-size !default;
10982
+ /// Line height of input components.
10983
+ /// @group input
10965
10984
  $kendo-input-line-height: $input-line-height !default;
10966
10985
 
10967
- $kendo-input-padding-x-sm: $input-padding-x !default;
10986
+ $kendo-input-padding-x-sm: $input-padding-x-sm !default;
10968
10987
  $kendo-input-padding-y-sm: $input-padding-y-sm !default;
10969
- $kendo-input-font-size-sm: $font-size-md !default;
10970
- $kendo-input-line-height-sm: $line-height-md !default;
10988
+ $kendo-input-font-size-sm: $font-size-sm !default;
10989
+ $kendo-input-line-height-sm: ( 20 / 14 ) !default;
10971
10990
 
10972
10991
  $kendo-input-padding-x-md: $input-padding-x !default;
10973
10992
  $kendo-input-padding-y-md: $input-padding-y !default;
10974
10993
  $kendo-input-font-size-md: $font-size-md !default;
10975
10994
  $kendo-input-line-height-md: $line-height-md !default;
10976
10995
 
10977
- $kendo-input-padding-x-lg: $input-padding-x !default;
10996
+ $kendo-input-padding-x-lg: $input-padding-x-lg !default;
10978
10997
  $kendo-input-padding-y-lg: $input-padding-y-lg !default;
10979
10998
  $kendo-input-font-size-lg: $font-size-md !default;
10980
10999
  $kendo-input-line-height-lg: $line-height-md !default;
@@ -13475,7 +13494,7 @@ $kendo-avatar-theme-colors: $kendo-theme-colors !default;
13475
13494
  $kendo-chip-border-width: 1px !default;
13476
13495
  /// The spacing between the text and the icons of the chip.
13477
13496
  /// @group chip
13478
- $kendo-chip-spacing: map-get( $spacing, 1 );
13497
+ $kendo-chip-spacing: map-get( $spacing, 1 ) !default;
13479
13498
 
13480
13499
  /// Horizontal padding of the chip.
13481
13500
  /// @group chip
@@ -13494,7 +13513,7 @@ $kendo-chip-padding-y-lg: map-get( $spacing, 1 ) + map-get( $spacing, thin ) !de
13494
13513
  /// Font sizes of the chip.
13495
13514
  /// @group chip
13496
13515
  $kendo-chip-font-size: $font-size-md !default;
13497
- $kendo-chip-font-size-sm: $font-size-md !default;
13516
+ $kendo-chip-font-size-sm: $font-size-sm !default;
13498
13517
  $kendo-chip-font-size-md: $font-size-md !default;
13499
13518
  $kendo-chip-font-size-lg: $font-size-md !default;
13500
13519
 
@@ -16154,7 +16173,8 @@ $fieldset-legend-border: null !default;
16154
16173
 
16155
16174
  .k-multiselect,
16156
16175
  .k-floating-label-container,
16157
- .k-daterangepicker .k-dateinput {
16176
+ .k-daterangepicker .k-dateinput,
16177
+ .k-signature {
16158
16178
  display: inline-flex;
16159
16179
  width: 100%;
16160
16180
  }
@@ -17276,6 +17296,7 @@ $listbox-drop-hint-width: 1px !default;
17276
17296
  // #region @import "_variables.scss"; -> packages/bootstrap/scss/progressbar/_variables.scss
17277
17297
  // Progressbar
17278
17298
  $progressbar-height: $progress-height !default;
17299
+ $progressbar-horizontal-width: 100% !default;
17279
17300
  $progressbar-animation-timing: $progress-bar-animation-timing !default;
17280
17301
  $progressbar-border-width: 0px !default;
17281
17302
  $progressbar-font-family: $font-family !default;
@@ -17299,6 +17320,10 @@ $progressbar-indeterminate-gradient: null !default;
17299
17320
 
17300
17321
  $progressbar-chunk-border: $body-bg !default;
17301
17322
 
17323
+ // Circular Progressbar
17324
+ $kendo-circular-progressbar-arc-stroke: $primary !default;
17325
+ $kendo-circular-progressbar-scale-stroke: $progressbar-bg !default;
17326
+
17302
17327
  // #endregion
17303
17328
  // #region @import "_layout.scss"; -> packages/bootstrap/scss/progressbar/_layout.scss
17304
17329
  // #region @import "~@progress/kendo-theme-default/scss/progressbar/_layout.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/progressbar/_layout.scss
@@ -17330,7 +17355,7 @@ $progressbar-chunk-border: $body-bg !default;
17330
17355
 
17331
17356
 
17332
17357
  // Selection
17333
- > .k-state-selected ,
17358
+ > .k-state-selected,
17334
17359
  > .k-selected {
17335
17360
  border-width: 0;
17336
17361
  border-style: solid;
@@ -17391,7 +17416,7 @@ $progressbar-chunk-border: $body-bg !default;
17391
17416
 
17392
17417
  // Horizontal
17393
17418
  .k-progressbar-horizontal {
17394
- width: 27em;
17419
+ width: $progressbar-horizontal-width;
17395
17420
  height: $progressbar-height;
17396
17421
  grid-template-columns: 1fr;
17397
17422
  grid-template-rows: 100%;
@@ -17401,7 +17426,7 @@ $progressbar-chunk-border: $body-bg !default;
17401
17426
  flex-direction: row;
17402
17427
  }
17403
17428
 
17404
- > .k-state-selected ,
17429
+ > .k-state-selected,
17405
17430
  > .k-selected {
17406
17431
  width: 0;
17407
17432
  width: calc( var( --kendo-progressbar-progress, 0 ) * 1% ); // sass-lint:disable-line no-duplicate-properties
@@ -17428,7 +17453,7 @@ $progressbar-chunk-border: $body-bg !default;
17428
17453
  // Horizontal reverse
17429
17454
  &.k-progressbar-reverse {
17430
17455
 
17431
- > .k-state-selected ,
17456
+ > .k-state-selected,
17432
17457
  > .k-selected {
17433
17458
  flex-direction: row-reverse;
17434
17459
  justify-self: flex-end;
@@ -17453,7 +17478,7 @@ $progressbar-chunk-border: $body-bg !default;
17453
17478
  writing-mode: vertical-lr;
17454
17479
  }
17455
17480
 
17456
- > .k-state-selected ,
17481
+ > .k-state-selected,
17457
17482
  > .k-selected {
17458
17483
  height: 0;
17459
17484
  height: calc( var( --kendo-progressbar-progress, 0 ) * 1% ); // sass-lint:disable-line no-duplicate-properties
@@ -17483,7 +17508,7 @@ $progressbar-chunk-border: $body-bg !default;
17483
17508
  &.k-progressbar-reverse {
17484
17509
  flex-direction: column;
17485
17510
 
17486
- > .k-state-selected ,
17511
+ > .k-state-selected,
17487
17512
  > .k-selected {
17488
17513
  flex-direction: column;
17489
17514
  align-self: flex-start;
@@ -17508,7 +17533,7 @@ $progressbar-chunk-border: $body-bg !default;
17508
17533
 
17509
17534
  > .k-state-selected,
17510
17535
  > .k-selected,
17511
- > .k-state-selected > .k-progress-status-wrap ,
17536
+ > .k-state-selected > .k-progress-status-wrap,
17512
17537
  > .k-selected > .k-progress-status-wrap {
17513
17538
  transition: width .1s ease-in-out;
17514
17539
  }
@@ -17537,7 +17562,7 @@ $progressbar-chunk-border: $body-bg !default;
17537
17562
  display: -ms-inline-grid;
17538
17563
 
17539
17564
  > .k-progress-status-wrap,
17540
- > .k-state-selected ,
17565
+ > .k-state-selected,
17541
17566
  > .k-selected {
17542
17567
  -ms-grid-column: 1;
17543
17568
  -ms-grid-row: 1;
@@ -17547,7 +17572,7 @@ $progressbar-chunk-border: $body-bg !default;
17547
17572
  -ms-grid-columns: 1fr;
17548
17573
  -ms-grid-rows: $progressbar-height;
17549
17574
 
17550
- &.k-progressbar-reverse > .k-state-selected ,
17575
+ &.k-progressbar-reverse > .k-state-selected,
17551
17576
  &.k-progressbar-reverse > .k-selected {
17552
17577
  -ms-grid-column-align: end;
17553
17578
  }
@@ -17556,12 +17581,12 @@ $progressbar-chunk-border: $body-bg !default;
17556
17581
  -ms-grid-columns: $progressbar-height;
17557
17582
  -ms-grid-rows: 1fr;
17558
17583
 
17559
- > .k-state-selected ,
17584
+ > .k-state-selected,
17560
17585
  > .k-selected {
17561
17586
  -ms-grid-row-align: end;
17562
17587
  }
17563
17588
 
17564
- &.k-progressbar-reverse > .k-state-selected ,
17589
+ &.k-progressbar-reverse > .k-state-selected,
17565
17590
  &.k-progressbar-reverse > .k-selected {
17566
17591
  -ms-grid-row-align: start;
17567
17592
  }
@@ -17569,6 +17594,49 @@ $progressbar-chunk-border: $body-bg !default;
17569
17594
 
17570
17595
  }
17571
17596
 
17597
+ @include exports("circular-progressbar/layout") {
17598
+
17599
+ .k-circular-progressbar {
17600
+ display: inline-block;
17601
+ text-align: left;
17602
+ position: relative;
17603
+ }
17604
+
17605
+ .k-circular-progressbar-surface {
17606
+ height: 100%;
17607
+
17608
+ & > div {
17609
+ width: 100%;
17610
+ height: 100%;
17611
+ }
17612
+
17613
+ svg {
17614
+ width: 100%;
17615
+ height: 100%;
17616
+ }
17617
+ }
17618
+
17619
+ .k-circular-progressbar-scale {
17620
+ fill: none;
17621
+ }
17622
+
17623
+ .k-circular-progressbar-arc {
17624
+ transform-box: fill-box;
17625
+ transform-origin: center center;
17626
+ transform: rotate(-90deg);
17627
+ stroke-linecap: round;
17628
+ fill: none;
17629
+ }
17630
+
17631
+ .k-circular-progressbar-label {
17632
+ position: absolute;
17633
+ text-align: center;
17634
+ padding: 0;
17635
+ margin: 0;
17636
+ }
17637
+
17638
+ }
17639
+
17572
17640
  // #endregion
17573
17641
 
17574
17642
  // #endregion
@@ -17584,7 +17652,7 @@ $progressbar-chunk-border: $body-bg !default;
17584
17652
  .k-progressbar {
17585
17653
  @include fill( $progressbar-text, $progressbar-bg, $progressbar-border, $progressbar-gradient );
17586
17654
 
17587
- .k-state-selected ,
17655
+ .k-state-selected,
17588
17656
  .k-selected {
17589
17657
  @include fill( $progressbar-fill-text, $progressbar-fill-bg, $progressbar-fill-border, $progressbar-fill-gradient );
17590
17658
  }
@@ -17603,6 +17671,19 @@ $progressbar-chunk-border: $body-bg !default;
17603
17671
 
17604
17672
  }
17605
17673
 
17674
+ @include exports("circular-progressbar/theme") {
17675
+
17676
+ .k-circular-progressbar-scale {
17677
+ stroke: $kendo-circular-progressbar-scale-stroke;
17678
+ }
17679
+
17680
+ .k-circular-progressbar-arc {
17681
+ stroke: $kendo-circular-progressbar-arc-stroke;
17682
+ transition: stroke .5s ease;
17683
+ }
17684
+
17685
+ }
17686
+
17606
17687
  // #endregion
17607
17688
 
17608
17689
  // #endregion
@@ -17954,7 +18035,7 @@ $kendo-radio-ripple-opacity: .25 !default;
17954
18035
  }
17955
18036
 
17956
18037
  .k-radio:focus,
17957
- .k-radio.k-state-focus ,
18038
+ .k-radio.k-state-focus,
17958
18039
  .k-radio.k-focus {
17959
18040
  box-shadow: none !important; // sass-lint:disable-line no-important
17960
18041
 
@@ -18018,7 +18099,7 @@ $kendo-radio-ripple-opacity: .25 !default;
18018
18099
 
18019
18100
  // Hover state
18020
18101
  .k-radio:hover,
18021
- .k-radio.k-state-hover ,
18102
+ .k-radio.k-state-hover,
18022
18103
  .k-radio.k-hover {
18023
18104
  @include fill(
18024
18105
  $kendo-radio-hover-text,
@@ -18030,7 +18111,7 @@ $kendo-radio-ripple-opacity: .25 !default;
18030
18111
 
18031
18112
  // Focus state
18032
18113
  .k-radio:focus,
18033
- .k-radio.k-state-focus ,
18114
+ .k-radio.k-state-focus,
18034
18115
  .k-radio.k-focus {
18035
18116
  @include fill( $border: $kendo-radio-focus-border );
18036
18117
  @include box-shadow( $kendo-radio-focus-shadow );
@@ -18062,7 +18143,7 @@ $kendo-radio-ripple-opacity: .25 !default;
18062
18143
  );
18063
18144
  }
18064
18145
  .k-radio:checked:focus,
18065
- .k-radio.k-checked.k-state-focus ,
18146
+ .k-radio.k-checked.k-state-focus,
18066
18147
  .k-radio.k-checked.k-focus {
18067
18148
  @include fill( $border: $kendo-radio-focus-checked-border );
18068
18149
  @include box-shadow( $kendo-radio-focus-checked-shadow );
@@ -18239,7 +18320,7 @@ $slider-disabled-opacity: null !default;
18239
18320
  }
18240
18321
 
18241
18322
 
18242
- &.k-state-disabled ,
18323
+ &.k-state-disabled,
18243
18324
  &.k-disabled {
18244
18325
  .k-tick,
18245
18326
  .k-slider-track,
@@ -18696,20 +18777,20 @@ $slider-disabled-opacity: null !default;
18696
18777
  }
18697
18778
 
18698
18779
  &:focus,
18699
- &.k-state-focused ,
18780
+ &.k-state-focused,
18700
18781
  &.k-focus {
18701
18782
  @include box-shadow( $slider-draghandle-focused-shadow );
18702
18783
  }
18703
18784
  }
18704
18785
 
18705
- &.k-state-focused ,
18786
+ &.k-state-focused,
18706
18787
  &.k-focus {
18707
18788
  .k-draghandle {
18708
18789
  @include box-shadow( $slider-draghandle-focused-shadow );
18709
18790
  }
18710
18791
  }
18711
18792
 
18712
- &.k-state-disabled ,
18793
+ &.k-state-disabled,
18713
18794
  &.k-disabled {
18714
18795
  opacity: $slider-disabled-opacity;
18715
18796
  }
@@ -18770,7 +18851,6 @@ $calendar-border: $component-border !default;
18770
18851
  $calendar-header-padding-x: map-get( $spacing, 1 ) !default;
18771
18852
  $calendar-header-padding-y: map-get( $spacing, 1 ) !default;
18772
18853
  $calendar-header-border-width: 1px !default;
18773
- $calendar-header-min-width: ( $calendar-cell-size * 8 ) !default;
18774
18854
 
18775
18855
  $calendar-header-bg: $header-bg !default;
18776
18856
  $calendar-header-text: $header-text !default;
@@ -18868,6 +18948,50 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
18868
18948
 
18869
18949
  // Multiview calendar
18870
18950
 
18951
+
18952
+ // Calendar sizes
18953
+ $kendo-calendar-sm-font-size: $font-size-md !default;
18954
+ $kendo-calendar-sm-line-height: $line-height-md !default;
18955
+ $kendo-calendar-sm-cell-size: 32px !default;
18956
+ $kendo-calendar-sm-cell-padding-x: .125rem !default;
18957
+ $kendo-calendar-sm-cell-padding-y: .125rem !default;
18958
+
18959
+ $kendo-calendar-md-font-size: $font-size-md !default;
18960
+ $kendo-calendar-md-line-height: $line-height-md !default;
18961
+ $kendo-calendar-md-cell-size: 36px !default;
18962
+ $kendo-calendar-md-cell-padding-x: map-get( $spacing, 1 ) !default;
18963
+ $kendo-calendar-md-cell-padding-y: map-get( $spacing, 1 ) !default;
18964
+
18965
+ $kendo-calendar-lg-font-size: $font-size-lg !default;
18966
+ $kendo-calendar-lg-line-height: $line-height-lg !default;
18967
+ $kendo-calendar-lg-cell-size: 40px !default;
18968
+ $kendo-calendar-lg-cell-padding-x: map-get( $spacing, 1 ) !default;
18969
+ $kendo-calendar-lg-cell-padding-y: map-get( $spacing, 1 ) !default;
18970
+
18971
+ $kendo-calendar-sizes: (
18972
+ sm: (
18973
+ font-size: $kendo-calendar-sm-font-size,
18974
+ line-height: $kendo-calendar-sm-line-height,
18975
+ cell-size: $kendo-calendar-sm-cell-size,
18976
+ cell-padding-x: $kendo-calendar-sm-cell-padding-y,
18977
+ cell-padding-y: $kendo-calendar-sm-cell-padding-x
18978
+ ),
18979
+ md: (
18980
+ font-size: $kendo-calendar-md-font-size,
18981
+ line-height: $kendo-calendar-md-line-height,
18982
+ cell-size: $kendo-calendar-md-cell-size,
18983
+ cell-padding-x: $kendo-calendar-md-cell-padding-y,
18984
+ cell-padding-y: $kendo-calendar-md-cell-padding-x
18985
+ ),
18986
+ lg: (
18987
+ font-size: $kendo-calendar-lg-font-size,
18988
+ line-height: $kendo-calendar-lg-line-height,
18989
+ cell-size: $kendo-calendar-lg-cell-size,
18990
+ cell-padding-x: $kendo-calendar-lg-cell-padding-y,
18991
+ cell-padding-y: $kendo-calendar-lg-cell-padding-x
18992
+ )
18993
+ ) !default;
18994
+
18871
18995
  // #endregion
18872
18996
  // #region @import "_layout.scss"; -> packages/bootstrap/scss/calendar/_layout.scss
18873
18997
  // #region @import "~@progress/kendo-theme-default/scss/calendar/_layout.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/calendar/_layout.scss
@@ -18875,6 +18999,8 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
18875
18999
 
18876
19000
  // Base
18877
19001
  .k-calendar {
19002
+ inline-size: var( --INTERNAL--kendo-calendar-width, min-content );
19003
+ block-size: var( --INTERNAL--kendo-calendar-height, min-content );
18878
19004
  border-width: $calendar-border-width;
18879
19005
  border-style: solid;
18880
19006
  box-sizing: border-box;
@@ -18895,19 +19021,12 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
18895
19021
  > .k-calendar {
18896
19022
  border: 0;
18897
19023
  }
18898
-
18899
- // Common
18900
- .k-link {
18901
- white-space: normal;
18902
- position: relative;
18903
- overflow: hidden;
18904
- }
18905
19024
  }
18906
19025
 
18907
19026
 
18908
19027
  // Calendar table
18909
19028
  .k-calendar-table {
18910
- margin: 0;
19029
+ margin: 0 auto;
18911
19030
  border-width: 0;
18912
19031
  border-color: inherit;
18913
19032
  border-spacing: 0;
@@ -18915,8 +19034,7 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
18915
19034
  table-layout: fixed;
18916
19035
  text-align: center;
18917
19036
  outline: 0;
18918
- display: inline-table;
18919
- vertical-align: top;
19037
+ display: table;
18920
19038
  position: relative;
18921
19039
  z-index: 1;
18922
19040
  }
@@ -18934,6 +19052,9 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
18934
19052
  font-weight: $calendar-caption-font-weight;
18935
19053
  cursor: default;
18936
19054
  }
19055
+
19056
+
19057
+ // Calendar cell
18937
19058
  .k-calendar-th,
18938
19059
  .k-calendar-td {
18939
19060
  border-width: 0;
@@ -18955,10 +19076,32 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
18955
19076
  }
18956
19077
  .k-calendar-td {
18957
19078
  @include border-radius( $calendar-cell-border-radius );
19079
+ inline-size: var( --INTERNAL--kendo-calendar-cell-size, min-content );
19080
+ block-size: var( --INTERNAL--kendo-calendar-cell-size, min-content );
18958
19081
  border-color: transparent;
18959
19082
  }
18960
19083
 
18961
19084
 
19085
+ // Calendar cell inner
19086
+ // Remove .k-calendar once we remove k-link
19087
+ .k-calendar .k-calendar-cell-inner {
19088
+ @include border-radius( $calendar-cell-border-radius );
19089
+ padding: $calendar-cell-padding-y $calendar-cell-padding-x;
19090
+ padding-inline: var( --INTERNAL--kendo-calendar-cell-padding-x, #{$calendar-cell-padding-x} );
19091
+ padding-block: var( --INTERNAL--kendo-calendar-cell-padding-y, #{$calendar-cell-padding-y} );
19092
+ width: 100%;
19093
+ height: 100%;
19094
+ box-sizing: border-box;
19095
+ display: flex;
19096
+ flex-direction: row;
19097
+ align-items: center;
19098
+ justify-content: center;
19099
+ white-space: normal;
19100
+ position: relative;
19101
+ overflow: hidden;
19102
+ }
19103
+
19104
+
18962
19105
  // Calendar header
18963
19106
  .k-calendar .k-header {
18964
19107
  padding: $calendar-header-padding-y $calendar-header-padding-x;
@@ -18976,7 +19119,7 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
18976
19119
  // Calendar header
18977
19120
  .k-calendar-header {
18978
19121
  padding: $calendar-header-padding-y $calendar-header-padding-x;
18979
- min-width: $calendar-header-min-width;
19122
+ min-width: ($calendar-cell-size * 8);
18980
19123
  box-sizing: border-box;
18981
19124
  display: flex;
18982
19125
  align-items: center;
@@ -19018,22 +19161,13 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19018
19161
  padding: 0 $calendar-header-padding-x;
19019
19162
  // setting width / height prevents layout changes in meta views
19020
19163
  width: $calendar-view-width;
19164
+ inline-size: var( --INTERNAL--kendo-calendar-view-width, #{$calendar-view-width});
19021
19165
  min-height: $calendar-view-height;
19022
19166
  box-sizing: content-box;
19023
19167
  gap: $calendar-view-gap;
19024
19168
  position: relative;
19025
19169
  z-index: 1;
19026
19170
  overflow: hidden;
19027
-
19028
- .k-link {
19029
- @include border-radius( $calendar-cell-border-radius );
19030
- padding: $calendar-cell-padding-y $calendar-cell-padding-x;
19031
- box-sizing: border-box;
19032
- display: flex;
19033
- flex-direction: row;
19034
- align-items: center;
19035
- justify-content: center;
19036
- }
19037
19171
  }
19038
19172
  .k-week-number .k-calendar-view {
19039
19173
  width: (8 * $calendar-cell-size);
@@ -19041,61 +19175,59 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19041
19175
 
19042
19176
 
19043
19177
  // Month view
19178
+ .k-month-calendar,
19044
19179
  .k-calendar-monthview {
19045
19180
  $_month-cell-size: $calendar-cell-size;
19046
19181
 
19047
19182
  .k-calendar-td {
19048
19183
  width: $_month-cell-size;
19049
19184
  height: $_month-cell-size;
19050
- }
19051
- .k-link {
19052
- width: $_month-cell-size;
19053
- height: $_month-cell-size;
19185
+ inline-size: var( --INTERNAL--kendo-calendar-cell-size, #{$_month-cell-size} );
19186
+ block-size: var( --INTERNAL--kendo-calendar-cell-size, #{$_month-cell-size} );
19054
19187
  }
19055
19188
  }
19056
19189
 
19057
19190
 
19058
19191
  // Year view
19192
+ .k-year-calendar,
19059
19193
  .k-calendar-yearview {
19060
- $_year-cell-size: ( (7 / 4) * $calendar-cell-size);
19194
+ $_year-cell-size: ( 1.75 * $calendar-cell-size ); // 7 / 4 => 1.75
19061
19195
 
19062
19196
  .k-calendar-td {
19063
- width: auto;
19064
- height: auto;
19065
- }
19066
- .k-link {
19067
19197
  width: $_year-cell-size;
19068
19198
  height: $_year-cell-size;
19199
+ inline-size: var( --INTERNAL--kendo-calendar-cell-size, #{$_year-cell-size} );
19200
+ block-size: var( --INTERNAL--kendo-calendar-cell-size, #{$_year-cell-size} );
19069
19201
  }
19070
19202
  }
19071
19203
 
19072
19204
 
19073
19205
  // Decade view
19206
+ .k-decade-calendar,
19074
19207
  .k-calendar-decadeview {
19075
- $_decade-cell-size: ( (7 / 4) * $calendar-cell-size);
19208
+ $_decade-cell-size: ( 1.75 * $calendar-cell-size ); // 7 / 4 => 1.75
19076
19209
 
19077
19210
  .k-calendar-td {
19078
- width: auto;
19079
- height: auto;
19080
- }
19081
- .k-link {
19082
19211
  width: $_decade-cell-size;
19083
19212
  height: $_decade-cell-size;
19213
+ inline-size: var( --INTERNAL--kendo-calendar-cell-size, #{$_decade-cell-size} );
19214
+ block-size: var( --INTERNAL--kendo-calendar-cell-size, #{$_decade-cell-size} );
19084
19215
  }
19085
19216
  }
19086
19217
 
19087
19218
 
19088
19219
  // Century view
19220
+ .k-century-calendar,
19089
19221
  .k-calendar-centuryview {
19090
- $_century-cell-size: ( (7 / 4) * $calendar-cell-size);
19222
+ $_century-cell-size: ( 1.75 * $calendar-cell-size ); // 7 / 4 => 1.75
19091
19223
 
19092
19224
  .k-calendar-td {
19093
- width: auto;
19094
- height: auto;
19095
- }
19096
- .k-link {
19097
19225
  width: $_century-cell-size;
19098
19226
  height: $_century-cell-size;
19227
+ inline-size: var( --INTERNAL--kendo-calendar-cell-size, #{$_century-cell-size} );
19228
+ block-size: var( --INTERNAL--kendo-calendar-cell-size, #{$_century-cell-size} );
19229
+ }
19230
+ .k-calendar-cell-inner {
19099
19231
  text-align: left;
19100
19232
  }
19101
19233
  }
@@ -19135,6 +19267,56 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19135
19267
  top: 0;
19136
19268
  right: 0;
19137
19269
  }
19270
+
19271
+
19272
+
19273
+
19274
+ // Calendar sizes
19275
+ @each $size, $size-props in $kendo-calendar-sizes {
19276
+ $_font-size: map-get( $size-props, font-size );
19277
+ $_line-height: map-get( $size-props, line-height );
19278
+ $_cell-size: map-get( $size-props, cell-size );
19279
+ $_cell-padding-x: map-get( $size-props, cell-padding-x );
19280
+ $_cell-padding-y: map-get( $size-props, cell-padding-y );
19281
+
19282
+ $_month-cell-size: $_cell-size;
19283
+ $_year-cell-size: ( 1.75 * $_cell-size ); // 7 / 4 => 1.75
19284
+ $_decade-cell-size: ( 1.75 * $_cell-size ); // 7 / 4 => 1.75
19285
+ $_century-cell-size: ( 1.75 * $_cell-size ); // 7 / 4 => 1.75
19286
+
19287
+ .k-calendar-#{$size} {
19288
+ --INTERNAL--kendo-calendar-view-width: #{8 * $_cell-size};
19289
+ --INTERNAL--kendo-calendar-cell-padding-x: var( --kendo-calendar-#{$size}-cell-padding-x, #{$_cell-padding-x} );
19290
+ --INTERNAL--kendo-calendar-cell-padding-y: var( --kendo-calendar-#{$size}-cell-padding-y, #{$_cell-padding-y} );
19291
+ font-size: $_font-size;
19292
+ line-height: $_line-height;
19293
+
19294
+ &.k-month-calendar,
19295
+ .k-calendar-monthview {
19296
+ --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-#{$size}-month-cell-size, #{$_month-cell-size} );
19297
+ }
19298
+ &.k-year-calendar,
19299
+ .k-calendar-yearview {
19300
+ --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-#{$size}-year-cell-size, #{$_year-cell-size} );
19301
+ }
19302
+ &.k-decade-calendar,
19303
+ .k-calendar-decadeview {
19304
+ --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-#{$size}-decade-cell-size, #{$_decade-cell-size} );
19305
+ }
19306
+ &.k-century-calendar,
19307
+ .k-calendar-centuryview {
19308
+ --INTERNAL--kendo-calendar-cell-size: var( --kendo-calendar-#{$size}-century-cell-size, #{$_century-cell-size} );
19309
+ }
19310
+ }
19311
+ }
19312
+
19313
+
19314
+
19315
+
19316
+ // Alias
19317
+ .k-link {
19318
+ @extend .k-calendar-cell-inner;
19319
+ }
19138
19320
  }
19139
19321
 
19140
19322
 
@@ -19259,7 +19441,7 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19259
19441
  }
19260
19442
 
19261
19443
  // // styles are applied to the k-link element inside
19262
- // .k-state-selected ,
19444
+ // .k-state-selected,
19263
19445
  // .k-selected {
19264
19446
  // color: inherit;
19265
19447
  // background: transparent;
@@ -19285,6 +19467,10 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19285
19467
  &::after {
19286
19468
  display: none;
19287
19469
  }
19470
+
19471
+ &:focus {
19472
+ outline: 0;
19473
+ }
19288
19474
  }
19289
19475
 
19290
19476
  .k-range-start {
@@ -19382,8 +19568,8 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19382
19568
  &.k-hover,
19383
19569
  &.k-state-hover,
19384
19570
  &:focus,
19385
- &.k-state-focus,
19386
- &.k-focus {
19571
+ &.k-focus,
19572
+ &.k-state-focus {
19387
19573
  color: $calendar-today-nav-hover-text;
19388
19574
  }
19389
19575
  }
@@ -19401,11 +19587,11 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19401
19587
  // Special days
19402
19588
  .k-calendar-view .k-today {
19403
19589
  @if $calendar-today-style == box {
19404
- .k-link {
19590
+ .k-calendar-cell-inner {
19405
19591
  box-shadow: inset 0 0 0 1px $calendar-today-color;
19406
19592
  }
19407
- &.k-state-focused .k-link,
19408
- &.k-focus .k-link {
19593
+ &.k-focus .k-calendar-cell-inner,
19594
+ &.k-state-focused .k-calendar-cell-inner {
19409
19595
  box-shadow: inset 0 0 0 1px $calendar-today-color, $calendar-cell-focused-shadow;
19410
19596
  }
19411
19597
  } @else if $calendar-today-style == color {
@@ -19439,9 +19625,9 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19439
19625
 
19440
19626
 
19441
19627
  // Interactive states
19442
- .k-calendar-td:hover .k-link,
19443
- .k-calendar-td.k-state-hover .k-link,
19444
- .k-calendar-td.k-hover .k-link {
19628
+ .k-calendar-td:hover .k-calendar-cell-inner,
19629
+ .k-calendar-td.k-hover .k-calendar-cell-inner,
19630
+ .k-calendar-td.k-state-hover .k-calendar-cell-inner {
19445
19631
  @include fill(
19446
19632
  $calendar-cell-hover-text,
19447
19633
  $calendar-cell-hover-bg,
@@ -19449,8 +19635,8 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19449
19635
  $calendar-cell-hover-gradient
19450
19636
  );
19451
19637
  }
19452
- .k-calendar-td.k-state-selected .k-link,
19453
- .k-calendar-td.k-selected .k-link {
19638
+ .k-calendar-td.k-selected .k-calendar-cell-inner,
19639
+ .k-calendar-td.k-state-selected .k-calendar-cell-inner {
19454
19640
  @include fill(
19455
19641
  $calendar-cell-selected-text,
19456
19642
  $calendar-cell-selected-bg,
@@ -19458,12 +19644,9 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19458
19644
  $calendar-cell-selected-gradient
19459
19645
  );
19460
19646
  }
19461
- .k-calendar-td.k-state-selected:hover .k-link,
19462
- .k-calendar-td.k-selected:hover .k-link,
19463
- .k-calendar-td.k-state-selected.k-state-hover .k-link,
19464
- .k-calendar-td.k-selected.k-hover .k-link,
19465
- .k-calendar-td.k-selected:hover .k-link,
19466
- .k-calendar-td.k-selected.k-hover .k-link {
19647
+ .k-calendar-td.k-selected:hover .k-calendar-cell-inner,
19648
+ .k-calendar-td.k-selected.k-hover .k-calendar-cell-inner,
19649
+ .k-calendar-td.k-state-selected:hover .k-calendar-cell-inner {
19467
19650
  @include fill(
19468
19651
  $calendar-cell-selected-hover-text,
19469
19652
  $calendar-cell-selected-hover-bg,
@@ -19471,18 +19654,15 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19471
19654
  $calendar-cell-selected-hover-gradient
19472
19655
  );
19473
19656
  }
19474
- .k-calendar-td.k-state-focused .k-link,
19475
- .k-calendar-td.k-focus .k-link,
19476
- .k-calendar-td.k-state-focus .k-link,
19477
- .k-calendar-td.k-focus .k-link {
19657
+ .k-calendar-td:focus .k-calendar-cell-inner,
19658
+ .k-calendar-td.k-focus .k-calendar-cell-inner,
19659
+ .k-calendar-td.k-state-focus .k-calendar-cell-inner,
19660
+ .k-calendar-td.k-state-focused .k-calendar-cell-inner {
19478
19661
  box-shadow: $calendar-cell-focused-shadow;
19479
19662
  }
19480
- .k-calendar-td.k-state-selected.k-state-focused .k-link,
19481
- .k-calendar-td.k-selected.k-focused .k-link,
19482
- .k-calendar-td.k-state-selected.k-state-focus .k-link,
19483
- .k-calendar-td.k-selected.k-focus .k-link,
19484
- .k-calendar-td.k-selected:focus .k-link,
19485
- .k-calendar-td.k-selected.k-focus .k-link {
19663
+ .k-calendar-td.k-selected:focus .k-calendar-cell-inner,
19664
+ .k-calendar-td.k-selected.k-focus .k-calendar-cell-inner,
19665
+ .k-calendar-td.k-state-selected.k-state-focus .k-calendar-cell-inner {
19486
19666
  box-shadow: $calendar-cell-selected-focus-shadow;
19487
19667
  }
19488
19668
 
@@ -19496,8 +19676,8 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19496
19676
  box-shadow: inset -1px 0 $calendar-navigation-border;
19497
19677
 
19498
19678
  li:hover,
19499
- li.k-state-hover,
19500
- li.k-hover {
19679
+ li.k-hover,
19680
+ li.k-state-hover {
19501
19681
  color: $calendar-today-nav-hover-text;
19502
19682
  }
19503
19683
  }
@@ -19552,19 +19732,7 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19552
19732
  .k-range-start,
19553
19733
  .k-range-end,
19554
19734
  .k-range-mid {
19555
- // sass-lint:disable-block indentation
19556
- background-image:
19557
- linear-gradient(
19558
- transparent $calendar-range-gap,
19559
- $calendar-range-bg $calendar-range-gap,
19560
- $calendar-range-bg calc(100% - #{$calendar-range-gap}),
19561
- transparent calc(100% - #{$calendar-range-gap})
19562
- );
19563
-
19564
- .k-ie & {
19565
- background-image: none;
19566
- background-color: $calendar-range-bg;
19567
- }
19735
+ background-color: $calendar-range-bg;
19568
19736
  }
19569
19737
 
19570
19738
  .k-range-start.k-range-end {
@@ -19574,16 +19742,16 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19574
19742
 
19575
19743
  .k-range-start,
19576
19744
  .k-range-end {
19577
- .k-link {
19745
+ .k-calendar-cell-inner {
19578
19746
  background-color: $calendar-cell-selected-bg;
19579
19747
  }
19580
19748
  }
19581
19749
 
19582
- .k-range-start.k-state-active,
19583
19750
  .k-range-start.k-active,
19584
- .k-range-end.k-state-active,
19585
- .k-range-end.k-active {
19586
- .k-link {
19751
+ .k-range-start.k-state-active,
19752
+ .k-range-end.k-active,
19753
+ .k-range-end.k-state-active {
19754
+ .k-calendar-cell-inner {
19587
19755
  box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, .2);
19588
19756
  }
19589
19757
  }
@@ -19596,8 +19764,8 @@ $infinite-calendar-view-height: ( $calendar-cell-size * 9 ) !default;
19596
19764
  content: "";
19597
19765
  display: block;
19598
19766
  position: absolute;
19599
- top: $calendar-range-gap;
19600
- bottom: $calendar-range-gap;
19767
+ top: 0;
19768
+ bottom: 0;
19601
19769
  width: $calendar-range-split-size;
19602
19770
  }
19603
19771
  }
@@ -19675,6 +19843,44 @@ $time-list-highlight-border: $component-border !default;
19675
19843
 
19676
19844
  $time-list-focused-bg: rgba(0, 0, 0, .02) !default;
19677
19845
 
19846
+
19847
+ // Time selector sizes
19848
+ $kendo-time-selector-sm-font-size: $kendo-list-font-size-sm !default;
19849
+ $kendo-time-selector-sm-line-height: $kendo-list-line-height-sm !default;
19850
+ $kendo-time-selector-sm-list-item-padding-x: $kendo-list-item-padding-x-sm !default;
19851
+ $kendo-time-selector-sm-list-item-padding-y: $kendo-list-item-padding-y-sm !default;
19852
+
19853
+ $kendo-time-selector-md-font-size: $kendo-list-font-size-md !default;
19854
+ $kendo-time-selector-md-line-height: $kendo-list-line-height-md !default;
19855
+ $kendo-time-selector-md-list-item-padding-x: $kendo-list-item-padding-x-md !default;
19856
+ $kendo-time-selector-md-list-item-padding-y: $kendo-list-item-padding-y-md !default;
19857
+
19858
+ $kendo-time-selector-lg-font-size: $kendo-list-font-size-lg !default;
19859
+ $kendo-time-selector-lg-line-height: $kendo-list-line-height-lg !default;
19860
+ $kendo-time-selector-lg-list-item-padding-x: $kendo-list-item-padding-x-lg !default;
19861
+ $kendo-time-selector-lg-list-item-padding-y: $kendo-list-item-padding-y-lg !default;
19862
+
19863
+ $kendo-time-selector-sizes: (
19864
+ sm: (
19865
+ font-size: $kendo-time-selector-sm-font-size,
19866
+ line-height: $kendo-time-selector-sm-line-height,
19867
+ list-item-padding-x: $kendo-time-selector-sm-list-item-padding-x,
19868
+ list-item-padding-y: $kendo-time-selector-sm-list-item-padding-y
19869
+ ),
19870
+ md: (
19871
+ font-size: $kendo-time-selector-md-font-size,
19872
+ line-height: $kendo-time-selector-md-line-height,
19873
+ list-item-padding-x: $kendo-time-selector-md-list-item-padding-x,
19874
+ list-item-padding-y: $kendo-time-selector-md-list-item-padding-y
19875
+ ),
19876
+ lg: (
19877
+ font-size: $kendo-time-selector-lg-font-size,
19878
+ line-height: $kendo-time-selector-lg-line-height,
19879
+ list-item-padding-x: $kendo-time-selector-lg-list-item-padding-x,
19880
+ list-item-padding-y: $kendo-time-selector-lg-list-item-padding-y
19881
+ )
19882
+ ) !default;
19883
+
19678
19884
  // #endregion
19679
19885
  // #region @import "_layout.scss"; -> packages/bootstrap/scss/timeselector/_layout.scss
19680
19886
  // #region @import "~@progress/kendo-theme-default/scss/timeselector/_layout.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/timeselector/_layout.scss
@@ -19780,7 +19986,7 @@ $time-list-focused-bg: rgba(0, 0, 0, .02) !default;
19780
19986
  display: block;
19781
19987
  }
19782
19988
 
19783
- &.k-state-focused ,
19989
+ &.k-state-focused,
19784
19990
  &.k-focus {
19785
19991
  &::before,
19786
19992
  &::after {
@@ -19886,6 +20092,36 @@ $time-list-focused-bg: rgba(0, 0, 0, .02) !default;
19886
20092
  top: calc( #{$time-list-title-height / 2} );
19887
20093
  }
19888
20094
 
20095
+
20096
+ // Time selector sizes
20097
+ @each $size, $size-props in $kendo-time-selector-sizes {
20098
+ $_font-size: map-get( $size-props, font-size );
20099
+ $_line-height: map-get( $size-props, line-height );
20100
+ $_list-item-padding-x: map-get( $size-props, list-item-padding-x );
20101
+ $_list-item-padding-y: map-get( $size-props, list-item-padding-y );
20102
+ $_highlight-height: calc( #{$_font-size * $_line-height} + #{ $_list-item-padding-y * 2} );
20103
+
20104
+
20105
+ .k-timeselector-#{$size} {
20106
+ font-size: $_font-size;
20107
+ line-height: $_line-height;
20108
+
20109
+ .k-time-highlight,
20110
+ .k-time-list-highlight {
20111
+ height: $_highlight-height;
20112
+ }
20113
+
20114
+ .k-time-separator {
20115
+ height: $_highlight-height;
20116
+ }
20117
+
20118
+ .k-time-list-item,
20119
+ .k-time-list .k-item {
20120
+ padding: $_list-item-padding-y $_list-item-padding-x;
20121
+ }
20122
+ }
20123
+ }
20124
+
19889
20125
  }
19890
20126
 
19891
20127
  // #endregion
@@ -19925,7 +20161,7 @@ $time-list-focused-bg: rgba(0, 0, 0, .02) !default;
19925
20161
  color: $time-list-title-text;
19926
20162
  }
19927
20163
 
19928
- &.k-state-focused ,
20164
+ &.k-state-focused,
19929
20165
  &.k-focus {
19930
20166
  .k-title {
19931
20167
  color: $time-list-title-focus-text;
@@ -20253,7 +20489,7 @@ $colorpalette-tile-selected-shadow: 0 1px 3px 1px rgba( black, .3 ), inset 0 0 0
20253
20489
  &.k-focus,
20254
20490
  &.k-state-selected,
20255
20491
  &.k-selected,
20256
- &.k-state-selected:hover ,
20492
+ &.k-state-selected:hover,
20257
20493
  &.k-selected:hover {
20258
20494
  position: relative;
20259
20495
  z-index: 100;
@@ -21604,13 +21840,13 @@ $kendo-treeview-font-family: $font-family !default;
21604
21840
  /// Font size of the treeview component.
21605
21841
  /// @group treeview
21606
21842
  $kendo-treeview-font-size: $font-size-md !default;
21607
- $kendo-treeview-font-size-sm: $font-size-md !default;
21843
+ $kendo-treeview-font-size-sm: $font-size-sm !default;
21608
21844
  $kendo-treeview-font-size-md: $font-size-md !default;
21609
21845
  $kendo-treeview-font-size-lg: $font-size-md !default;
21610
21846
  /// Line height of the treeview component.
21611
21847
  /// @group treeview
21612
21848
  $kendo-treeview-line-height: $line-height !default;
21613
- $kendo-treeview-line-height-sm: $line-height !default;
21849
+ $kendo-treeview-line-height-sm: (20 / 14) !default;
21614
21850
  $kendo-treeview-line-height-md: $line-height !default;
21615
21851
  $kendo-treeview-line-height-lg: $line-height !default;
21616
21852
 
@@ -21621,15 +21857,15 @@ $kendo-treeview-indent: 16px !default;
21621
21857
  /// Horizontal padding of treeview items.
21622
21858
  /// @group treeview
21623
21859
  $kendo-treeview-item-padding-x: map-get( $spacing, 3 ) !default;
21624
- $kendo-treeview-item-padding-x-sm: map-get( $spacing, 3 ) !default;
21860
+ $kendo-treeview-item-padding-x-sm: map-get( $spacing, 2 ) !default;
21625
21861
  $kendo-treeview-item-padding-x-md: map-get( $spacing, 3 ) !default;
21626
21862
  $kendo-treeview-item-padding-x-lg: map-get( $spacing, 3 ) !default;
21627
21863
  /// Vertical padding of treeview items.
21628
21864
  /// @group treeview
21629
21865
  $kendo-treeview-item-padding-y: map-get( $spacing, 1 ) !default;
21630
- $kendo-treeview-item-padding-y-sm: map-get( $spacing, 1 ) - map-get( $spacing, thin ) !default;
21866
+ $kendo-treeview-item-padding-y-sm: map-get( $spacing, 1 ) !default;
21631
21867
  $kendo-treeview-item-padding-y-md: map-get( $spacing, 1 ) !default;
21632
- $kendo-treeview-item-padding-y-lg: map-get( $spacing, 1 ) + map-get( $spacing, thin ) !default;
21868
+ $kendo-treeview-item-padding-y-lg: map-get( $spacing, 2 ) !default;
21633
21869
  /// Border width of treeview items.
21634
21870
  /// @group treeview
21635
21871
  $kendo-treeview-item-border-width: 0px !default;
@@ -22281,7 +22517,7 @@ $rating-icon-focused-selected-shadow: 0 2px 4px rgba( $black, .1) !default;
22281
22517
  color: $component-text;
22282
22518
 
22283
22519
  &:focus,
22284
- &.k-state-focused ,
22520
+ &.k-state-focused,
22285
22521
  &.k-focus {
22286
22522
 
22287
22523
  .k-rating-item {
@@ -22289,7 +22525,7 @@ $rating-icon-focused-selected-shadow: 0 2px 4px rgba( $black, .1) !default;
22289
22525
  text-shadow: $rating-icon-focused-shadow;
22290
22526
  }
22291
22527
 
22292
- &.k-state-selected > .k-icon ,
22528
+ &.k-state-selected > .k-icon,
22293
22529
  &.k-selected > .k-icon {
22294
22530
  text-shadow: $rating-icon-focused-selected-shadow;
22295
22531
  }
@@ -22300,19 +22536,19 @@ $rating-icon-focused-selected-shadow: 0 2px 4px rgba( $black, .1) !default;
22300
22536
  .k-rating-item {
22301
22537
  color: $rating-icon-text;
22302
22538
 
22303
- &.k-state-selected ,
22539
+ &.k-state-selected,
22304
22540
  &.k-selected {
22305
22541
  color: $rating-icon-selected-text;
22306
22542
 
22307
22543
  &:focus,
22308
- &.k-state-focused ,
22544
+ &.k-state-focused,
22309
22545
  &.k-focus {
22310
22546
  color: $rating-icon-focused-text;
22311
22547
  }
22312
22548
  }
22313
22549
 
22314
22550
  &:hover,
22315
- &.k-state-hover ,
22551
+ &.k-state-hover,
22316
22552
  &.k-hover {
22317
22553
  color: $rating-icon-hover-text;
22318
22554
  cursor: pointer;
@@ -23555,7 +23791,7 @@ $upload-focused-shadow: 0 0 0 2px rgba(0, 0, 0, .13) !default;
23555
23791
  z-index: 1;
23556
23792
  }
23557
23793
  input[disabled],
23558
- input.k-state-disabled ,
23794
+ input.k-state-disabled,
23559
23795
  input.k-disabled {
23560
23796
  visibility: hidden;
23561
23797
  }
@@ -23603,12 +23839,12 @@ $upload-focused-shadow: 0 0 0 2px rgba(0, 0, 0, .13) !default;
23603
23839
 
23604
23840
  .k-file {
23605
23841
 
23606
- &.k-state-focused ,
23842
+ &.k-state-focused,
23607
23843
  &.k-focus {
23608
23844
  box-shadow: inset $upload-focused-shadow;
23609
23845
  }
23610
23846
 
23611
- .k-upload-action.k-state-focused ,
23847
+ .k-upload-action.k-state-focused,
23612
23848
  .k-upload-action.k-focus {
23613
23849
  box-shadow: $upload-focused-shadow;
23614
23850
  }
@@ -24509,6 +24745,10 @@ $actionsheet-item-disabled-shadow: null !default;
24509
24745
  box-sizing: border-box;
24510
24746
  }
24511
24747
  }
24748
+ .k-actionsheet-fullscreen {
24749
+ max-height: 100%;
24750
+ height: 100%;
24751
+ }
24512
24752
 
24513
24753
 
24514
24754
  // Actionsheet header
@@ -24522,6 +24762,35 @@ $actionsheet-item-disabled-shadow: null !default;
24522
24762
  font-size: $actionsheet-header-font-size;
24523
24763
  font-family: $actionsheet-header-font-family;
24524
24764
  line-height: $actionsheet-header-line-height;
24765
+ flex: none;
24766
+ }
24767
+
24768
+
24769
+ // Actionsheet titlebar
24770
+ .k-actionsheet-titlebar {
24771
+ @extend .k-actionsheet-header !optional;
24772
+ display: flex;
24773
+ flex-flow: row nowrap;
24774
+ align-items: center;
24775
+ }
24776
+ .k-actionsheet-title {
24777
+ flex: 1;
24778
+ }
24779
+ .k-actionsheet-actions {
24780
+ flex: none;
24781
+ }
24782
+
24783
+
24784
+ // Actionsheet content
24785
+ .k-actionsheet-content {
24786
+ flex: 1;
24787
+ overflow: auto;
24788
+ }
24789
+
24790
+
24791
+ // Actionsheet footer
24792
+ .k-actionsheet-footer {
24793
+ flex: none;
24525
24794
  }
24526
24795
 
24527
24796
 
@@ -24618,6 +24887,37 @@ $actionsheet-item-disabled-shadow: null !default;
24618
24887
  transform: none;
24619
24888
  }
24620
24889
 
24890
+
24891
+ // Adaptive action sheet
24892
+ .k-adaptive-actionsheet {
24893
+ max-width: 100%;
24894
+ width: 100%;
24895
+
24896
+ // TMP: this should be moved to action sheet
24897
+ display: flex;
24898
+ flex-flow: column nowrap;
24899
+
24900
+ .k-calendar {
24901
+ margin-inline: auto;
24902
+ border-width: 0;
24903
+ display: flex;
24904
+ }
24905
+
24906
+ .k-timeselector {
24907
+ height: 100%;
24908
+ border-width: 0;
24909
+ overflow: hidden;
24910
+
24911
+ .k-time-part {
24912
+ display: contents;
24913
+ }
24914
+
24915
+ .k-time-list-wrapper {
24916
+ height: 100%;
24917
+ }
24918
+ }
24919
+ }
24920
+
24621
24921
  }
24622
24922
 
24623
24923
  // #endregion
@@ -24670,7 +24970,7 @@ $actionsheet-item-disabled-shadow: null !default;
24670
24970
 
24671
24971
  // Hover state
24672
24972
  &:hover,
24673
- &.k-state-hover ,
24973
+ &.k-state-hover,
24674
24974
  &.k-hover {
24675
24975
  @include fill(
24676
24976
  $actionsheet-item-hover-text,
@@ -24684,7 +24984,7 @@ $actionsheet-item-disabled-shadow: null !default;
24684
24984
 
24685
24985
  // Focus state
24686
24986
  &:focus,
24687
- &.k-state-focus ,
24987
+ &.k-state-focus,
24688
24988
  &.k-focus {
24689
24989
  @include fill(
24690
24990
  $actionsheet-item-focus-text,
@@ -24698,7 +24998,7 @@ $actionsheet-item-disabled-shadow: null !default;
24698
24998
 
24699
24999
  // Disabed state
24700
25000
  &:disabled,
24701
- &.k-state-disabled ,
25001
+ &.k-state-disabled,
24702
25002
  &.k-disabled {
24703
25003
  @include fill(
24704
25004
  $actionsheet-item-disabled-text,
@@ -24943,7 +25243,7 @@ $actionsheet-item-disabled-shadow: null !default;
24943
25243
 
24944
25244
  .k-window {
24945
25245
  &:focus,
24946
- &.k-state-focused ,
25246
+ &.k-state-focused,
24947
25247
  &.k-focus {
24948
25248
  @include box-shadow( $window-focused-shadow );
24949
25249
  }
@@ -25465,33 +25765,33 @@ $drawer-selected-hover-text: $selected-text !default;
25465
25765
  .k-drawer-item {
25466
25766
 
25467
25767
  &:hover,
25468
- &.k-state-hover ,
25768
+ &.k-state-hover,
25469
25769
  &.k-hover {
25470
25770
  color: $drawer-hovered-text;
25471
25771
  background-color: $drawer-hovered-bg;
25472
25772
  }
25473
25773
 
25474
25774
  &:focus,
25475
- &.k-state-focused ,
25775
+ &.k-state-focused,
25476
25776
  &.k-focus {
25477
25777
  background-color: $drawer-focused-bg;
25478
25778
  box-shadow: $drawer-focused-shadow;
25479
25779
 
25480
25780
  &:hover,
25481
- &.k-state-hover ,
25781
+ &.k-state-hover,
25482
25782
  &.k-hover {
25483
25783
  color: $drawer-hovered-text;
25484
25784
  background-color: $drawer-hovered-bg;
25485
25785
  }
25486
25786
  }
25487
25787
 
25488
- &.k-state-selected ,
25788
+ &.k-state-selected,
25489
25789
  &.k-selected {
25490
25790
  color: $drawer-selected-text;
25491
25791
  background-color: $drawer-selected-bg;
25492
25792
 
25493
25793
  &:hover,
25494
- &.k-state-hover ,
25794
+ &.k-state-hover,
25495
25795
  &.k-hover {
25496
25796
  color: $drawer-selected-hover-text;
25497
25797
  background-color: $drawer-selected-hover-bg;
@@ -26748,7 +27048,7 @@ $bottom-nav-flat-border: $component-border !default;
26748
27048
  outline: 0;
26749
27049
  }
26750
27050
  }
26751
- .k-bottom-nav-item.k-state-disabled ,
27051
+ .k-bottom-nav-item.k-state-disabled,
26752
27052
  .k-bottom-nav-item.k-disabled {
26753
27053
  background-color: initial;
26754
27054
  }
@@ -26803,7 +27103,7 @@ $bottom-nav-flat-border: $component-border !default;
26803
27103
  @include fill( $bg: rgba(true-mix( $color, contrast-wcag( $color ), 35%), .2));
26804
27104
  }
26805
27105
 
26806
- .k-bottom-nav-item.k-state-selected ,
27106
+ .k-bottom-nav-item.k-state-selected,
26807
27107
  .k-bottom-nav-item.k-selected {
26808
27108
  @include fill( $color: contrast-wcag( $color ) );
26809
27109
  }
@@ -26827,7 +27127,7 @@ $bottom-nav-flat-border: $component-border !default;
26827
27127
  }
26828
27128
 
26829
27129
  @each $name, $color in $kendo-theme-colors {
26830
- &.k-bottom-nav-#{$name} .k-bottom-nav-item.k-state-selected ,
27130
+ &.k-bottom-nav-#{$name} .k-bottom-nav-item.k-state-selected,
26831
27131
  &.k-bottom-nav-#{$name} .k-bottom-nav-item.k-selected {
26832
27132
  @if $name == "secondary" or $name == "light" {
26833
27133
  @include fill( $color: try-shade($color, 3) );
@@ -27083,7 +27383,7 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
27083
27383
  text-decoration: $link-decoration;
27084
27384
 
27085
27385
  &:hover,
27086
- &.k-state-hover ,
27386
+ &.k-state-hover,
27087
27387
  &.k-hover {
27088
27388
  text-decoration: $link-hover-decoration;
27089
27389
  }
@@ -27104,7 +27404,7 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
27104
27404
  );
27105
27405
 
27106
27406
  &:focus,
27107
- &.k-state-focused ,
27407
+ &.k-state-focused,
27108
27408
  &.k-focus {
27109
27409
  @include box-shadow( $breadcrumb-focused-shadow );
27110
27410
  }
@@ -27121,7 +27421,7 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
27121
27421
 
27122
27422
  // Hovered state
27123
27423
  &:hover,
27124
- &.k-state-hover ,
27424
+ &.k-state-hover,
27125
27425
  &.k-hover {
27126
27426
  @include fill(
27127
27427
  $breadcrumb-link-hovered-text,
@@ -27132,7 +27432,7 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
27132
27432
 
27133
27433
  // Focused state
27134
27434
  &:focus,
27135
- &.k-state-focused ,
27435
+ &.k-state-focused,
27136
27436
  &.k-focus {
27137
27437
  @include fill(
27138
27438
  $breadcrumb-link-focused-text,
@@ -27154,7 +27454,7 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
27154
27454
 
27155
27455
  // Hovered state
27156
27456
  &:hover,
27157
- &.k-state-hover ,
27457
+ &.k-state-hover,
27158
27458
  &.k-hover {
27159
27459
  @include fill(
27160
27460
  $breadcrumb-root-link-hovered-text,
@@ -27165,7 +27465,7 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
27165
27465
 
27166
27466
  // Focused state
27167
27467
  &:focus,
27168
- &.k-state-focused ,
27468
+ &.k-state-focused,
27169
27469
  &.k-focus {
27170
27470
  @include fill(
27171
27471
  $breadcrumb-root-link-focused-text,
@@ -27189,7 +27489,7 @@ $breadcrumb-focused-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
27189
27489
  color: $breadcrumb-active-color;
27190
27490
  }
27191
27491
 
27192
- .k-state-disabled ,
27492
+ .k-state-disabled,
27193
27493
  .k-disabled {
27194
27494
  opacity: 1;
27195
27495
  filter: none;
@@ -27332,7 +27632,7 @@ $pager-dropdown-width: 5em !default;
27332
27632
 
27333
27633
  // Focused state
27334
27634
  &:focus,
27335
- &.k-state-focus ,
27635
+ &.k-state-focus,
27336
27636
  &.k-focus {
27337
27637
  z-index: 3;
27338
27638
  }
@@ -27382,7 +27682,7 @@ $pager-dropdown-width: 5em !default;
27382
27682
  &:hover {
27383
27683
  z-index: 2;
27384
27684
  }
27385
- &.k-state-disabled ,
27685
+ &.k-state-disabled,
27386
27686
  &.k-disabled {
27387
27687
  color: inherit;
27388
27688
  }
@@ -27432,7 +27732,7 @@ $pager-dropdown-width: 5em !default;
27432
27732
  }
27433
27733
 
27434
27734
  // Selected state
27435
- .k-state-selected ,
27735
+ .k-state-selected,
27436
27736
  .k-selected {
27437
27737
  cursor: inherit;
27438
27738
  z-index: 2;
@@ -27605,7 +27905,7 @@ $pager-dropdown-width: 5em !default;
27605
27905
  &:focus,
27606
27906
  &.k-focus,
27607
27907
  &.k-state-focus,
27608
- &.k-state-focused ,
27908
+ &.k-state-focused,
27609
27909
  &.k-focus {
27610
27910
  @include fill( $bg: $pager-focus-bg );
27611
27911
  @include box-shadow( $pager-focus-shadow );
@@ -27621,7 +27921,7 @@ $pager-dropdown-width: 5em !default;
27621
27921
  );
27622
27922
 
27623
27923
  &:hover,
27624
- &.k-state-hover ,
27924
+ &.k-state-hover,
27625
27925
  &.k-hover {
27626
27926
  @include fill(
27627
27927
  $pager-item-hover-text,
@@ -27630,7 +27930,7 @@ $pager-dropdown-width: 5em !default;
27630
27930
  );
27631
27931
  }
27632
27932
 
27633
- &.k-state-selected ,
27933
+ &.k-state-selected,
27634
27934
  &.k-selected {
27635
27935
  @include fill(
27636
27936
  $pager-item-selected-text,
@@ -27640,7 +27940,7 @@ $pager-dropdown-width: 5em !default;
27640
27940
  }
27641
27941
 
27642
27942
  &:focus,
27643
- &.k-state-focus ,
27943
+ &.k-state-focus,
27644
27944
  &.k-focus {
27645
27945
  background-color: $pager-item-focus-bg;
27646
27946
  @include box-shadow( $pager-item-focus-shadow );
@@ -27664,7 +27964,7 @@ $pager-dropdown-width: 5em !default;
27664
27964
  );
27665
27965
 
27666
27966
  &:hover,
27667
- &.k-state-hover ,
27967
+ &.k-state-hover,
27668
27968
  &.k-hover {
27669
27969
  @include fill(
27670
27970
  $pager-number-hover-text,
@@ -27674,13 +27974,13 @@ $pager-dropdown-width: 5em !default;
27674
27974
  }
27675
27975
 
27676
27976
  &:focus,
27677
- &.k-state-focus ,
27977
+ &.k-state-focus,
27678
27978
  &.k-focus {
27679
27979
  background-color: $pager-number-focus-bg;
27680
27980
  @include box-shadow( $pager-number-focus-shadow );
27681
27981
  }
27682
27982
 
27683
- &.k-state-selected ,
27983
+ &.k-state-selected,
27684
27984
  &.k-selected {
27685
27985
  @include fill(
27686
27986
  $pager-number-selected-text,
@@ -27713,7 +28013,7 @@ $pager-dropdown-width: 5em !default;
27713
28013
  );
27714
28014
 
27715
28015
  &:hover,
27716
- &.k-state-hover ,
28016
+ &.k-state-hover,
27717
28017
  &.k-hover {
27718
28018
  @include fill(
27719
28019
  $dropdownlist-hovered-text,
@@ -27734,7 +28034,7 @@ $pager-dropdown-width: 5em !default;
27734
28034
  .k-link {
27735
28035
 
27736
28036
  &:hover,
27737
- &.k-state-hover ,
28037
+ &.k-state-hover,
27738
28038
  &.k-hover {
27739
28039
  @include fill(
27740
28040
  $kendo-list-item-hover-text,
@@ -27742,7 +28042,7 @@ $pager-dropdown-width: 5em !default;
27742
28042
  );
27743
28043
  }
27744
28044
 
27745
- &.k-state-selected ,
28045
+ &.k-state-selected,
27746
28046
  &.k-selected {
27747
28047
  @include fill(
27748
28048
  $kendo-list-item-selected-text,
@@ -27782,7 +28082,7 @@ $pager-dropdown-width: 5em !default;
27782
28082
  );
27783
28083
 
27784
28084
  &:hover,
27785
- &.k-state-hover ,
28085
+ &.k-state-hover,
27786
28086
  &.k-hover {
27787
28087
  @include fill(
27788
28088
  $pager-text,
@@ -28049,7 +28349,7 @@ $stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0ms !def
28049
28349
  opacity: $stepper-optional-label-opacity;
28050
28350
  }
28051
28351
  .k-step-disabled .k-step-label-optional,
28052
- &.k-state-disabled .k-step-label-optional ,
28352
+ &.k-state-disabled .k-step-label-optional,
28053
28353
  &.k-disabled .k-step-label-optional {
28054
28354
  color: inherit;
28055
28355
  }
@@ -28367,7 +28667,7 @@ $stepper-content-transition-timing-function: cubic-bezier(.4, 0, .2, 1) 0ms !def
28367
28667
  $bg: $stepper-progressbar-bg
28368
28668
  );
28369
28669
 
28370
- .k-state-selected ,
28670
+ .k-state-selected,
28371
28671
  .k-selected {
28372
28672
  @include fill(
28373
28673
  $color: $stepper-progressbar-fill-text,
@@ -28618,13 +28918,13 @@ $tabstrip-content-border-focused: $component-text !default;
28618
28918
  position: relative;
28619
28919
  z-index: 1;
28620
28920
 
28621
- &.k-state-active ,
28921
+ &.k-state-active,
28622
28922
  &.k-active {
28623
28923
  display: block;
28624
28924
  }
28625
28925
 
28626
28926
  &:focus,
28627
- &.k-state-focused ,
28927
+ &.k-state-focused,
28628
28928
  &.k-focus {
28629
28929
  outline-width: 1px;
28630
28930
  outline-style: dotted;
@@ -28713,7 +29013,7 @@ $tabstrip-content-border-focused: $component-text !default;
28713
29013
  margin-left: $tabstrip-item-gap;
28714
29014
  }
28715
29015
 
28716
- .k-item.k-state-active ,
29016
+ .k-item.k-state-active,
28717
29017
  .k-item.k-active {
28718
29018
  border-bottom-color: transparent;
28719
29019
  }
@@ -28743,7 +29043,7 @@ $tabstrip-content-border-focused: $component-text !default;
28743
29043
  margin-left: $tabstrip-item-gap;
28744
29044
  }
28745
29045
 
28746
- .k-item.k-state-active ,
29046
+ .k-item.k-state-active,
28747
29047
  .k-item.k-active {
28748
29048
  border-top-color: transparent;
28749
29049
  }
@@ -28777,7 +29077,7 @@ $tabstrip-content-border-focused: $component-text !default;
28777
29077
  margin-top: $tabstrip-item-gap;
28778
29078
  }
28779
29079
 
28780
- .k-item.k-state-active ,
29080
+ .k-item.k-state-active,
28781
29081
  .k-item.k-active {
28782
29082
  border-right-color: transparent;
28783
29083
  }
@@ -28813,7 +29113,7 @@ $tabstrip-content-border-focused: $component-text !default;
28813
29113
  margin-top: $tabstrip-item-gap;
28814
29114
  }
28815
29115
 
28816
- .k-item.k-state-active ,
29116
+ .k-item.k-state-active,
28817
29117
  .k-item.k-active {
28818
29118
  border-left-color: transparent;
28819
29119
  }
@@ -28859,7 +29159,7 @@ $tabstrip-content-border-focused: $component-text !default;
28859
29159
  border-left-width: $tabstrip-indicator-size;
28860
29160
  }
28861
29161
  }
28862
- .k-item.k-state-active::after ,
29162
+ .k-item.k-state-active::after,
28863
29163
  .k-item.k-active::after {
28864
29164
  display: block;
28865
29165
  }
@@ -28933,7 +29233,7 @@ $tabstrip-content-border-focused: $component-text !default;
28933
29233
  );
28934
29234
 
28935
29235
  &:hover,
28936
- &.k-state-hover ,
29236
+ &.k-state-hover,
28937
29237
  &.k-hover {
28938
29238
  @include fill(
28939
29239
  $tabstrip-item-hovered-text,
@@ -28946,7 +29246,7 @@ $tabstrip-content-border-focused: $component-text !default;
28946
29246
  &:active,
28947
29247
  &.k-state-active,
28948
29248
  &.k-active,
28949
- &.k-state-selected ,
29249
+ &.k-state-selected,
28950
29250
  &.k-selected {
28951
29251
  @include fill(
28952
29252
  $tabstrip-item-selected-text,
@@ -28957,7 +29257,7 @@ $tabstrip-content-border-focused: $component-text !default;
28957
29257
  }
28958
29258
 
28959
29259
  &:focus,
28960
- &.k-state-focused ,
29260
+ &.k-state-focused,
28961
29261
  &.k-focus {
28962
29262
  @include box-shadow( $tabstrip-item-focused-shadow );
28963
29263
  }
@@ -28980,7 +29280,7 @@ $tabstrip-content-border-focused: $component-text !default;
28980
29280
  );
28981
29281
 
28982
29282
  &:focus,
28983
- &.k-state-focused ,
29283
+ &.k-state-focused,
28984
29284
  &.k-focus {
28985
29285
  outline-color: $tabstrip-content-border-focused;
28986
29286
  }
@@ -28991,7 +29291,7 @@ $tabstrip-content-border-focused: $component-text !default;
28991
29291
  @if ($tabstrip-indicator-size) {
28992
29292
 
28993
29293
  .k-tabstrip-items-wrapper {
28994
- .k-item.k-state-active::after ,
29294
+ .k-item.k-state-active::after,
28995
29295
  .k-item.k-active::after {
28996
29296
  border-color: $tabstrip-indicator-color;
28997
29297
  }
@@ -29010,7 +29310,7 @@ $tabstrip-content-border-focused: $component-text !default;
29010
29310
 
29011
29311
  > .k-tabstrip-items .k-item.k-state-hover,
29012
29312
  > .k-tabstrip-items .k-item.k-hover,
29013
- > .k-tabstrip-items .k-item.k-state-active ,
29313
+ > .k-tabstrip-items .k-item.k-state-active,
29014
29314
  > .k-tabstrip-items .k-item.k-active {
29015
29315
  border-bottom-color: transparent;
29016
29316
  }
@@ -29019,7 +29319,7 @@ $tabstrip-content-border-focused: $component-text !default;
29019
29319
 
29020
29320
  > .k-tabstrip-items .k-item.k-state-hover,
29021
29321
  > .k-tabstrip-items .k-item.k-hover,
29022
- > .k-tabstrip-items .k-item.k-state-active ,
29322
+ > .k-tabstrip-items .k-item.k-state-active,
29023
29323
  > .k-tabstrip-items .k-item.k-active {
29024
29324
  border-top-color: transparent;
29025
29325
  }
@@ -29028,7 +29328,7 @@ $tabstrip-content-border-focused: $component-text !default;
29028
29328
 
29029
29329
  > .k-tabstrip-items .k-item.k-state-hover,
29030
29330
  > .k-tabstrip-items .k-item.k-hover,
29031
- > .k-tabstrip-items .k-item.k-state-active ,
29331
+ > .k-tabstrip-items .k-item.k-state-active,
29032
29332
  > .k-tabstrip-items .k-item.k-active {
29033
29333
  border-right-color: transparent;
29034
29334
  }
@@ -29037,7 +29337,7 @@ $tabstrip-content-border-focused: $component-text !default;
29037
29337
 
29038
29338
  > .k-tabstrip-items .k-item.k-state-hover,
29039
29339
  > .k-tabstrip-items .k-item.k-hover,
29040
- > .k-tabstrip-items .k-item.k-state-active ,
29340
+ > .k-tabstrip-items .k-item.k-state-active,
29041
29341
  > .k-tabstrip-items .k-item.k-active {
29042
29342
  border-left-color: transparent;
29043
29343
  }
@@ -29128,7 +29428,7 @@ $wizard-focused-shadow: inset 0 0 0 2px rgba(0, 0, 0, .13) !default;
29128
29428
  justify-content: space-between;
29129
29429
 
29130
29430
  &:focus,
29131
- &.k-state-focused ,
29431
+ &.k-state-focused,
29132
29432
  &.k-focus {
29133
29433
  outline-width: 1px;
29134
29434
  outline-style: dotted;
@@ -29225,13 +29525,13 @@ $wizard-focused-shadow: inset 0 0 0 2px rgba(0, 0, 0, .13) !default;
29225
29525
  @include exports("wizard/theme") {
29226
29526
  .k-wizard-step {
29227
29527
  &:focus,
29228
- &.k-state-focused ,
29528
+ &.k-state-focused,
29229
29529
  &.k-focus {
29230
29530
  outline-color: $wizard-step-border-focused;
29231
29531
  }
29232
29532
 
29233
29533
  .k-ie &:focus,
29234
- .k-ie &.k-state-focused ,
29534
+ .k-ie &.k-state-focused,
29235
29535
  .k-ie &.k-focus {
29236
29536
  @include box-shadow($wizard-focused-shadow);
29237
29537
  outline: none;
@@ -29402,7 +29702,7 @@ $expander-content-padding-y: $expander-content-padding-x !default;
29402
29702
  $expander-border
29403
29703
  );
29404
29704
 
29405
- &.k-state-focus ,
29705
+ &.k-state-focus,
29406
29706
  &.k-focus {
29407
29707
  box-shadow: $expander-focus-shadow;
29408
29708
  }
@@ -29417,13 +29717,13 @@ $expander-content-padding-y: $expander-content-padding-x !default;
29417
29717
  outline: none;
29418
29718
 
29419
29719
  &:hover,
29420
- &.k-state-hover ,
29720
+ &.k-state-hover,
29421
29721
  &.k-hover {
29422
29722
  background-color: $expander-header-hover-bg;
29423
29723
  }
29424
29724
 
29425
29725
  // Should be removed
29426
- &.k-state-focused ,
29726
+ &.k-state-focused,
29427
29727
  &.k-focus {
29428
29728
  background-color: $expander-header-focused-bg;
29429
29729
  box-shadow: $expander-header-focused-shadow;
@@ -29796,7 +30096,7 @@ $panelbar-header-expanded-gradient: null !default;
29796
30096
 
29797
30097
  // Hover
29798
30098
  > .k-link:hover,
29799
- > .k-link.k-state-hover ,
30099
+ > .k-link.k-state-hover,
29800
30100
  > .k-link.k-hover {
29801
30101
  @include fill(
29802
30102
  $panelbar-header-hovered-text,
@@ -29810,7 +30110,7 @@ $panelbar-header-expanded-gradient: null !default;
29810
30110
  > .k-link:focus,
29811
30111
  > .k-link.k-state-focus,
29812
30112
  > .k-link.k-focus,
29813
- > .k-link.k-state-focused ,
30113
+ > .k-link.k-state-focused,
29814
30114
  > .k-link.k-focus {
29815
30115
  @include fill(
29816
30116
  $panelbar-header-focused-text,
@@ -29823,7 +30123,7 @@ $panelbar-header-expanded-gradient: null !default;
29823
30123
 
29824
30124
  // Focus & Hover
29825
30125
  > .k-link:focus:hover,
29826
- > .k-link.k-state-focus.k-state-hover ,
30126
+ > .k-link.k-state-focus.k-state-hover,
29827
30127
  > .k-link.k-focus.k-hover {
29828
30128
  @include fill(
29829
30129
  $panelbar-header-hovered-focused-text,
@@ -29834,7 +30134,7 @@ $panelbar-header-expanded-gradient: null !default;
29834
30134
  }
29835
30135
 
29836
30136
  // Selected
29837
- > .k-link.k-state-selected ,
30137
+ > .k-link.k-state-selected,
29838
30138
  > .k-link.k-selected {
29839
30139
  @include fill(
29840
30140
  $panelbar-header-selected-text,
@@ -29852,7 +30152,7 @@ $panelbar-header-expanded-gradient: null !default;
29852
30152
  // Selected Hover
29853
30153
  > .k-link.k-state-selected:hover,
29854
30154
  > .k-link.k-selected:hover,
29855
- > .k-link.k-state-selected.k-state-hover ,
30155
+ > .k-link.k-state-selected.k-state-hover,
29856
30156
  > .k-link.k-selected.k-hover {
29857
30157
  @include fill(
29858
30158
  $panelbar-header-selected-hovered-text,
@@ -29867,7 +30167,7 @@ $panelbar-header-expanded-gradient: null !default;
29867
30167
  > .k-link.k-selected:focus,
29868
30168
  > .k-link.k-state-selected.k-state-focus,
29869
30169
  > .k-link.k-selected.k-focus,
29870
- > .k-link.k-state-selected.k-state-focused ,
30170
+ > .k-link.k-state-selected.k-state-focused,
29871
30171
  > .k-link.k-selected.k-focused {
29872
30172
  @include fill(
29873
30173
  $panelbar-header-selected-focused-text,
@@ -29882,7 +30182,7 @@ $panelbar-header-expanded-gradient: null !default;
29882
30182
  > .k-link.k-selected:hover:focus,
29883
30183
  > .k-link.k-state-selected.k-state-hover.k-state-focus,
29884
30184
  > .k-link.k-selected.k-hover.k-state-focus,
29885
- > .k-link.k-state-selected.k-state-hover.k-state-focused ,
30185
+ > .k-link.k-state-selected.k-state-hover.k-state-focused,
29886
30186
  > .k-link.k-selected.k-hover.k-state-focused {
29887
30187
  @include fill(
29888
30188
  $panelbar-header-selected-hovered-focused-text,
@@ -29903,7 +30203,7 @@ $panelbar-header-expanded-gradient: null !default;
29903
30203
  > .k-item > .k-link.k-state-hover,
29904
30204
  > .k-item > .k-link.k-hover,
29905
30205
  > .k-panelbar-item > .k-link:hover,
29906
- > .k-panelbar-item > .k-link.k-state-hover ,
30206
+ > .k-panelbar-item > .k-link.k-state-hover,
29907
30207
  > .k-panelbar-item > .k-link.k-hover {
29908
30208
  @include fill(
29909
30209
  $panelbar-item-hovered-text,
@@ -29922,7 +30222,7 @@ $panelbar-header-expanded-gradient: null !default;
29922
30222
  > .k-panelbar-item > .k-link:focus,
29923
30223
  > .k-panelbar-item > .k-link.k-state-focus,
29924
30224
  > .k-panelbar-item > .k-link.k-focus,
29925
- > .k-panelbar-item > .k-link.k-state-focused ,
30225
+ > .k-panelbar-item > .k-link.k-state-focused,
29926
30226
  > .k-panelbar-item > .k-link.k-focus {
29927
30227
  @include fill(
29928
30228
  $panelbar-item-focused-text,
@@ -29938,7 +30238,7 @@ $panelbar-header-expanded-gradient: null !default;
29938
30238
  > .k-item > .k-link.k-state-focus.k-state-hover,
29939
30239
  > .k-item > .k-link.k-focus.k-hover,
29940
30240
  > .k-panelbar-item > .k-link:focus:hover,
29941
- > .k-panelbar-item > .k-link.k-state-focus.k-state-hover ,
30241
+ > .k-panelbar-item > .k-link.k-state-focus.k-state-hover,
29942
30242
  > .k-panelbar-item > .k-link.k-focus.k-hover {
29943
30243
  @include fill(
29944
30244
  $panelbar-item-hovered-focused-text,
@@ -29951,7 +30251,7 @@ $panelbar-header-expanded-gradient: null !default;
29951
30251
  // Selected
29952
30252
  > .k-item > .k-link.k-state-selected,
29953
30253
  > .k-item > .k-link.k-selected,
29954
- > .k-panelbar-item > .k-link.k-state-selected ,
30254
+ > .k-panelbar-item > .k-link.k-state-selected,
29955
30255
  > .k-panelbar-item > .k-link.k-selected {
29956
30256
  @include fill(
29957
30257
  $panelbar-item-selected-text,
@@ -29968,7 +30268,7 @@ $panelbar-header-expanded-gradient: null !default;
29968
30268
  > .k-item > .k-link.k-selected.k-hover,
29969
30269
  > .k-panelbar-item > .k-link.k-state-selected:hover,
29970
30270
  > .k-panelbar-item > .k-link.k-selected:hover,
29971
- > .k-panelbar-item > .k-link.k-state-selected.k-state-hover ,
30271
+ > .k-panelbar-item > .k-link.k-state-selected.k-state-hover,
29972
30272
  > .k-panelbar-item > .k-link.k-selected.k-hover {
29973
30273
  @include fill(
29974
30274
  $panelbar-item-selected-hovered-text,
@@ -29989,7 +30289,7 @@ $panelbar-header-expanded-gradient: null !default;
29989
30289
  > .k-panelbar-item > .k-link.k-selected:focus,
29990
30290
  > .k-panelbar-item > .k-link.k-state-selected.k-state-focus,
29991
30291
  > .k-panelbar-item > .k-link.k-selected.k-focus,
29992
- > .k-item > .k-link.k-state-selected.k-state-focused ,
30292
+ > .k-item > .k-link.k-state-selected.k-state-focused,
29993
30293
  > .k-item > .k-link.k-selected.k-focused {
29994
30294
  @include fill(
29995
30295
  $panelbar-item-selected-focused-text,
@@ -30010,7 +30310,7 @@ $panelbar-header-expanded-gradient: null !default;
30010
30310
  > .k-panelbar-item > .k-link.k-selected:focus:hover,
30011
30311
  > .k-panelbar-item > .k-link.k-state-selected.k-state-focus.k-state-hover,
30012
30312
  > .k-panelbar-item > .k-link.k-selected.k-focus.k-state-hover,
30013
- > .k-item > .k-link.k-state-selected.k-state-focused.k-state-hover ,
30313
+ > .k-item > .k-link.k-state-selected.k-state-focused.k-state-hover,
30014
30314
  > .k-item > .k-link.k-selected.k-focused.k-state-hover {
30015
30315
  @include fill(
30016
30316
  $panelbar-item-selected-hovered-focused-text,
@@ -30304,7 +30604,7 @@ $splitbar-selected-text: $selected-text !default;
30304
30604
  .k-splitbar:focus,
30305
30605
  .k-splitbar.k-state-focus,
30306
30606
  .k-splitbar.k-focus,
30307
- .k-splitbar.k-state-focused ,
30607
+ .k-splitbar.k-state-focused,
30308
30608
  .k-splitbar.k-focus {
30309
30609
  color: $splitbar-selected-text;
30310
30610
  background: $splitbar-selected-bg;
@@ -30417,7 +30717,7 @@ $tilelayout-hint-border: $component-border !default;
30417
30717
  .k-tilelayout-item:focus,
30418
30718
  .k-tilelayout-item.k-focus,
30419
30719
  .k-tilelayout-item.k-state-focus,
30420
- .k-tilelayout-item.k-state-focused ,
30720
+ .k-tilelayout-item.k-state-focused,
30421
30721
  .k-tilelayout-item.k-focus {
30422
30722
  @include box-shadow($tilelayout-card-focus-shadow);
30423
30723
  }
@@ -31093,12 +31393,12 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
31093
31393
 
31094
31394
  .k-column-menu {
31095
31395
 
31096
- .k-listgroup-item.k-state-selected ,
31396
+ .k-listgroup-item.k-state-selected,
31097
31397
  .k-listgroup-item.k-selected {
31098
31398
  color: $adaptive-grid-sort-text;
31099
31399
  background: none;
31100
31400
  }
31101
- .k-listgroup-item.k-state-selected .k-link ,
31401
+ .k-listgroup-item.k-state-selected .k-link,
31102
31402
  .k-listgroup-item.k-selected .k-link {
31103
31403
  color: inherit;
31104
31404
  }
@@ -31843,7 +32143,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
31843
32143
  &.k-i-sort-desc-sm,
31844
32144
  &.k-i-sort-asc-sm {
31845
32145
  vertical-align: text-top;
31846
- margin-left: $grid-sorted-icon-spacing;
32146
+ margin-inline-start: $grid-sorted-icon-spacing;
31847
32147
  }
31848
32148
  }
31849
32149
 
@@ -31853,7 +32153,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
31853
32153
  height: $icon-size;
31854
32154
  font-size: $grid-sorting-index-font-size;
31855
32155
  margin-top: $grid-sorting-index-spacing-y;
31856
- margin-left: $grid-sorting-index-spacing-x;
32156
+ margin-inline-start: $grid-sorting-index-spacing-x;
31857
32157
  }
31858
32158
  }
31859
32159
 
@@ -32254,15 +32554,15 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32254
32554
  }
32255
32555
 
32256
32556
  .k-header > .k-cell-inner {
32257
- margin: (-1 * $grid-header-padding-y) calc(-1 * calc( #{$kendo-button-calc-size} - #{$grid-cell-padding-x})) (-1 * $grid-header-padding-y) (-1 * $grid-cell-padding-x);
32557
+ margin: (-1 * $grid-header-padding-y) (-1 * $grid-header-padding-x);
32258
32558
  }
32259
32559
 
32260
32560
  .k-filterable {
32261
32561
  > .k-cell-inner {
32262
- margin: (-1 * $grid-header-padding-y) calc(-1 * #{$kendo-button-calc-size}) (-1 * $grid-header-padding-y) (-1 * $grid-cell-padding-x);
32562
+ margin-inline-end: calc(-1 * #{$grid-filterable-icon-spacing});
32263
32563
 
32264
32564
  .k-link {
32265
- padding-right: 0;
32565
+ padding-inline-end: 0;
32266
32566
  }
32267
32567
  }
32268
32568
  }
@@ -32301,6 +32601,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32301
32601
  .k-grid-filter,
32302
32602
  .k-header-column-menu {
32303
32603
  position: static;
32604
+ margin-inline-end: $grid-header-menu-icon-spacing;
32304
32605
  }
32305
32606
 
32306
32607
  .k-grid-filter,
@@ -32611,28 +32912,6 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32611
32912
  margin-left: $icon-spacing;
32612
32913
  margin-right: 0;
32613
32914
  }
32614
-
32615
- .k-header > .k-cell-inner {
32616
- margin-right: (-1 * $grid-cell-padding-x);
32617
- margin-left: calc(-1 * calc( #{$kendo-button-calc-size} - #{$grid-cell-padding-x}));
32618
-
32619
- .k-sort-order {
32620
- margin-right: $grid-sorting-index-spacing-x;
32621
- margin-left: 0;
32622
- }
32623
- }
32624
-
32625
- .k-filterable {
32626
- > .k-cell-inner {
32627
- margin-right: (-1 * $grid-cell-padding-x);
32628
- margin-left: calc(-1 * #{$kendo-button-calc-size});
32629
-
32630
- .k-link {
32631
- padding-right: $grid-header-padding-x;
32632
- padding-left: 0;
32633
- }
32634
- }
32635
- }
32636
32915
  }
32637
32916
  }
32638
32917
 
@@ -32690,9 +32969,9 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32690
32969
  }
32691
32970
 
32692
32971
  // Hover state
32693
- tbody tr:not(.k-detail-row):hover,
32694
- tbody tr:not(.k-detail-row).k-state-hover ,
32695
- tbody tr:not(.k-detail-row).k-hover {
32972
+ tbody>tr:not(.k-detail-row):hover,
32973
+ tbody>tr:not(.k-detail-row).k-state-hover,
32974
+ tbody>tr:not(.k-detail-row).k-hover {
32696
32975
  color: $grid-hovered-text;
32697
32976
  background-color: $grid-hovered-bg;
32698
32977
  }
@@ -32702,7 +32981,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32702
32981
  th.k-selected,
32703
32982
  td.k-state-selected,
32704
32983
  td.k-selected,
32705
- tr.k-state-selected > td ,
32984
+ tr.k-state-selected > td,
32706
32985
  tr.k-selected > td {
32707
32986
  color: $grid-selected-text;
32708
32987
  background-color: $grid-selected-bg;
@@ -32753,12 +33032,12 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32753
33032
  }
32754
33033
 
32755
33034
  // Selected state
32756
- .k-state-selected td ,
33035
+ .k-state-selected td,
32757
33036
  .k-selected td {
32758
33037
  @include fill( $bg: $grid-sticky-selected-bg );
32759
33038
  }
32760
33039
 
32761
- .k-state-selected.k-alt td ,
33040
+ .k-state-selected.k-alt td,
32762
33041
  .k-selected.k-alt td {
32763
33042
  @include fill( $bg: $grid-sticky-selected-alt-bg );
32764
33043
  }
@@ -32766,7 +33045,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32766
33045
  // Selected hover
32767
33046
  .k-state-selected:hover td,
32768
33047
  .k-selected:hover td,
32769
- .k-state-selected.k-state-hover td ,
33048
+ .k-state-selected.k-state-hover td,
32770
33049
  .k-selected.k-hover td {
32771
33050
  @include fill( $bg: $grid-sticky-selected-hovered-bg );
32772
33051
  }
@@ -32826,7 +33105,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32826
33105
  &.k-state-border-down {
32827
33106
  box-shadow: inset 0 0 0 2px rgba( 0, 0, 0, .1 );
32828
33107
  }
32829
- &.k-state-active ,
33108
+ &.k-state-active,
32830
33109
  &.k-active {
32831
33110
  color: $selected-text;
32832
33111
  background-color: $selected-bg;
@@ -32884,7 +33163,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32884
33163
  &.k-selected .k-grid-content-sticky,
32885
33164
  &.k-state-selected .k-grid-row-sticky,
32886
33165
  &.k-selected .k-grid-row-sticky,
32887
- td.k-grid-content-sticky.k-state-selected ,
33166
+ td.k-grid-content-sticky.k-state-selected,
32888
33167
  td.k-grid-content-sticky.k-selected {
32889
33168
  @include fill( $bg: $grid-sticky-selected-bg );
32890
33169
  }
@@ -32893,7 +33172,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32893
33172
  &.k-selected.k-alt .k-grid-content-sticky,
32894
33173
  &.k-state-selected.k-alt .k-grid-row-sticky,
32895
33174
  &.k-selected.k-alt .k-grid-row-sticky,
32896
- &.k-alt td.k-grid-content-sticky.k-state-selected ,
33175
+ &.k-alt td.k-grid-content-sticky.k-state-selected,
32897
33176
  &.k-alt td.k-grid-content-sticky.k-selected {
32898
33177
  @include fill( $bg: $grid-sticky-selected-alt-bg );
32899
33178
  }
@@ -32904,7 +33183,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32904
33183
  &:hover .k-grid-row-sticky,
32905
33184
  &.k-state-hover .k-grid-content-sticky,
32906
33185
  &.k-hover .k-grid-content-sticky,
32907
- &.k-state-hover .k-grid-row-sticky ,
33186
+ &.k-state-hover .k-grid-row-sticky,
32908
33187
  &.k-hover .k-grid-row-sticky {
32909
33188
  background-color: $grid-sticky-hovered-bg;
32910
33189
  }
@@ -32921,7 +33200,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32921
33200
  &.k-selected.k-hover .k-grid-row-sticky,
32922
33201
  &:hover td.k-grid-content-sticky.k-state-selected,
32923
33202
  &:hover td.k-grid-content-sticky.k-selected,
32924
- &.k-state-hover td.k-grid-content-sticky.k-state-selected ,
33203
+ &.k-state-hover td.k-grid-content-sticky.k-state-selected,
32925
33204
  &.k-hover td.k-grid-content-sticky.k-selected {
32926
33205
  background-color: $grid-sticky-selected-hovered-bg;
32927
33206
  }
@@ -32935,7 +33214,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32935
33214
  background-color: $grid-sticky-bg;
32936
33215
 
32937
33216
  &:hover,
32938
- &.k-state-hover ,
33217
+ &.k-state-hover,
32939
33218
  &.k-hover {
32940
33219
  background-color: $grid-sticky-hovered-bg;
32941
33220
  }
@@ -32947,7 +33226,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32947
33226
  background-color: $grid-sticky-bg;
32948
33227
 
32949
33228
  &:hover td,
32950
- &.k-state-hover td ,
33229
+ &.k-state-hover td,
32951
33230
  &.k-hover td {
32952
33231
  background-color: $grid-sticky-hovered-bg;
32953
33232
  }
@@ -32965,7 +33244,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32965
33244
  .k-selected.k-grid-row-sticky td,
32966
33245
  .k-grid-row-sticky td.k-state-selected,
32967
33246
  .k-grid-row-sticky td.k-selected,
32968
- .k-state-selected.k-grid-content-sticky ,
33247
+ .k-state-selected.k-grid-content-sticky,
32969
33248
  .k-selected.k-grid-content-sticky {
32970
33249
  @include fill( $bg: $grid-sticky-selected-bg );
32971
33250
  }
@@ -32974,7 +33253,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32974
33253
  tr.k-selected.k-alt .k-grid-content-sticky,
32975
33254
  .k-state-selected.k-alt.k-grid-row-sticky td,
32976
33255
  .k-selected.k-alt.k-grid-row-sticky td,
32977
- .k-alt .k-state-selected.k-grid-content-sticky ,
33256
+ .k-alt .k-state-selected.k-grid-content-sticky,
32978
33257
  .k-alt .k-selected.k-grid-content-sticky {
32979
33258
  @include fill( $bg: $grid-sticky-selected-alt-bg );
32980
33259
  }
@@ -32990,7 +33269,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
32990
33269
  .k-grid-row-sticky.k-alt.k-state-hover td,
32991
33270
  .k-grid-row-sticky.k-alt.k-hover td,
32992
33271
  .k-alt:hover .k-grid-content-sticky,
32993
- .k-alt.k-state-hover .k-grid-content-sticky ,
33272
+ .k-alt.k-state-hover .k-grid-content-sticky,
32994
33273
  .k-alt.k-hover .k-grid-content-sticky {
32995
33274
  background-color: $grid-sticky-hovered-bg;
32996
33275
  }
@@ -33018,7 +33297,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
33018
33297
  .k-grid-row-sticky.k-hover td.k-selected,
33019
33298
  tr:hover .k-grid-content-sticky.k-state-selected,
33020
33299
  tr:hover .k-grid-content-sticky.k-selected,
33021
- tr.k-state-hover .k-grid-content-sticky.k-state-selected ,
33300
+ tr.k-state-hover .k-grid-content-sticky.k-state-selected,
33022
33301
  tr.k-hover .k-grid-content-sticky.k-selected {
33023
33302
  background-color: $grid-sticky-selected-hovered-bg;
33024
33303
  }
@@ -33030,7 +33309,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
33030
33309
  }
33031
33310
 
33032
33311
  &:hover .k-grid-content-sticky,
33033
- &.k-state-hover .k-grid-content-sticky ,
33312
+ &.k-state-hover .k-grid-content-sticky,
33034
33313
  &.k-hover .k-grid-content-sticky {
33035
33314
  @include fill( $bg: $grid-sticky-hovered-bg );
33036
33315
  }
@@ -33043,7 +33322,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
33043
33322
  }
33044
33323
 
33045
33324
  &:hover .k-grid-footer-sticky,
33046
- &.k-state-hover .k-grid-footer-sticky ,
33325
+ &.k-state-hover .k-grid-footer-sticky,
33047
33326
  &.k-hover .k-grid-footer-sticky {
33048
33327
  @include fill( $bg: $grid-sticky-footer-hovered-bg );
33049
33328
  }
@@ -33086,7 +33365,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
33086
33365
  );
33087
33366
  }
33088
33367
  .k-columnmenu-item:focus,
33089
- .k-columnmenu-item.k-state-focus ,
33368
+ .k-columnmenu-item.k-state-focus,
33090
33369
  .k-columnmenu-item.k-focus {
33091
33370
  @include box-shadow( $kendo-list-item-focus-shadow );
33092
33371
  }
@@ -33096,7 +33375,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
33096
33375
  }
33097
33376
 
33098
33377
  .k-columnmenu-item {
33099
- &.k-state-selected ,
33378
+ &.k-state-selected,
33100
33379
  &.k-selected {
33101
33380
  @include fill(
33102
33381
  $kendo-list-item-selected-text,
@@ -33122,7 +33401,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
33122
33401
  );
33123
33402
 
33124
33403
  &:hover,
33125
- &.k-state-hover ,
33404
+ &.k-state-hover,
33126
33405
  &.k-hover {
33127
33406
  @include fill(
33128
33407
  $kendo-list-item-hover-text,
@@ -33130,7 +33409,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
33130
33409
  );
33131
33410
  }
33132
33411
 
33133
- &.k-state-selected ,
33412
+ &.k-state-selected,
33134
33413
  &.k-selected {
33135
33414
  @include fill(
33136
33415
  $kendo-list-item-selected-text,
@@ -33139,7 +33418,7 @@ $adaptive-scheduler-subtle-text: $subtle-text !default;
33139
33418
  }
33140
33419
 
33141
33420
  &:focus,
33142
- &.k-state-focused ,
33421
+ &.k-state-focused,
33143
33422
  &.k-focus {
33144
33423
  @include box-shadow( $kendo-list-item-focus-shadow );
33145
33424
  }
@@ -33378,7 +33657,7 @@ $listview-item-focus-shadow: inset 0 0 0 3px rgba( $listview-text, .15 ) !defaul
33378
33657
  // Listview content
33379
33658
  .k-listview-content {
33380
33659
 
33381
- > .k-state-focused ,
33660
+ > .k-state-focused,
33382
33661
  > .k-focus {
33383
33662
  @include fill(
33384
33663
  $listview-item-focus-text,
@@ -33388,7 +33667,7 @@ $listview-item-focus-shadow: inset 0 0 0 3px rgba( $listview-text, .15 ) !defaul
33388
33667
  @include box-shadow( $listview-item-focus-shadow );
33389
33668
  }
33390
33669
 
33391
- > .k-state-selected ,
33670
+ > .k-state-selected,
33392
33671
  > .k-selected {
33393
33672
  @include fill(
33394
33673
  $listview-item-selected-text,
@@ -33769,7 +34048,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
33769
34048
  overflow: hidden;
33770
34049
 
33771
34050
  // disabled cells in the Spreadsheet should allow navigation if link is used
33772
- .k-state-disabled ,
34051
+ .k-state-disabled,
33773
34052
  .k-disabled {
33774
34053
  pointer-events: auto;
33775
34054
  }
@@ -34331,7 +34610,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
34331
34610
  background-position: 50% 50%;
34332
34611
 
34333
34612
  &:hover div,
34334
- &.k-state-hovered div ,
34613
+ &.k-state-hovered div,
34335
34614
  &.k-hover div {
34336
34615
  margin: 0;
34337
34616
  align-self: center;
@@ -34397,7 +34676,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
34397
34676
  .k-spreadsheet-insert-image-dialog {
34398
34677
  .k-spreadsheet-has-image {
34399
34678
  &:hover,
34400
- &.k-state-hovered ,
34679
+ &.k-state-hovered,
34401
34680
  &.k-hover {
34402
34681
  border-radius: $spreadsheet-insert-image-dialog-preview-overlay-border-radius;
34403
34682
  }
@@ -34574,7 +34853,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
34574
34853
  );
34575
34854
  box-shadow: inset 0 0 0 1px $kendo-button-border;
34576
34855
 
34577
- &.k-state-active ,
34856
+ &.k-state-active,
34578
34857
  &.k-active {
34579
34858
  @include fill(
34580
34859
  $kendo-button-active-text,
@@ -34601,7 +34880,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
34601
34880
  > .k-menu,
34602
34881
  > .k-menu:not(.k-context-menu) {
34603
34882
  .k-item {
34604
- &.k-state-hover ,
34883
+ &.k-state-hover,
34605
34884
  &.k-hover {
34606
34885
  @include fill(
34607
34886
  $kendo-list-item-hover-text,
@@ -34632,13 +34911,13 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
34632
34911
 
34633
34912
  .k-spreadsheet-has-image {
34634
34913
  &:hover,
34635
- &.k-state-hovered ,
34914
+ &.k-state-hovered,
34636
34915
  &.k-hover {
34637
34916
  box-shadow: $spreadsheet-insert-image-dialog-preview-overlay-shadow;
34638
34917
  }
34639
34918
 
34640
34919
  &:hover div,
34641
- &.k-state-hovered div ,
34920
+ &.k-state-hovered div,
34642
34921
  &.k-hover div {
34643
34922
  color: $spreadsheet-insert-image-dialog-overlay-hovered-text;
34644
34923
  }
@@ -34673,7 +34952,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
34673
34952
  .k-button {}
34674
34953
 
34675
34954
  .k-button:hover,
34676
- .k-button.k-state-hover ,
34955
+ .k-button.k-state-hover,
34677
34956
  .k-button.k-hover {
34678
34957
  @include fill(
34679
34958
  $kendo-list-item-hover-text,
@@ -34683,7 +34962,7 @@ $spreadsheet-drawing-anchor-bg: rgba( $selected-bg, .25 ) !default;
34683
34962
  .k-button:active,
34684
34963
  .k-button.k-state-active,
34685
34964
  .k-button.k-active,
34686
- .k-button.k-state-selected ,
34965
+ .k-button.k-state-selected,
34687
34966
  .k-button.k-selected {
34688
34967
  @include fill(
34689
34968
  $kendo-list-item-selected-text,
@@ -35660,7 +35939,7 @@ $pivotgrid-remove-text: null !default;
35660
35939
  // Selected state
35661
35940
  .k-pivotgrid-cell.k-state-selected,
35662
35941
  .k-pivotgrid-cell.k-selected,
35663
- .k-pivotgrid-row.k-state-selected > .k-pivotgrid-cell ,
35942
+ .k-pivotgrid-row.k-state-selected > .k-pivotgrid-cell,
35664
35943
  .k-pivotgrid-row.k-selected > .k-pivotgrid-cell {
35665
35944
  @include fill (
35666
35945
  $pivotgrid-selected-text,
@@ -35892,7 +36171,7 @@ $treelist-footer-row-border-width: 1px !default;
35892
36171
  }
35893
36172
 
35894
36173
  .k-treelist-dragging,
35895
- .k-treelist-dragging .k-state-hover ,
36174
+ .k-treelist-dragging .k-state-hover,
35896
36175
  .k-treelist-dragging .k-hover {
35897
36176
  cursor: default;
35898
36177
  }
@@ -36658,7 +36937,7 @@ $filemanager-preview-icon-border: null !default;
36658
36937
  );
36659
36938
  }
36660
36939
 
36661
- &.k-state-selected .k-file-icon ,
36940
+ &.k-state-selected .k-file-icon,
36662
36941
  &.k-selected .k-file-icon {
36663
36942
  @include fill(
36664
36943
  inherit,
@@ -37122,7 +37401,7 @@ $taskboard-drag-placeholder-border: $component-border !default;
37122
37401
  );
37123
37402
  }
37124
37403
  .k-taskboard-column:focus,
37125
- .k-taskboard-column.k-state-focus ,
37404
+ .k-taskboard-column.k-state-focus,
37126
37405
  .k-taskboard-column.k-focus {
37127
37406
  @include fill(
37128
37407
  $taskboard-column-focus-text,
@@ -37325,7 +37604,7 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
37325
37604
  pointer-events: auto;
37326
37605
  }
37327
37606
 
37328
- .k-editor-content.k-state-focused ,
37607
+ .k-editor-content.k-state-focused,
37329
37608
  .k-editor-content.k-focus {
37330
37609
  outline-width: 1px;
37331
37610
  outline-style: dashed;
@@ -37779,7 +38058,7 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
37779
38058
  display: block;
37780
38059
  margin: auto;
37781
38060
 
37782
- &.k-state-selected ,
38061
+ &.k-state-selected,
37783
38062
  &.k-selected {
37784
38063
  color: inherit;
37785
38064
  border-width: 0;
@@ -38002,7 +38281,7 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
38002
38281
 
38003
38282
  kendo-editor {
38004
38283
  &.k-readonly {
38005
- .k-editor-content.k-state-focused ,
38284
+ .k-editor-content.k-state-focused,
38006
38285
  .k-editor-content.k-focus {
38007
38286
  outline-color: $body-text;
38008
38287
  }
@@ -38040,7 +38319,7 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
38040
38319
 
38041
38320
  // Hover & Actve state
38042
38321
  &:hover,
38043
- &.k-state-active ,
38322
+ &.k-state-active,
38044
38323
  &.k-active {
38045
38324
  border-color: $panel-border;
38046
38325
  }
@@ -38058,7 +38337,7 @@ $editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-line hex
38058
38337
 
38059
38338
  // Insert table
38060
38339
  .k-ct-popup {
38061
- .k-state-selected ,
38340
+ .k-state-selected,
38062
38341
  .k-selected {
38063
38342
  @include fill( $selected-text, $selected-bg, $selected-border, none );
38064
38343
  }
@@ -38616,7 +38895,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
38616
38895
  }
38617
38896
  }
38618
38897
 
38619
- tr.k-state-selected > td:last-child ,
38898
+ tr.k-state-selected > td:last-child,
38620
38899
  tr.k-selected > td:last-child {
38621
38900
  background: transparent;
38622
38901
  }
@@ -38886,7 +39165,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
38886
39165
  border-color: currentColor;
38887
39166
  position: absolute;
38888
39167
  }
38889
- .k-gantt-line.k-state-selected ,
39168
+ .k-gantt-line.k-state-selected,
38890
39169
  .k-gantt-line.k-selected {
38891
39170
  z-index: 3;
38892
39171
  }
@@ -38960,7 +39239,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
38960
39239
  transform: translate(-50%, -50%);
38961
39240
  }
38962
39241
  .k-task-dot:hover::before,
38963
- .k-task-dot.k-state-hover::before ,
39242
+ .k-task-dot.k-state-hover::before,
38964
39243
  .k-task-dot.k-hover::before {
38965
39244
  border-width: 1px;
38966
39245
  }
@@ -39434,7 +39713,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
39434
39713
  $border: $gantt-milestone-border
39435
39714
  );
39436
39715
  }
39437
- .k-task-milestone.k-state-selected .k-task-milestone-content ,
39716
+ .k-task-milestone.k-state-selected .k-task-milestone-content,
39438
39717
  .k-task-milestone.k-selected .k-task-milestone-content {
39439
39718
  @include fill(
39440
39719
  $bg: $gantt-milestone-selected-bg,
@@ -39449,7 +39728,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
39449
39728
  stroke: $gantt-line-fill;
39450
39729
  }
39451
39730
 
39452
- polyline.k-state-selected ,
39731
+ polyline.k-state-selected,
39453
39732
  polyline.k-selected {
39454
39733
  stroke: $gantt-line-selected-fill;
39455
39734
  }
@@ -39503,7 +39782,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
39503
39782
  );
39504
39783
  }
39505
39784
  .k-task-dot:hover::before,
39506
- .k-task-dot.k-state-hover::before ,
39785
+ .k-task-dot.k-state-hover::before,
39507
39786
  .k-task-dot.k-hover::before {
39508
39787
  @include fill(
39509
39788
  $bg: $gantt-dot-hover-bg,
@@ -39529,7 +39808,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
39529
39808
  );
39530
39809
  }
39531
39810
  }
39532
- .k-task-milestone.k-state-selected ,
39811
+ .k-task-milestone.k-state-selected,
39533
39812
  .k-task-milestone.k-selected {
39534
39813
  background-image: none;
39535
39814
  @include fill(
@@ -39560,7 +39839,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
39560
39839
  .k-task-advanced .k-task-summary-complete {
39561
39840
  color: $gantt-advanced-bg;
39562
39841
  }
39563
- .k-task-summary.k-state-selected ,
39842
+ .k-task-summary.k-state-selected,
39564
39843
  .k-task-summary.k-selected {
39565
39844
  color: $gantt-summary-selected-bg;
39566
39845
 
@@ -39604,7 +39883,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
39604
39883
  $bg: $gantt-advanced-bg
39605
39884
  );
39606
39885
  }
39607
- .k-task-single.k-state-selected ,
39886
+ .k-task-single.k-state-selected,
39608
39887
  .k-task-single.k-selected {
39609
39888
  @include fill(
39610
39889
  $gantt-task-selected-text,
@@ -39621,7 +39900,7 @@ $gantt-validation-tooltip-invalid-border: $error !default;
39621
39900
  .k-gantt-line {
39622
39901
  color: $gantt-line-fill;
39623
39902
  }
39624
- .k-gantt-line.k-state-selected ,
39903
+ .k-gantt-line.k-state-selected,
39625
39904
  .k-gantt-line.k-selected {
39626
39905
  color: $gantt-line-selected-fill;
39627
39906
  }
@@ -40280,7 +40559,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
40280
40559
  }
40281
40560
 
40282
40561
  &:hover,
40283
- &.k-state-hover ,
40562
+ &.k-state-hover,
40284
40563
  &.k-hover {
40285
40564
  .k-event-delete {
40286
40565
  opacity: 1;
@@ -40346,7 +40625,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
40346
40625
 
40347
40626
  // Hover
40348
40627
  &:hover,
40349
- &.k-state-hover ,
40628
+ &.k-state-hover,
40350
40629
  &.k-hover {
40351
40630
  .k-event-actions .k-event-delete,
40352
40631
  .k-resize-handle {
@@ -40608,7 +40887,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
40608
40887
  .k-hover .k-task > .k-event-delete,
40609
40888
  .k-scheduler-content tr:hover .k-event-delete,
40610
40889
  .k-scheduler-content .k-scheduler-row:hover .k-event-delete,
40611
- .k-scheduler-content .k-scheduler-row.k-state-hover .k-event-delete ,
40890
+ .k-scheduler-content .k-scheduler-row.k-state-hover .k-event-delete,
40612
40891
  .k-scheduler-content .k-scheduler-row.k-hover .k-event-delete {
40613
40892
  visibility: visible;
40614
40893
  }
@@ -40682,7 +40961,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
40682
40961
  position: relative;
40683
40962
  }
40684
40963
 
40685
- td.k-state-selected ,
40964
+ td.k-state-selected,
40686
40965
  td.k-selected {
40687
40966
  background-color: inherit;
40688
40967
  }
@@ -41065,7 +41344,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
41065
41344
 
41066
41345
  .k-scheduler-layout td.k-state-selected,
41067
41346
  .k-scheduler-layout td.k-selected,
41068
- .k-scheduler-layout .k-scheduler-cell.k-state-selected ,
41347
+ .k-scheduler-layout .k-scheduler-cell.k-state-selected,
41069
41348
  .k-scheduler-layout .k-scheduler-cell.k-selected {
41070
41349
  background-color: rgba($selected-bg, .25);
41071
41350
  }
@@ -41088,7 +41367,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
41088
41367
  );
41089
41368
  @include box-shadow( $scheduler-event-shadow );
41090
41369
 
41091
- &.k-state-hover ,
41370
+ &.k-state-hover,
41092
41371
  &.k-hover {
41093
41372
  @include fill(
41094
41373
  $scheduler-event-hover-text,
@@ -41099,7 +41378,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
41099
41378
  @include box-shadow( $scheduler-event-hover-shadow );
41100
41379
  }
41101
41380
 
41102
- &.k-state-selected ,
41381
+ &.k-state-selected,
41103
41382
  &.k-selected {
41104
41383
  @include fill(
41105
41384
  $scheduler-event-selected-text,
@@ -41169,7 +41448,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
41169
41448
  .k-scheduler-content tr.k-state-hover,
41170
41449
  .k-scheduler-content tr.k-hover,
41171
41450
  .k-scheduler-content .k-scheduler-row:hover,
41172
- .k-scheduler-content .k-scheduler-row.k-state-hover ,
41451
+ .k-scheduler-content .k-scheduler-row.k-state-hover,
41173
41452
  .k-scheduler-content .k-scheduler-row.k-hover {
41174
41453
  @include fill(
41175
41454
  $hovered-text,
@@ -41183,7 +41462,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
41183
41462
  .k-scheduler-content tr:hover .k-scheduler-groupcolumn,
41184
41463
  .k-scheduler-content tr.k-state-hover .k-scheduler-datecolumn,
41185
41464
  .k-scheduler-content tr.k-hover .k-scheduler-datecolumn,
41186
- .k-scheduler-content tr.k-state-hover .k-scheduler-groupcolumn ,
41465
+ .k-scheduler-content tr.k-state-hover .k-scheduler-groupcolumn,
41187
41466
  .k-scheduler-content tr.k-hover .k-scheduler-groupcolumn {
41188
41467
  @include fill(
41189
41468
  $scheduler-text,
@@ -41193,13 +41472,13 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
41193
41472
  }
41194
41473
 
41195
41474
  // Selected
41196
- .k-scheduler-content tr.k-state-selected ,
41475
+ .k-scheduler-content tr.k-state-selected,
41197
41476
  .k-scheduler-content tr.k-selected {
41198
41477
  background-color: rgba($selected-bg, .25);
41199
41478
  }
41200
41479
  .k-scheduler-content tr.k-state-selected .k-scheduler-datecolumn,
41201
41480
  .k-scheduler-content tr.k-selected .k-scheduler-datecolumn,
41202
- .k-scheduler-content tr.k-state-selected .k-scheduler-groupcolumn ,
41481
+ .k-scheduler-content tr.k-state-selected .k-scheduler-groupcolumn,
41203
41482
  .k-scheduler-content tr.k-selected .k-scheduler-groupcolumn {
41204
41483
  background-color: $scheduler-bg;
41205
41484
  }
@@ -41217,7 +41496,7 @@ $scheduler-tooltip-callout-text: $scheduler-tooltip-bg !default;
41217
41496
  @include fill( $bg: $scheduler-yearview-indicator-bg );
41218
41497
  }
41219
41498
 
41220
- .k-state-selected .k-day-indicator ,
41499
+ .k-state-selected .k-day-indicator,
41221
41500
  .k-selected .k-day-indicator {
41222
41501
  @include fill( $bg: $scheduler-yearview-indicator-selected-bg );
41223
41502
  }
@@ -41521,7 +41800,7 @@ $chat-quick-reply-hover-border: $primary !default;
41521
41800
 
41522
41801
 
41523
41802
  // Message states
41524
- .k-message.k-state-selected ,
41803
+ .k-message.k-state-selected,
41525
41804
  .k-message.k-selected {
41526
41805
  margin-bottom: $chat-item-spacing-y;
41527
41806
  border: 0;
@@ -41731,7 +42010,7 @@ $chat-quick-reply-hover-border: $primary !default;
41731
42010
  flex: 0 0 auto;
41732
42011
  }
41733
42012
 
41734
- &.k-state-selected ,
42013
+ &.k-state-selected,
41735
42014
  &.k-selected {
41736
42015
  background: none;
41737
42016
  }
@@ -41968,7 +42247,7 @@ $chat-quick-reply-hover-border: $primary !default;
41968
42247
  .k-bubble:hover {
41969
42248
  @include box-shadow( $chat-bubble-hover-shadow );
41970
42249
  }
41971
- .k-state-selected .k-bubble ,
42250
+ .k-state-selected .k-bubble,
41972
42251
  .k-selected .k-bubble {
41973
42252
  @include box-shadow( $chat-bubble-selected-shadow );
41974
42253
  }
@@ -41984,7 +42263,7 @@ $chat-quick-reply-hover-border: $primary !default;
41984
42263
  .k-alt .k-bubble:hover {
41985
42264
  @include box-shadow( $chat-alt-bubble-hover-shadow );
41986
42265
  }
41987
- .k-alt .k-state-selected .k-bubble ,
42266
+ .k-alt .k-state-selected .k-bubble,
41988
42267
  .k-alt .k-selected .k-bubble {
41989
42268
  @include box-shadow( $chat-alt-bubble-selected-shadow );
41990
42269
  }
@@ -42789,7 +43068,7 @@ $timeline-event-min-height-calc: calc(2 * (#{$timeline-track-event-offset} - #{$
42789
43068
  color: $body-text;
42790
43069
  }
42791
43070
 
42792
- .k-timeline-arrow.k-state-disabled ,
43071
+ .k-timeline-arrow.k-state-disabled,
42793
43072
  .k-timeline-arrow.k-disabled {
42794
43073
  opacity: 1; // The arrow button in disabled mode should have a solid background
42795
43074
  color: $timeline-track-arrow-disabled-text;
@@ -42810,7 +43089,7 @@ $timeline-event-min-height-calc: calc(2 * (#{$timeline-track-event-offset} - #{$
42810
43089
  background-color: $timeline-flag-bg;
42811
43090
  }
42812
43091
 
42813
- .k-timeline-track-item.k-state-focus .k-timeline-circle ,
43092
+ .k-timeline-track-item.k-state-focus .k-timeline-circle,
42814
43093
  .k-timeline-track-item.k-focus .k-timeline-circle {
42815
43094
  @include box-shadow( $timeline-track-item-focus-shadow );
42816
43095
  }
@@ -43516,7 +43795,7 @@ $scrollview-transition-timing-function: ease-in-out !default;
43516
43795
  outline-width: 0;
43517
43796
 
43518
43797
  &:focus,
43519
- &.k-state-focus ,
43798
+ &.k-state-focus,
43520
43799
  &.k-focus {
43521
43800
  color: $scrollview-navigation-color;
43522
43801
  opacity: $scrollview-navigation-hover-opacity;
@@ -43527,7 +43806,7 @@ $scrollview-transition-timing-function: ease-in-out !default;
43527
43806
  }
43528
43807
 
43529
43808
  &:hover,
43530
- &.k-state-hover ,
43809
+ &.k-state-hover,
43531
43810
  &.k-hover {
43532
43811
  color: $scrollview-navigation-color;
43533
43812
  opacity: $scrollview-navigation-hover-opacity;
@@ -43549,14 +43828,14 @@ $scrollview-transition-timing-function: ease-in-out !default;
43549
43828
 
43550
43829
 
43551
43830
  &:focus,
43552
- &.k-state-focused ,
43831
+ &.k-state-focused,
43553
43832
  &.k-focus {
43554
43833
  box-shadow: $scrollview-pagebutton-shadow;
43555
43834
  }
43556
43835
  }
43557
43836
 
43558
43837
  .k-scrollview-nav > .k-link:hover,
43559
- .k-scrollview-nav > .k-link.k-state-hover ,
43838
+ .k-scrollview-nav > .k-link.k-state-hover,
43560
43839
  .k-scrollview-nav > .k-link.k-hover {
43561
43840
  box-shadow: $scrollview-pagebutton-shadow;
43562
43841
  }
@@ -44346,8 +44625,6 @@ $treemap-line-height: $line-height !default;
44346
44625
  }
44347
44626
 
44348
44627
 
44349
-
44350
-
44351
44628
  @include exports("dataviz/treemap/theme") {
44352
44629
 
44353
44630
  // Treemap
@@ -44375,7 +44652,7 @@ $treemap-line-height: $line-height !default;
44375
44652
  .k-leaf.k-inverse {
44376
44653
  color: $component-text;
44377
44654
  }
44378
- .k-leaf.k-state-hover ,
44655
+ .k-leaf.k-state-hover,
44379
44656
  .k-leaf.k-hover {
44380
44657
  box-shadow: inset 0 0 0 3px $component-border;
44381
44658
  }
@@ -44874,7 +45151,7 @@ $orgchart-line-v-height: 25px !default;
44874
45151
  .k-orgchart-node-group-container:focus,
44875
45152
  .k-orgchart-node-group-container.k-focus,
44876
45153
  .k-orgchart-node-group-container.k-state-focus,
44877
- .k-orgchart-node-group-container.k-state-focused ,
45154
+ .k-orgchart-node-group-container.k-state-focused,
44878
45155
  .k-orgchart-node-group-container.k-focus {
44879
45156
  @include box-shadow( $orgchart-node-group-focus-shadow );
44880
45157
  @include fill ( $border: $orgchart-node-group-focus-border );
@@ -44896,6 +45173,157 @@ $orgchart-line-v-height: 25px !default;
44896
45173
 
44897
45174
  // #endregion
44898
45175
 
45176
+ // #endregion
45177
+ // #region @import "signature/_index.scss"; -> packages/bootstrap/scss/signature/_index.scss
45178
+ // #region @import "../core/_index.scss"; -> packages/bootstrap/scss/core/_index.scss
45179
+ // File already imported_once. Skipping output.
45180
+ // #endregion
45181
+
45182
+ // Dependencies
45183
+ // #region @import "../button/_index.scss"; -> packages/bootstrap/scss/button/_index.scss
45184
+ // File already imported_once. Skipping output.
45185
+ // #endregion
45186
+ // #region @import "../input/_index.scss"; -> packages/bootstrap/scss/input/_index.scss
45187
+ // File already imported_once. Skipping output.
45188
+ // #endregion
45189
+
45190
+ // Component
45191
+ // #region @import "_variables.scss"; -> packages/bootstrap/scss/signature/_variables.scss
45192
+ $kendo-signature-width: 246px !default;
45193
+ $kendo-signature-height: 108px !default;
45194
+
45195
+ $kendo-signature-maximized-width: 750px !default;
45196
+ $kendo-signature-maximized-height: 252px !default;
45197
+
45198
+ $kendo-signature-padding: map-get( $spacing, 1 ) + map-get( $spacing, thin ) !default;
45199
+ $kendo-signature-padding-sm: map-get( $spacing, 1 ) !default;
45200
+ $kendo-signature-padding-md: $kendo-signature-padding !default;
45201
+ $kendo-signature-padding-lg: map-get( $spacing, 2 ) !default;
45202
+
45203
+ $kendo-signature-line-width: 1px !default;
45204
+ $kendo-signature-line-style: dashed !default;
45205
+ $kendo-signature-line-color: rgba( $info, .24 ) !default;
45206
+
45207
+ $kendo-signature-line-size: calc( 100% - 2 * #{$kendo-signature-padding} ) !default;
45208
+ $kendo-signature-line-size-sm: calc( 100% - 2 * #{$kendo-signature-padding-sm} ) !default;
45209
+ $kendo-signature-line-size-md: calc( 100% - 2 * #{$kendo-signature-padding-md} ) !default;
45210
+ $kendo-signature-line-size-lg: calc( 100% - 2 * #{$kendo-signature-padding-lg} ) !default;
45211
+
45212
+ $kendo-signature-line-bottom-offset: calc( #{$kendo-button-calc-size} + #{$kendo-signature-padding} ) !default;
45213
+ $kendo-signature-line-bottom-offset-sm: calc( #{$kendo-button-calc-size} + #{$kendo-signature-padding-sm} ) !default;
45214
+ $kendo-signature-line-bottom-offset-md: calc( #{$kendo-button-calc-size} + #{$kendo-signature-padding-md} ) !default;
45215
+ $kendo-signature-line-bottom-offset-lg: calc( #{$kendo-button-calc-size} + #{$kendo-signature-padding-lg} ) !default;
45216
+
45217
+ $kendo-signature-sizes: (
45218
+ sm: (
45219
+ padding: $kendo-signature-padding-sm,
45220
+ line-size: $kendo-signature-line-size-sm,
45221
+ line-offset: $kendo-signature-line-bottom-offset-sm
45222
+ ),
45223
+ md: (
45224
+ padding: $kendo-signature-padding-md,
45225
+ line-size: $kendo-signature-line-size-md,
45226
+ line-offset: $kendo-signature-line-bottom-offset-md
45227
+ ),
45228
+ lg: (
45229
+ padding: $kendo-signature-padding-lg,
45230
+ line-size: $kendo-signature-line-size-lg,
45231
+ line-offset: $kendo-signature-line-bottom-offset-lg
45232
+ )
45233
+ ) !default;
45234
+
45235
+ $kendo-signature-actions-gap: map-get( $spacing, 1 ) !default;
45236
+ $kendo-signature-maximized-line-width: map-get( $spacing, 1 ) - map-get( $spacing, hair ) !default;
45237
+
45238
+ // #endregion
45239
+ // #region @import "_layout.scss"; -> packages/bootstrap/scss/signature/_layout.scss
45240
+ // #region @import "~@progress/kendo-theme-default/scss/signature/_layout.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/signature/_layout.scss
45241
+ @include exports("signature/layout") {
45242
+
45243
+ .k-signature {
45244
+ width: $kendo-signature-width;
45245
+ height: $kendo-signature-height;
45246
+ position: relative;
45247
+ box-sizing: border-box;
45248
+ display: flex;
45249
+ flex-direction: column;
45250
+ justify-content: space-between;
45251
+
45252
+ &.k-signature-maximized {
45253
+ width: $kendo-signature-maximized-width;
45254
+ height: $kendo-signature-maximized-height;
45255
+
45256
+ > .k-signature-line {
45257
+ border-bottom-width: $kendo-signature-maximized-line-width;
45258
+ }
45259
+ }
45260
+ }
45261
+
45262
+ .k-signature-actions {
45263
+ display: flex;
45264
+ width: min-content;
45265
+ margin-inline-start: auto;
45266
+ gap: $kendo-signature-actions-gap;
45267
+ z-index: 2;
45268
+ }
45269
+
45270
+ .k-signature-canvas {
45271
+ position: absolute;
45272
+ top: 0;
45273
+ left: 0;
45274
+ width: 100%;
45275
+ height: 100%;
45276
+ display: block;
45277
+ z-index: 1;
45278
+ }
45279
+
45280
+ .k-signature-line {
45281
+ position: absolute;
45282
+ z-index: 0;
45283
+ border-bottom-width: $kendo-signature-line-width;
45284
+ border-bottom-style: $kendo-signature-line-style;
45285
+ }
45286
+
45287
+ // Sizes
45288
+ @each $size, $size-props in $kendo-signature-sizes {
45289
+ $_padding: map-get($size-props, padding);
45290
+ $_line-size: map-get($size-props, line-size);
45291
+ $_line-offset: map-get($size-props, line-offset);
45292
+
45293
+ .k-signature-#{$size} {
45294
+ padding: $_padding;
45295
+
45296
+ .k-signature-line {
45297
+ width: $_line-size;
45298
+ bottom: $_line-offset;
45299
+ }
45300
+ }
45301
+
45302
+ }
45303
+ }
45304
+
45305
+ // #endregion
45306
+
45307
+ // #endregion
45308
+ // #region @import "_theme.scss"; -> packages/bootstrap/scss/signature/_theme.scss
45309
+ // #region @import "~@progress/kendo-theme-default/scss/signature/_theme.scss"; -> packages/bootstrap/node_modules/@progress/kendo-theme-default/scss/signature/_theme.scss
45310
+ @include exports("signature/theme") {
45311
+
45312
+ // Solid signature
45313
+ .k-signature {
45314
+
45315
+ .k-signature-line {
45316
+ border-bottom-color: $kendo-signature-line-color;
45317
+ }
45318
+ }
45319
+
45320
+
45321
+ }
45322
+
45323
+ // #endregion
45324
+
45325
+ // #endregion
45326
+
44899
45327
  // #endregion
44900
45328
 
44901
45329
  // #endregion