@progress/kendo-theme-default 6.3.1-dev.0 → 6.4.0-dev.1

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 (40) hide show
  1. package/dist/all.css +348 -154
  2. package/dist/all.scss +245 -148
  3. package/dist/default-main-dark.scss +2 -2
  4. package/dist/meta/sassdoc-data.json +988 -1096
  5. package/dist/meta/sassdoc-raw-data.json +494 -544
  6. package/dist/meta/variables.json +16 -16
  7. package/lib/swatches/default-blue.json +1 -1
  8. package/lib/swatches/default-dataviz-v4.json +1 -1
  9. package/lib/swatches/default-green.json +1 -1
  10. package/lib/swatches/default-main-dark.json +4 -4
  11. package/lib/swatches/default-main.json +1 -1
  12. package/lib/swatches/default-nordic.json +1 -1
  13. package/lib/swatches/default-ocean-blue-a11y.json +1 -1
  14. package/lib/swatches/default-ocean-blue.json +1 -1
  15. package/lib/swatches/default-orange.json +1 -1
  16. package/lib/swatches/default-purple.json +1 -1
  17. package/lib/swatches/default-turquoise.json +1 -1
  18. package/lib/swatches/default-urban.json +1 -1
  19. package/package.json +4 -4
  20. package/scss/action-sheet/_layout.scss +11 -2
  21. package/scss/adaptive/_layout.scss +5 -8
  22. package/scss/bottom-navigation/_theme.scss +21 -14
  23. package/scss/breadcrumb/_layout.scss +1 -6
  24. package/scss/drawer/_layout.scss +13 -3
  25. package/scss/drawer/_variables.scss +2 -0
  26. package/scss/editor/_layout.scss +0 -18
  27. package/scss/expansion-panel/_layout.scss +3 -0
  28. package/scss/fab/_layout.scss +3 -4
  29. package/scss/fab/_theme.scss +1 -1
  30. package/scss/fab/_variables.scss +5 -11
  31. package/scss/grid/_layout.scss +3 -1
  32. package/scss/icons/_layout.scss +10 -7
  33. package/scss/input/_layout.scss +6 -5
  34. package/scss/input/_variables.scss +0 -3
  35. package/scss/listbox/_layout.scss +2 -5
  36. package/scss/listgroup/_layout.scss +1 -1
  37. package/scss/pager/_layout.scss +1 -12
  38. package/scss/scheduler/_layout.scss +3 -16
  39. package/scss/scrollview/_layout.scss +13 -2
  40. package/scss/spreadsheet/_layout.scss +4 -2
package/dist/all.scss CHANGED
@@ -6250,6 +6250,22 @@ $kendo-utils: (
6250
6250
  "black": black,
6251
6251
  "white": white
6252
6252
  )),
6253
+ "background-position": (
6254
+ center: center,
6255
+ top: top,
6256
+ right: right,
6257
+ bottom: bottom,
6258
+ left: left,
6259
+ top-left: top left,
6260
+ top-right: top right,
6261
+ bottom-left: bottom left,
6262
+ bottom-right: bottom right
6263
+ ),
6264
+ "background-size": (
6265
+ auto,
6266
+ cover,
6267
+ contain
6268
+ ),
6253
6269
 
6254
6270
  // Border
6255
6271
  "border-width": (
@@ -6659,25 +6675,25 @@ $kendo-utils: (
6659
6675
  /// This is equivalent to `clear: left;`.
6660
6676
  /// @example clear: left;
6661
6677
  /// @name .k-clear-left
6662
- /// @group float
6678
+ /// @group clear
6663
6679
  /// @contextType css
6664
6680
 
6665
6681
  /// This is equivalent to `clear: right;`.
6666
6682
  /// @example clear: right;
6667
6683
  /// @name .k-clear-right
6668
- /// @group float
6684
+ /// @group clear
6669
6685
  /// @contextType css
6670
6686
 
6671
6687
  /// This is equivalent to `clear: both;`.
6672
6688
  /// @example clear: both;
6673
6689
  /// @name .k-clear-both
6674
- /// @group float
6690
+ /// @group clear
6675
6691
  /// @contextType css
6676
6692
 
6677
6693
  /// This is equivalent to `clear: none;`.
6678
6694
  /// @example clear: none;
6679
6695
  /// @name .k-clear-none
6680
- /// @group float
6696
+ /// @group clear
6681
6697
  /// @contextType css
6682
6698
 
6683
6699
  @mixin kendo-utils--layout--clear() {
@@ -7122,91 +7138,91 @@ $kendo-utils: (
7122
7138
  /// This is equivalent to `top: 0;`.
7123
7139
  /// @example top: 0;
7124
7140
  /// @name .k-top-0
7125
- /// @group position
7141
+ /// @group placement
7126
7142
  /// @contextType css
7127
7143
 
7128
7144
  /// This is equivalent to `right: 0;`.
7129
7145
  /// @example right: 0;
7130
7146
  /// @name .k-right-0
7131
- /// @group position
7147
+ /// @group placement
7132
7148
  /// @contextType css
7133
7149
 
7134
7150
  /// This is equivalent to `bottom: 0;`.
7135
7151
  /// @example bottom: 0;
7136
7152
  /// @name .k-bottom-0
7137
- /// @group position
7153
+ /// @group placement
7138
7154
  /// @contextType css
7139
7155
 
7140
7156
  /// This is equivalent to `left: 0;`.
7141
7157
  /// @example left: 0;
7142
7158
  /// @name .k-left-0
7143
- /// @group position
7159
+ /// @group placement
7144
7160
  /// @contextType css
7145
7161
 
7146
7162
  /// This is equivalent to `top: 0;`.
7147
7163
  /// @example top: 0;
7148
7164
  /// @name .k-pos-top-0
7149
- /// @group position
7165
+ /// @group placement
7150
7166
  /// @contextType css
7151
7167
 
7152
7168
  /// This is equivalent to `right: 0;`.
7153
7169
  /// @example right: 0;
7154
7170
  /// @name .k-pos-right-0
7155
- /// @group position
7171
+ /// @group placement
7156
7172
  /// @contextType css
7157
7173
 
7158
7174
  /// This is equivalent to `bottom: 0;`.
7159
7175
  /// @example bottom: 0;
7160
7176
  /// @name .k-pos-bottom-0
7161
- /// @group position
7177
+ /// @group placement
7162
7178
  /// @contextType css
7163
7179
 
7164
7180
  /// This is equivalent to `left: 0;`.
7165
7181
  /// @example left: 0;
7166
7182
  /// @name .k-pos-left-0
7167
- /// @group position
7183
+ /// @group placement
7168
7184
  /// @contextType css
7169
7185
 
7170
7186
  /// This is equivalent to `top: 0; left: 0;`.
7171
7187
  /// @example top: 0; left: 0;
7172
7188
  /// @name .k-top-left-0
7173
- /// @group position
7189
+ /// @group placement
7174
7190
  /// @contextType css
7175
7191
 
7176
7192
  /// This is equivalent to `top: 0; right: 0;`.
7177
7193
  /// @example top: 0; right: 0;
7178
7194
  /// @name .k-top-right-0
7179
- /// @group position
7195
+ /// @group placement
7180
7196
  /// @contextType css
7181
7197
 
7182
7198
  /// This is equivalent to `bottom: 0; left: 0;`.
7183
7199
  /// @example bottom: 0; left: 0;
7184
7200
  /// @name .k-bottom-left-0
7185
- /// @group position
7201
+ /// @group placement
7186
7202
  /// @contextType css
7187
7203
 
7188
7204
  /// This is equivalent to `bottom: 0; right: 0;`.
7189
7205
  /// @example bottom: 0; right: 0;
7190
7206
  /// @name .k-bottom-right-0
7191
- /// @group position
7207
+ /// @group placement
7192
7208
  /// @contextType css
7193
7209
 
7194
- /// This is equivalent to `inset: 0;`.This is a shorthand that corresponds to the top: 0; right: 0; bottom: 0; and/or left: 0 properties. It has the same multi-value syntax of the margin shorthand.
7210
+ /// This is equivalent to `inset: 0;`.
7195
7211
  /// @example inset: 0;
7196
7212
  /// @name .k-inset-0
7197
- /// @group position
7213
+ /// @group placement
7198
7214
  /// @contextType css
7199
7215
 
7200
7216
  /// This is equivalent to `inset-inline: 0;`.
7201
7217
  /// @example inset-inline: 0;
7202
7218
  /// @name .k-inset-x-0
7203
- /// @group position
7219
+ /// @group placement
7204
7220
  /// @contextType css
7205
7221
 
7206
7222
  /// This is equivalent to `inset-block: 0;`.
7207
7223
  /// @example inset-block: 0;
7208
7224
  /// @name .k-inset-y-0
7209
- /// @group position
7225
+ /// @group placement
7210
7226
  /// @contextType css
7211
7227
 
7212
7228
  @mixin kendo-utils--layout--placement() {
@@ -7218,7 +7234,7 @@ $kendo-utils: (
7218
7234
  @include generate-utils( left, left, $kendo-utils-placement );
7219
7235
 
7220
7236
 
7221
- // Position length utility classes
7237
+ // placement length utility classes
7222
7238
  @each $side in (top, right, bottom, left) {
7223
7239
  .#{$kendo-prefix}#{$side},
7224
7240
  .#{$kendo-prefix}pos-#{$side} { #{$side}: 0; } // sass-lint:disable-line brace-style
@@ -8111,37 +8127,37 @@ $kendo-utils: (
8111
8127
  // #region @import "./_grid-auto-flow.scss"; -> node_modules/@progress/kendo-theme-utils/scss/flex-grid/_grid-auto-flow.scss
8112
8128
  /// This is equivalent to `grid-auto-flow: row;`.
8113
8129
  /// @example grid-auto-flow: row;
8114
- /// @name .k-grid-auto-flow-row
8130
+ /// @name .k-grid-flow-row
8115
8131
  /// @group grid-auto-flow
8116
8132
  /// @contextType css
8117
8133
 
8118
8134
  /// This is equivalent to `grid-auto-flow: column;`.
8119
8135
  /// @example grid-auto-flow: column;
8120
- /// @name .k-grid-auto-flow-column
8136
+ /// @name .k-grid-flow-column
8121
8137
  /// @group grid-auto-flow
8122
8138
  /// @contextType css
8123
8139
 
8124
8140
  /// This is equivalent to `grid-auto-flow: dense;`.
8125
8141
  /// @example grid-auto-flow: dense;
8126
- /// @name .k-grid-auto-flow-dense
8142
+ /// @name .k-grid-flow-dense
8127
8143
  /// @group grid-auto-flow
8128
8144
  /// @contextType css
8129
8145
 
8130
8146
  /// This is equivalent to `grid-auto-flow: row dense;`.
8131
8147
  /// @example grid-auto-flow: row dense;
8132
- /// @name .k-grid-auto-flow-row-dense
8148
+ /// @name .k-grid-flow-row-dense
8133
8149
  /// @group grid-auto-flow
8134
8150
  /// @contextType css
8135
8151
 
8136
8152
  /// This is equivalent to `grid-auto-flow: col dense;`.
8137
8153
  /// @example grid-auto-flow: col dense;
8138
- /// @name .k-grid-auto-flow-col-dense
8154
+ /// @name .k-grid-flow-col-dense
8139
8155
  /// @group grid-auto-flow
8140
8156
  /// @contextType css
8141
8157
 
8142
8158
  /// This is equivalent to `grid-auto-flow: unset;`.
8143
8159
  /// @example grid-auto-flow: unset;
8144
- /// @name .k-grid-auto-flow-unset
8160
+ /// @name .k-grid-flow-unset
8145
8161
  /// @group grid-auto-flow
8146
8162
  /// @contextType css
8147
8163
 
@@ -9513,7 +9529,7 @@ $kendo-utils: (
9513
9529
 
9514
9530
  /// This is equivalent to `padding: 0.75rem;`.
9515
9531
  /// @example padding: 0.75rem;
9516
- /// @name .k-p-pd
9532
+ /// @name .k-p-md
9517
9533
  /// @group padding
9518
9534
  /// @contextType css
9519
9535
 
@@ -10908,12 +10924,106 @@ $kendo-utils: (
10908
10924
 
10909
10925
  }
10910
10926
 
10927
+ // #endregion
10928
+ // #region @import "./_background-position.scss"; -> node_modules/@progress/kendo-theme-utils/scss/background/_background-position.scss
10929
+ /// This is equivalent to `background-position: center;`.
10930
+ /// @example background-position: center;
10931
+ /// @name .k-bg-center
10932
+ /// @group background-position
10933
+ /// @contextType css
10934
+
10935
+ /// This is equivalent to `background-position: top;`.
10936
+ /// @example background-position: top;
10937
+ /// @name .k-bg-top
10938
+ /// @group background-position
10939
+ /// @contextType css
10940
+
10941
+ /// This is equivalent to `background-position: right;`.
10942
+ /// @example background-position: right;
10943
+ /// @name .k-bg-right
10944
+ /// @group background-position
10945
+ /// @contextType css
10946
+
10947
+ /// This is equivalent to `background-position: bottom;`.
10948
+ /// @example background-position: bottom;
10949
+ /// @name .k-bg-bottom
10950
+ /// @group background-position
10951
+ /// @contextType css
10952
+
10953
+ /// This is equivalent to `background-position: left;`.
10954
+ /// @example background-position: left;
10955
+ /// @name .k-bg-left
10956
+ /// @group background-position
10957
+ /// @contextType css
10958
+
10959
+ /// This is equivalent to `background-position: top left;`.
10960
+ /// @example background-position: top left;
10961
+ /// @name .k-bg-top-left
10962
+ /// @group background-position
10963
+ /// @contextType css
10964
+
10965
+ /// This is equivalent to `background-position: top right;`.
10966
+ /// @example background-position: top right;
10967
+ /// @name .k-bg-top-right
10968
+ /// @group background-position
10969
+ /// @contextType css
10970
+
10971
+ /// This is equivalent to `background-position: bottom left;`.
10972
+ /// @example background-position: bottom left;
10973
+ /// @name .k-bg-bottom-left
10974
+ /// @group background-position
10975
+ /// @contextType css
10976
+
10977
+ /// This is equivalent to `background-position: bottom right;`.
10978
+ /// @example background-position: bottom right;
10979
+ /// @name .k-bg-bottom-right
10980
+ /// @group background-position
10981
+ /// @contextType css
10982
+
10983
+ @mixin kendo-utils--background--background-position() {
10984
+
10985
+ // Background position utility classes
10986
+ $kendo-utils-background-position: k-map-get( $kendo-utils, "background-position" ) !default;
10987
+ @include generate-utils( bg, background-position, $kendo-utils-background-position );
10988
+
10989
+ }
10990
+
10991
+ // #endregion
10992
+ // #region @import "./_background-size.scss"; -> node_modules/@progress/kendo-theme-utils/scss/background/_background-size.scss
10993
+ /// This is equivalent to `background-size: auto;`.
10994
+ /// @example background-size: auto;
10995
+ /// @name .k-bg-auto
10996
+ /// @group background-size
10997
+ /// @contextType css
10998
+
10999
+ /// This is equivalent to `background-size: cover;`.
11000
+ /// @example background-size: cover;
11001
+ /// @name .k-bg-cover
11002
+ /// @group background-size
11003
+ /// @contextType css
11004
+
11005
+ /// This is equivalent to `background-size: contain;`.
11006
+ /// @example background-size: contain;
11007
+ /// @name .k-bg-contain
11008
+ /// @group background-size
11009
+ /// @contextType css
11010
+
11011
+ @mixin kendo-utils--background--background-size() {
11012
+
11013
+ // Background size utility classes
11014
+ $kendo-utils-background-size: k-map-get( $kendo-utils, "background-size" ) !default;
11015
+ @include generate-utils( bg, background-size, $kendo-utils-background-size );
11016
+
11017
+ }
11018
+
10911
11019
  // #endregion
10912
11020
 
10913
11021
 
10914
11022
  @mixin kendo-utils--background() {
10915
11023
  @include kendo-utils--background--background-clip();
10916
11024
  @include kendo-utils--background--background-color();
11025
+ @include kendo-utils--background--background-position();
11026
+ @include kendo-utils--background--background-size();
10917
11027
  }
10918
11028
 
10919
11029
  // #endregion
@@ -14932,13 +15042,16 @@ $ki-rotate-map: (
14932
15042
  }
14933
15043
 
14934
15044
  // RTL icons
14935
- .k-rtl .k-i-indent-increase,
14936
- .k-rtl .k-i-indent-decrease,
14937
- .k-rtl .k-i-caret-alt-right,
14938
- .k-rtl .k-i-caret-alt-left,
14939
- [dir="rtl"] .k-i-caret-alt-right,
14940
- [dir="rtl"] .k-i-caret-alt-left {
14941
- transform: scaleX(-1);
15045
+ .k-rtl,
15046
+ [dir="rtl"] {
15047
+ .k-i-indent-increase,
15048
+ .k-i-indent-decrease,
15049
+ .k-i-caret-alt-right,
15050
+ .k-i-caret-alt-left,
15051
+ .k-svg-i-caret-alt-right,
15052
+ .k-svg-i-caret-alt-left {
15053
+ transform: scaleX(-1);
15054
+ }
14942
15055
  }
14943
15056
 
14944
15057
  .k-sprite {
@@ -16687,7 +16800,7 @@ $kendo-listgroup-item-border-width: 1px !default;
16687
16800
  flex: 0 0 auto;
16688
16801
  position: absolute;
16689
16802
  top: 50%;
16690
- right: 0;
16803
+ inset-inline-end: 0;
16691
16804
  transform: translateY(-50%);
16692
16805
  }
16693
16806
  }
@@ -22543,7 +22656,6 @@ $kendo-input-sizes: (
22543
22656
  padding-y: $kendo-input-sm-padding-y,
22544
22657
  font-size: $kendo-input-sm-font-size,
22545
22658
  line-height: $kendo-input-sm-line-height,
22546
- icon-size: calc( #{$kendo-icon-size} + #{$kendo-input-sm-padding-y * 2} ),
22547
22659
  button-padding-x: $kendo-input-sm-padding-y,
22548
22660
  button-padding-y: $kendo-input-sm-padding-y
22549
22661
  ),
@@ -22552,7 +22664,6 @@ $kendo-input-sizes: (
22552
22664
  padding-y: $kendo-input-md-padding-y,
22553
22665
  font-size: $kendo-input-md-font-size,
22554
22666
  line-height: $kendo-input-md-line-height,
22555
- icon-size: calc( #{$kendo-icon-size} + #{$kendo-input-md-padding-y * 2} ),
22556
22667
  button-padding-x: $kendo-input-md-padding-y,
22557
22668
  button-padding-y: $kendo-input-md-padding-y
22558
22669
  ),
@@ -22561,7 +22672,6 @@ $kendo-input-sizes: (
22561
22672
  padding-y: $kendo-input-lg-padding-y,
22562
22673
  font-size: $kendo-input-lg-font-size,
22563
22674
  line-height: $kendo-input-lg-line-height,
22564
- icon-size: calc( #{$kendo-icon-size} + #{$kendo-input-lg-padding-y * 2} ),
22565
22675
  button-padding-x: $kendo-input-lg-padding-y,
22566
22676
  button-padding-y: $kendo-input-lg-padding-y
22567
22677
  )
@@ -24008,8 +24118,8 @@ $_kendo-module-meta: (
24008
24118
  box-sizing: border-box;
24009
24119
  }
24010
24120
 
24011
- .k-input,
24012
- .k-picker {
24121
+ > .k-input,
24122
+ > .k-picker {
24013
24123
  border-width: 0 !important; // sass-lint:disable-line no-important
24014
24124
  color: inherit;
24015
24125
  background: none;
@@ -24201,6 +24311,7 @@ $_kendo-module-meta: (
24201
24311
  flex-flow: row nowrap;
24202
24312
  align-items: center;
24203
24313
  justify-content: center;
24314
+ box-sizing: content-box;
24204
24315
  }
24205
24316
 
24206
24317
  // Input with SVG icon
@@ -24373,7 +24484,6 @@ $_kendo-module-meta: (
24373
24484
  $_padding-y: k-map-get( $size-props, padding-y );
24374
24485
  $_font-size: k-map-get( $size-props, font-size );
24375
24486
  $_line-height: k-map-get( $size-props, line-height );
24376
- $_icon-size: k-map-get( $size-props, icon-size );
24377
24487
  $_button-padding-x: k-map-get( $size-props, button-padding-x );
24378
24488
  $_button-padding-y: k-map-get( $size-props, button-padding-y );
24379
24489
 
@@ -24411,8 +24521,9 @@ $_kendo-module-meta: (
24411
24521
  .k-input-prefix > .k-svg-icon,
24412
24522
  .k-input-suffix > .k-icon,
24413
24523
  .k-input-suffix > .k-svg-icon {
24414
- width: $_icon-size;
24415
- height: $_icon-size;
24524
+ padding-block: $_padding-y;
24525
+ padding-inline: $_padding-y;
24526
+ box-sizing: content-box;
24416
24527
  }
24417
24528
 
24418
24529
  &.k-icon-picker .k-input-inner {
@@ -25771,11 +25882,8 @@ $kendo-listbox-drop-hint-width: 1px !default;
25771
25882
  &[dir="rtl"],
25772
25883
  [dir="rtl"] & {
25773
25884
 
25774
- &.k-listbox-actions-left,
25775
- &.k-listbox-actions-right {
25776
- .k-listbox-actions {
25777
- transform: scaleX(-1);
25778
- }
25885
+ .k-listbox-actions .k-button-icon {
25886
+ transform: scaleX(-1);
25779
25887
  }
25780
25888
  }
25781
25889
  }
@@ -33806,12 +33914,12 @@ $kendo-fab-sm-padding-y: k-math-div( $kendo-fab-padding-y, 2 ) !default;
33806
33914
  $kendo-fab-md-padding-y: $kendo-fab-padding-y !default;
33807
33915
  $kendo-fab-lg-padding-y: ( $kendo-fab-padding-y * 1.5 ) !default;
33808
33916
 
33809
- /// FAB icon width.
33917
+ /// Horizontal padding of the FAB icon.
33810
33918
  /// @group floating-action-button
33811
- $kendo-fab-icon-width: 20px !default;
33812
- /// FAB icon height.
33919
+ $kendo-fab-icon-padding-x: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
33920
+ /// Vertical padding of the FAB icon.
33813
33921
  /// @group floating-action-button
33814
- $kendo-fab-icon-height: $kendo-fab-icon-width !default;
33922
+ $kendo-fab-icon-padding-y: $kendo-fab-icon-padding-x !default;
33815
33923
  /// FAB icon spacing.
33816
33924
  /// @group floating-action-button
33817
33925
  $kendo-fab-icon-spacing: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
@@ -33844,7 +33952,7 @@ $kendo-fab-item-text-line-height: 1.2 !default;
33844
33952
 
33845
33953
  /// FAB item icon horizontal padding.
33846
33954
  /// @group floating-action-button
33847
- $kendo-fab-item-icon-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
33955
+ $kendo-fab-item-icon-padding-x: k-map-get( $kendo-spacing, 2 ) + $kendo-fab-icon-padding-x !default;
33848
33956
  /// FAB item icon vertical padding.
33849
33957
  /// @group floating-action-button
33850
33958
  $kendo-fab-item-icon-padding-y: $kendo-fab-item-icon-padding-x !default;
@@ -33854,12 +33962,6 @@ $kendo-fab-item-icon-border-width: 0 !default;
33854
33962
  /// Border radius of the FAB item icon.
33855
33963
  /// @group floating-action-button
33856
33964
  $kendo-fab-item-icon-border-radius: 50% !default;
33857
- /// Width of the FAB item icon.
33858
- /// @group floating-action-button
33859
- $kendo-fab-item-icon-width: 20px !default;
33860
- /// Height of the FAB item icon.
33861
- /// @group floating-action-button
33862
- $kendo-fab-item-icon-height: $kendo-fab-item-icon-width !default;
33863
33965
 
33864
33966
  /// Theme colors map for the FAB.
33865
33967
  /// @group floating-action-button
@@ -33977,8 +34079,9 @@ $kendo-fab-item-outline-color: rgba(0, 0, 0, .08) !default;
33977
34079
 
33978
34080
  // FAB Icon
33979
34081
  .k-fab-icon {
33980
- width: $kendo-fab-icon-width;
33981
- height: $kendo-fab-icon-height;
34082
+ padding-inline: $kendo-fab-icon-padding-x;
34083
+ padding-block: $kendo-fab-icon-padding-y;
34084
+ box-sizing: content-box;
33982
34085
 
33983
34086
  .k-icon-wrapper-host:not(:only-child) &,
33984
34087
  &:not(:only-child) {
@@ -34059,8 +34162,6 @@ $kendo-fab-item-outline-color: rgba(0, 0, 0, .08) !default;
34059
34162
  }
34060
34163
 
34061
34164
  .k-fab-item-icon {
34062
- width: $kendo-fab-item-icon-width;
34063
- height: $kendo-fab-item-icon-height;
34064
34165
  padding-block: $kendo-fab-item-icon-padding-y;
34065
34166
  padding-inline: $kendo-fab-item-icon-padding-x;
34066
34167
  border-width: $kendo-fab-item-icon-border-width;
@@ -34209,7 +34310,7 @@ $kendo-fab-item-outline-color: rgba(0, 0, 0, .08) !default;
34209
34310
  }
34210
34311
 
34211
34312
  // Popup
34212
- .k-animation-container > .k-fab-popup {
34313
+ .k-fab-popup {
34213
34314
  @include box-shadow( none );
34214
34315
  }
34215
34316
 
@@ -34569,7 +34670,7 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
34569
34670
  border-width: if( $kendo-actionsheet-border-width, $kendo-actionsheet-border-width, null );
34570
34671
  border-top-width: if( $kendo-actionsheet-border-width, 0, null );
34571
34672
  top: 0;
34572
- left: 50%;
34673
+ inset-inline-start: 50%;
34573
34674
  transform: translateX( -50% );
34574
34675
  }
34575
34676
  .k-actionsheet-bottom {
@@ -34577,7 +34678,7 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
34577
34678
  border-width: if( $kendo-actionsheet-border-width, $kendo-actionsheet-border-width, null );
34578
34679
  border-bottom-width: if( $kendo-actionsheet-border-width, 0, null );
34579
34680
  bottom: 0;
34580
- left: 50%;
34681
+ inset-inline-start: 50%;
34581
34682
  transform: translateX( -50% );
34582
34683
  }
34583
34684
  .k-actionsheet-left {
@@ -34736,6 +34837,15 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
34736
34837
  }
34737
34838
  }
34738
34839
 
34840
+ // RTL
34841
+ .k-rtl,
34842
+ [dir="rtl"] {
34843
+ .k-actionsheet-top,
34844
+ .k-actionsheet-bottom {
34845
+ transform: translateX( 50% );
34846
+ }
34847
+ }
34848
+
34739
34849
  }
34740
34850
 
34741
34851
 
@@ -35402,6 +35512,8 @@ $kendo-drawer-item-level-padding-x: $kendo-drawer-item-padding-x !default;
35402
35512
  $kendo-drawer-item-level-count: 5 !default;
35403
35513
 
35404
35514
  $kendo-drawer-icon-size: $kendo-icon-size !default;
35515
+ $kendo-drawer-icon-padding-x: 0 !default;
35516
+ $kendo-drawer-icon-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
35405
35517
 
35406
35518
  $kendo-drawer-mini-initial-width: calc(2 * #{$kendo-drawer-item-padding-x} + #{$kendo-drawer-icon-size}) !default;
35407
35519
 
@@ -35575,16 +35687,26 @@ $kendo-drawer-selected-hover-text: $kendo-selected-hover-text !default;
35575
35687
 
35576
35688
  .k-svg-icon,
35577
35689
  .k-icon {
35578
- height: auto;
35579
- font-size: $kendo-drawer-icon-size;
35580
- line-height: $kendo-drawer-item-line-height;
35581
35690
  flex-shrink: 0;
35691
+ padding-inline: $kendo-drawer-icon-padding-x;
35692
+ padding-block: $kendo-drawer-icon-padding-y;
35693
+ box-sizing: content-box;
35582
35694
 
35583
35695
  &.k-i-none {
35584
35696
  margin: 0;
35585
35697
  }
35586
35698
  }
35587
35699
 
35700
+ .k-icon {
35701
+ height: auto;
35702
+ font-size: $kendo-drawer-icon-size;
35703
+ }
35704
+
35705
+ .k-svg-icon {
35706
+ width: $kendo-drawer-icon-size;
35707
+ height: $kendo-drawer-icon-size;
35708
+ }
35709
+
35588
35710
  .k-item-text {
35589
35711
  display: inline-block;
35590
35712
  white-space: nowrap;
@@ -37165,7 +37287,7 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
37165
37287
 
37166
37288
  // Solid
37167
37289
  @each $name, $color in $kendo-theme-colors {
37168
- .k-bottom-nav-solid.k-bottom-nav-#{$name} {
37290
+ .k-bottom-nav-solid-#{$name} {
37169
37291
  @include fill(
37170
37292
  $color: k-true-mix( $color, k-contrast-legacy( $color ), 35%),
37171
37293
  $bg: $color
@@ -37180,23 +37302,27 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
37180
37302
  @include fill( $color: k-contrast-legacy( $color ) );
37181
37303
  }
37182
37304
  }
37305
+ // TODO: remove when suites update class names
37306
+ .k-bottom-nav-solid.k-bottom-nav-#{$name} {
37307
+ @extend .k-bottom-nav-solid-#{$name} !optional;
37308
+ }
37183
37309
  }
37184
37310
 
37185
37311
  // Flat
37186
- .k-bottom-nav-flat {
37187
- @include fill(
37188
- $kendo-bottom-nav-flat-text,
37189
- $kendo-bottom-nav-flat-bg,
37190
- $kendo-bottom-nav-flat-border
37191
- );
37312
+ @each $name, $color in $kendo-theme-colors {
37313
+ .k-bottom-nav-flat-#{$name} {
37314
+ @include fill(
37315
+ $kendo-bottom-nav-flat-text,
37316
+ $kendo-bottom-nav-flat-bg,
37317
+ $kendo-bottom-nav-flat-border
37318
+ );
37192
37319
 
37193
- .k-bottom-nav-item.k-focus,
37194
- .k-bottom-nav-item:focus {
37195
- @include fill( $bg: rgba($kendo-bottom-nav-flat-text, .05) );
37196
- }
37320
+ .k-bottom-nav-item.k-focus,
37321
+ .k-bottom-nav-item:focus {
37322
+ @include fill( $bg: rgba($kendo-bottom-nav-flat-text, .05) );
37323
+ }
37197
37324
 
37198
- @each $name, $color in $kendo-theme-colors {
37199
- &.k-bottom-nav-#{$name} .k-bottom-nav-item.k-selected {
37325
+ .k-bottom-nav-item.k-selected {
37200
37326
  @if $name == "secondary" or $name == "light" {
37201
37327
  @include fill( $color: k-try-shade($color, 3) );
37202
37328
  } @else {
@@ -37204,6 +37330,9 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
37204
37330
  }
37205
37331
  }
37206
37332
  }
37333
+ .k-bottom-nav-flat.k-bottom-nav-#{$name} {
37334
+ @extend .k-bottom-nav-flat-#{$name} !optional;
37335
+ }
37207
37336
  }
37208
37337
 
37209
37338
  }
@@ -37372,12 +37501,6 @@ $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
37372
37501
  overflow: hidden;
37373
37502
  }
37374
37503
 
37375
- .k-breadcrumb-container {
37376
- // TODO: use !k-flex-wrap in rendering
37377
- &.k-flex-wrap {
37378
- flex-wrap: wrap;
37379
- }
37380
- }
37381
37504
  .k-breadcrumb-root-item-container {
37382
37505
  align-items: flex-start;
37383
37506
  flex-shrink: 0;
@@ -37389,6 +37512,7 @@ $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba(0, 0, 0, .06) !default;
37389
37512
  vertical-align: middle;
37390
37513
  display: inline-flex;
37391
37514
  flex-direction: row;
37515
+ flex: none;
37392
37516
  align-items: center;
37393
37517
  overflow: hidden;
37394
37518
  }
@@ -37809,18 +37933,7 @@ $kendo-pager-sizes: (
37809
37933
  .k-rtl &,
37810
37934
  &[dir="rtl"],
37811
37935
  [dir="rtl"] & {
37812
- .k-i-caret-alt-to-left,
37813
- .k-i-caret-alt-to-right,
37814
- .k-i-caret-alt-left,
37815
- .k-i-caret-alt-right,
37816
- .k-i-arrow-end-left,
37817
- .k-i-arrow-60-left,
37818
- .k-i-arrow-60-right,
37819
- .k-i-arrow-end-right,
37820
- .k-i-seek-w,
37821
- .k-i-arrow-w,
37822
- .k-i-arrow-e,
37823
- .k-i-seek-e {
37936
+ .k-pager-nav .k-button-icon {
37824
37937
  transform: scaleX(-1);
37825
37938
  }
37826
37939
  }
@@ -39754,6 +39867,9 @@ $kendo-expander-content-padding-y: k-map-get( $kendo-spacing, 4 ) !default;
39754
39867
  // Expand / collapse icon
39755
39868
  .k-expander-indicator {
39756
39869
  margin-left: $kendo-expander-indicator-margin-x;
39870
+ display: flex;
39871
+ justify-content: center;
39872
+ align-items: center;
39757
39873
  }
39758
39874
 
39759
39875
  // Expander content
@@ -41308,15 +41424,11 @@ $kendo-adaptive-scheduler-subtle-text: $kendo-subtle-text !default;
41308
41424
  .k-task {
41309
41425
  display: flex;
41310
41426
  align-items: center;
41427
+ gap: .5em;
41311
41428
 
41312
41429
  .k-scheduler-mark {
41313
41430
  border-radius: 50%;
41314
- }
41315
-
41316
- .k-i-reload,
41317
- .k-i-arrow-rotate-cw {
41318
- font-size: 1em;
41319
- margin-right: .5em;
41431
+ margin: 0;
41320
41432
  }
41321
41433
 
41322
41434
  .k-scheduler-task-text {
@@ -41463,8 +41575,9 @@ $kendo-adaptive-scheduler-subtle-text: $kendo-subtle-text !default;
41463
41575
  &[dir="rtl"],
41464
41576
  [dir="rtl"] & {
41465
41577
 
41466
- .k-header-cancel .k-i-arrow-chevron-left,
41467
- .k-listgroup-item .k-select .k-i-arrow-chevron-right {
41578
+ .k-header-cancel .k-button-icon,
41579
+ .k-listgroup-item .k-select .k-svg-icon,
41580
+ .k-listgroup-item .k-select .k-icon {
41468
41581
  transform: scaleX( -1 );
41469
41582
  }
41470
41583
 
@@ -42062,6 +42175,7 @@ $kendo-grid-row-resizer-height: k-map-get( $kendo-spacing, .5 ) !default;
42062
42175
 
42063
42176
  .k-grid-header,
42064
42177
  .k-grid-content,
42178
+ .k-grid-content-locked,
42065
42179
  .k-grid-footer {
42066
42180
  .k-table {
42067
42181
  table-layout: fixed;
@@ -43329,7 +43443,8 @@ $kendo-grid-row-resizer-height: k-map-get( $kendo-spacing, .5 ) !default;
43329
43443
  cursor: pointer;
43330
43444
 
43331
43445
  > .k-icon,
43332
- > .k-svg-icon {
43446
+ > .k-svg-icon,
43447
+ > .k-expander-indicator {
43333
43448
  margin-inline-end: $kendo-icon-spacing;
43334
43449
  }
43335
43450
  }
@@ -44437,7 +44552,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
44437
44552
  align-items: center;
44438
44553
  flex: 1;
44439
44554
 
44440
- > .k-i-formula-fx {
44555
+ > .k-icon,
44556
+ > .k-svg-icon {
44441
44557
  padding-block: 0;
44442
44558
  padding-inline: $kendo-padding-md-y;
44443
44559
  box-sizing: content-box;
@@ -44948,7 +45064,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
44948
45064
  cursor: pointer;
44949
45065
 
44950
45066
  > .k-icon,
44951
- > .k-svg-icon {
45067
+ > .k-svg-icon,
45068
+ > .k-expander-indicator {
44952
45069
  margin-right: $kendo-padding-md-y;
44953
45070
  }
44954
45071
  }
@@ -48692,24 +48809,6 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
48692
48809
  }
48693
48810
  }
48694
48811
 
48695
- // Generic widgets
48696
- .k-numerictextbox {
48697
- width: 10em;
48698
-
48699
- & + .k-dropdown-list {
48700
- width: 5em;
48701
- }
48702
-
48703
- & + .k-color-picker,
48704
- & + .k-dropdown-list {
48705
- margin-left: k-map-get( $kendo-spacing, 2 );
48706
- }
48707
- }
48708
-
48709
- .k-color-picker {
48710
- vertical-align: middle;
48711
- }
48712
-
48713
48812
  .k-edit-field > .k-checkbox {
48714
48813
  position: relative; // fix scrolling
48715
48814
  }
@@ -51063,24 +51162,11 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
51063
51162
  // Scheduler navigation
51064
51163
  .k-scheduler-navigation {}
51065
51164
 
51066
-
51067
- // View switcher
51068
- .k-scheduler-views-wrapper {
51069
-
51070
- // Views dropdown
51071
- .k-views-dropdown {
51072
- width: auto;
51073
- font: inherit;
51074
- display: none;
51075
- }
51076
-
51077
- @media (max-width: 1024px) {
51078
- .k-scheduler-views { display: none; }
51079
- .k-views-dropdown { display: inline-block; }
51080
- }
51165
+ .k-scheduler-toolbar .k-views-dropdown {
51166
+ width: auto;
51167
+ font: inherit;
51081
51168
  }
51082
51169
 
51083
-
51084
51170
  // Scheduler footer
51085
51171
  .k-scheduler-footer {
51086
51172
  @include box-shadow( none );
@@ -54646,11 +54732,11 @@ $kendo-scrollview-transition-timing-function: ease-in-out !default;
54646
54732
  }
54647
54733
 
54648
54734
  .k-scrollview-prev {
54649
- left: 0;
54735
+ inset-inline-start: 0;
54650
54736
  }
54651
54737
 
54652
54738
  .k-scrollview-next {
54653
- right: 0;
54739
+ inset-inline-end: 0;
54654
54740
  }
54655
54741
 
54656
54742
 
@@ -54676,6 +54762,17 @@ $kendo-scrollview-transition-timing-function: ease-in-out !default;
54676
54762
  }
54677
54763
  }
54678
54764
 
54765
+ .k-rtl,
54766
+ [dir="rtl"] {
54767
+ .k-scrollview-prev,
54768
+ .k-scrollview-next {
54769
+ .k-icon,
54770
+ .k-svg-icon {
54771
+ transform: scaleX(-1);
54772
+ }
54773
+ }
54774
+ }
54775
+
54679
54776
  }
54680
54777
 
54681
54778