@progress/kendo-theme-classic 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.
package/dist/all.scss CHANGED
@@ -6168,6 +6168,22 @@ $kendo-utils: (
6168
6168
  "black": black,
6169
6169
  "white": white
6170
6170
  )),
6171
+ "background-position": (
6172
+ center: center,
6173
+ top: top,
6174
+ right: right,
6175
+ bottom: bottom,
6176
+ left: left,
6177
+ top-left: top left,
6178
+ top-right: top right,
6179
+ bottom-left: bottom left,
6180
+ bottom-right: bottom right
6181
+ ),
6182
+ "background-size": (
6183
+ auto,
6184
+ cover,
6185
+ contain
6186
+ ),
6171
6187
 
6172
6188
  // Border
6173
6189
  "border-width": (
@@ -6577,25 +6593,25 @@ $kendo-utils: (
6577
6593
  /// This is equivalent to `clear: left;`.
6578
6594
  /// @example clear: left;
6579
6595
  /// @name .k-clear-left
6580
- /// @group float
6596
+ /// @group clear
6581
6597
  /// @contextType css
6582
6598
 
6583
6599
  /// This is equivalent to `clear: right;`.
6584
6600
  /// @example clear: right;
6585
6601
  /// @name .k-clear-right
6586
- /// @group float
6602
+ /// @group clear
6587
6603
  /// @contextType css
6588
6604
 
6589
6605
  /// This is equivalent to `clear: both;`.
6590
6606
  /// @example clear: both;
6591
6607
  /// @name .k-clear-both
6592
- /// @group float
6608
+ /// @group clear
6593
6609
  /// @contextType css
6594
6610
 
6595
6611
  /// This is equivalent to `clear: none;`.
6596
6612
  /// @example clear: none;
6597
6613
  /// @name .k-clear-none
6598
- /// @group float
6614
+ /// @group clear
6599
6615
  /// @contextType css
6600
6616
 
6601
6617
  @mixin kendo-utils--layout--clear() {
@@ -7040,91 +7056,91 @@ $kendo-utils: (
7040
7056
  /// This is equivalent to `top: 0;`.
7041
7057
  /// @example top: 0;
7042
7058
  /// @name .k-top-0
7043
- /// @group position
7059
+ /// @group placement
7044
7060
  /// @contextType css
7045
7061
 
7046
7062
  /// This is equivalent to `right: 0;`.
7047
7063
  /// @example right: 0;
7048
7064
  /// @name .k-right-0
7049
- /// @group position
7065
+ /// @group placement
7050
7066
  /// @contextType css
7051
7067
 
7052
7068
  /// This is equivalent to `bottom: 0;`.
7053
7069
  /// @example bottom: 0;
7054
7070
  /// @name .k-bottom-0
7055
- /// @group position
7071
+ /// @group placement
7056
7072
  /// @contextType css
7057
7073
 
7058
7074
  /// This is equivalent to `left: 0;`.
7059
7075
  /// @example left: 0;
7060
7076
  /// @name .k-left-0
7061
- /// @group position
7077
+ /// @group placement
7062
7078
  /// @contextType css
7063
7079
 
7064
7080
  /// This is equivalent to `top: 0;`.
7065
7081
  /// @example top: 0;
7066
7082
  /// @name .k-pos-top-0
7067
- /// @group position
7083
+ /// @group placement
7068
7084
  /// @contextType css
7069
7085
 
7070
7086
  /// This is equivalent to `right: 0;`.
7071
7087
  /// @example right: 0;
7072
7088
  /// @name .k-pos-right-0
7073
- /// @group position
7089
+ /// @group placement
7074
7090
  /// @contextType css
7075
7091
 
7076
7092
  /// This is equivalent to `bottom: 0;`.
7077
7093
  /// @example bottom: 0;
7078
7094
  /// @name .k-pos-bottom-0
7079
- /// @group position
7095
+ /// @group placement
7080
7096
  /// @contextType css
7081
7097
 
7082
7098
  /// This is equivalent to `left: 0;`.
7083
7099
  /// @example left: 0;
7084
7100
  /// @name .k-pos-left-0
7085
- /// @group position
7101
+ /// @group placement
7086
7102
  /// @contextType css
7087
7103
 
7088
7104
  /// This is equivalent to `top: 0; left: 0;`.
7089
7105
  /// @example top: 0; left: 0;
7090
7106
  /// @name .k-top-left-0
7091
- /// @group position
7107
+ /// @group placement
7092
7108
  /// @contextType css
7093
7109
 
7094
7110
  /// This is equivalent to `top: 0; right: 0;`.
7095
7111
  /// @example top: 0; right: 0;
7096
7112
  /// @name .k-top-right-0
7097
- /// @group position
7113
+ /// @group placement
7098
7114
  /// @contextType css
7099
7115
 
7100
7116
  /// This is equivalent to `bottom: 0; left: 0;`.
7101
7117
  /// @example bottom: 0; left: 0;
7102
7118
  /// @name .k-bottom-left-0
7103
- /// @group position
7119
+ /// @group placement
7104
7120
  /// @contextType css
7105
7121
 
7106
7122
  /// This is equivalent to `bottom: 0; right: 0;`.
7107
7123
  /// @example bottom: 0; right: 0;
7108
7124
  /// @name .k-bottom-right-0
7109
- /// @group position
7125
+ /// @group placement
7110
7126
  /// @contextType css
7111
7127
 
7112
- /// 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.
7128
+ /// This is equivalent to `inset: 0;`.
7113
7129
  /// @example inset: 0;
7114
7130
  /// @name .k-inset-0
7115
- /// @group position
7131
+ /// @group placement
7116
7132
  /// @contextType css
7117
7133
 
7118
7134
  /// This is equivalent to `inset-inline: 0;`.
7119
7135
  /// @example inset-inline: 0;
7120
7136
  /// @name .k-inset-x-0
7121
- /// @group position
7137
+ /// @group placement
7122
7138
  /// @contextType css
7123
7139
 
7124
7140
  /// This is equivalent to `inset-block: 0;`.
7125
7141
  /// @example inset-block: 0;
7126
7142
  /// @name .k-inset-y-0
7127
- /// @group position
7143
+ /// @group placement
7128
7144
  /// @contextType css
7129
7145
 
7130
7146
  @mixin kendo-utils--layout--placement() {
@@ -7136,7 +7152,7 @@ $kendo-utils: (
7136
7152
  @include generate-utils( left, left, $kendo-utils-placement );
7137
7153
 
7138
7154
 
7139
- // Position length utility classes
7155
+ // placement length utility classes
7140
7156
  @each $side in (top, right, bottom, left) {
7141
7157
  .#{$kendo-prefix}#{$side},
7142
7158
  .#{$kendo-prefix}pos-#{$side} { #{$side}: 0; } // sass-lint:disable-line brace-style
@@ -8029,37 +8045,37 @@ $kendo-utils: (
8029
8045
  // #region @import "./_grid-auto-flow.scss"; -> node_modules/@progress/kendo-theme-utils/scss/flex-grid/_grid-auto-flow.scss
8030
8046
  /// This is equivalent to `grid-auto-flow: row;`.
8031
8047
  /// @example grid-auto-flow: row;
8032
- /// @name .k-grid-auto-flow-row
8048
+ /// @name .k-grid-flow-row
8033
8049
  /// @group grid-auto-flow
8034
8050
  /// @contextType css
8035
8051
 
8036
8052
  /// This is equivalent to `grid-auto-flow: column;`.
8037
8053
  /// @example grid-auto-flow: column;
8038
- /// @name .k-grid-auto-flow-column
8054
+ /// @name .k-grid-flow-column
8039
8055
  /// @group grid-auto-flow
8040
8056
  /// @contextType css
8041
8057
 
8042
8058
  /// This is equivalent to `grid-auto-flow: dense;`.
8043
8059
  /// @example grid-auto-flow: dense;
8044
- /// @name .k-grid-auto-flow-dense
8060
+ /// @name .k-grid-flow-dense
8045
8061
  /// @group grid-auto-flow
8046
8062
  /// @contextType css
8047
8063
 
8048
8064
  /// This is equivalent to `grid-auto-flow: row dense;`.
8049
8065
  /// @example grid-auto-flow: row dense;
8050
- /// @name .k-grid-auto-flow-row-dense
8066
+ /// @name .k-grid-flow-row-dense
8051
8067
  /// @group grid-auto-flow
8052
8068
  /// @contextType css
8053
8069
 
8054
8070
  /// This is equivalent to `grid-auto-flow: col dense;`.
8055
8071
  /// @example grid-auto-flow: col dense;
8056
- /// @name .k-grid-auto-flow-col-dense
8072
+ /// @name .k-grid-flow-col-dense
8057
8073
  /// @group grid-auto-flow
8058
8074
  /// @contextType css
8059
8075
 
8060
8076
  /// This is equivalent to `grid-auto-flow: unset;`.
8061
8077
  /// @example grid-auto-flow: unset;
8062
- /// @name .k-grid-auto-flow-unset
8078
+ /// @name .k-grid-flow-unset
8063
8079
  /// @group grid-auto-flow
8064
8080
  /// @contextType css
8065
8081
 
@@ -9431,7 +9447,7 @@ $kendo-utils: (
9431
9447
 
9432
9448
  /// This is equivalent to `padding: 0.75rem;`.
9433
9449
  /// @example padding: 0.75rem;
9434
- /// @name .k-p-pd
9450
+ /// @name .k-p-md
9435
9451
  /// @group padding
9436
9452
  /// @contextType css
9437
9453
 
@@ -10826,12 +10842,106 @@ $kendo-utils: (
10826
10842
 
10827
10843
  }
10828
10844
 
10845
+ // #endregion
10846
+ // #region @import "./_background-position.scss"; -> node_modules/@progress/kendo-theme-utils/scss/background/_background-position.scss
10847
+ /// This is equivalent to `background-position: center;`.
10848
+ /// @example background-position: center;
10849
+ /// @name .k-bg-center
10850
+ /// @group background-position
10851
+ /// @contextType css
10852
+
10853
+ /// This is equivalent to `background-position: top;`.
10854
+ /// @example background-position: top;
10855
+ /// @name .k-bg-top
10856
+ /// @group background-position
10857
+ /// @contextType css
10858
+
10859
+ /// This is equivalent to `background-position: right;`.
10860
+ /// @example background-position: right;
10861
+ /// @name .k-bg-right
10862
+ /// @group background-position
10863
+ /// @contextType css
10864
+
10865
+ /// This is equivalent to `background-position: bottom;`.
10866
+ /// @example background-position: bottom;
10867
+ /// @name .k-bg-bottom
10868
+ /// @group background-position
10869
+ /// @contextType css
10870
+
10871
+ /// This is equivalent to `background-position: left;`.
10872
+ /// @example background-position: left;
10873
+ /// @name .k-bg-left
10874
+ /// @group background-position
10875
+ /// @contextType css
10876
+
10877
+ /// This is equivalent to `background-position: top left;`.
10878
+ /// @example background-position: top left;
10879
+ /// @name .k-bg-top-left
10880
+ /// @group background-position
10881
+ /// @contextType css
10882
+
10883
+ /// This is equivalent to `background-position: top right;`.
10884
+ /// @example background-position: top right;
10885
+ /// @name .k-bg-top-right
10886
+ /// @group background-position
10887
+ /// @contextType css
10888
+
10889
+ /// This is equivalent to `background-position: bottom left;`.
10890
+ /// @example background-position: bottom left;
10891
+ /// @name .k-bg-bottom-left
10892
+ /// @group background-position
10893
+ /// @contextType css
10894
+
10895
+ /// This is equivalent to `background-position: bottom right;`.
10896
+ /// @example background-position: bottom right;
10897
+ /// @name .k-bg-bottom-right
10898
+ /// @group background-position
10899
+ /// @contextType css
10900
+
10901
+ @mixin kendo-utils--background--background-position() {
10902
+
10903
+ // Background position utility classes
10904
+ $kendo-utils-background-position: k-map-get( $kendo-utils, "background-position" ) !default;
10905
+ @include generate-utils( bg, background-position, $kendo-utils-background-position );
10906
+
10907
+ }
10908
+
10909
+ // #endregion
10910
+ // #region @import "./_background-size.scss"; -> node_modules/@progress/kendo-theme-utils/scss/background/_background-size.scss
10911
+ /// This is equivalent to `background-size: auto;`.
10912
+ /// @example background-size: auto;
10913
+ /// @name .k-bg-auto
10914
+ /// @group background-size
10915
+ /// @contextType css
10916
+
10917
+ /// This is equivalent to `background-size: cover;`.
10918
+ /// @example background-size: cover;
10919
+ /// @name .k-bg-cover
10920
+ /// @group background-size
10921
+ /// @contextType css
10922
+
10923
+ /// This is equivalent to `background-size: contain;`.
10924
+ /// @example background-size: contain;
10925
+ /// @name .k-bg-contain
10926
+ /// @group background-size
10927
+ /// @contextType css
10928
+
10929
+ @mixin kendo-utils--background--background-size() {
10930
+
10931
+ // Background size utility classes
10932
+ $kendo-utils-background-size: k-map-get( $kendo-utils, "background-size" ) !default;
10933
+ @include generate-utils( bg, background-size, $kendo-utils-background-size );
10934
+
10935
+ }
10936
+
10829
10937
  // #endregion
10830
10938
 
10831
10939
 
10832
10940
  @mixin kendo-utils--background() {
10833
10941
  @include kendo-utils--background--background-clip();
10834
10942
  @include kendo-utils--background--background-color();
10943
+ @include kendo-utils--background--background-position();
10944
+ @include kendo-utils--background--background-size();
10835
10945
  }
10836
10946
 
10837
10947
  // #endregion
@@ -14867,13 +14977,16 @@ $ki-rotate-map: (
14867
14977
  }
14868
14978
 
14869
14979
  // RTL icons
14870
- .k-rtl .k-i-indent-increase,
14871
- .k-rtl .k-i-indent-decrease,
14872
- .k-rtl .k-i-caret-alt-right,
14873
- .k-rtl .k-i-caret-alt-left,
14874
- [dir="rtl"] .k-i-caret-alt-right,
14875
- [dir="rtl"] .k-i-caret-alt-left {
14876
- transform: scaleX(-1);
14980
+ .k-rtl,
14981
+ [dir="rtl"] {
14982
+ .k-i-indent-increase,
14983
+ .k-i-indent-decrease,
14984
+ .k-i-caret-alt-right,
14985
+ .k-i-caret-alt-left,
14986
+ .k-svg-i-caret-alt-right,
14987
+ .k-svg-i-caret-alt-left {
14988
+ transform: scaleX(-1);
14989
+ }
14877
14990
  }
14878
14991
 
14879
14992
  .k-sprite {
@@ -16702,7 +16815,7 @@ $kendo-listgroup-item-border-width: 1px !default;
16702
16815
  flex: 0 0 auto;
16703
16816
  position: absolute;
16704
16817
  top: 50%;
16705
- right: 0;
16818
+ inset-inline-end: 0;
16706
16819
  transform: translateY(-50%);
16707
16820
  }
16708
16821
  }
@@ -22814,7 +22927,6 @@ $kendo-input-sizes: (
22814
22927
  padding-y: $kendo-input-sm-padding-y,
22815
22928
  font-size: $kendo-input-sm-font-size,
22816
22929
  line-height: $kendo-input-sm-line-height,
22817
- icon-size: calc( #{$kendo-icon-size} + #{$kendo-input-sm-padding-y * 2} ),
22818
22930
  button-padding-x: $kendo-input-sm-padding-y,
22819
22931
  button-padding-y: $kendo-input-sm-padding-y
22820
22932
  ),
@@ -22823,7 +22935,6 @@ $kendo-input-sizes: (
22823
22935
  padding-y: $kendo-input-md-padding-y,
22824
22936
  font-size: $kendo-input-md-font-size,
22825
22937
  line-height: $kendo-input-md-line-height,
22826
- icon-size: calc( #{$kendo-icon-size} + #{$kendo-input-md-padding-y * 2} ),
22827
22938
  button-padding-x: $kendo-input-md-padding-y,
22828
22939
  button-padding-y: $kendo-input-md-padding-y
22829
22940
  ),
@@ -22832,7 +22943,6 @@ $kendo-input-sizes: (
22832
22943
  padding-y: $kendo-input-lg-padding-y,
22833
22944
  font-size: $kendo-input-lg-font-size,
22834
22945
  line-height: $kendo-input-lg-line-height,
22835
- icon-size: calc( #{$kendo-icon-size} + #{$kendo-input-lg-padding-y * 2} ),
22836
22946
  button-padding-x: $kendo-input-lg-padding-y,
22837
22947
  button-padding-y: $kendo-input-lg-padding-y
22838
22948
  )
@@ -24334,8 +24444,8 @@ $_kendo-module-meta: (
24334
24444
  box-sizing: border-box;
24335
24445
  }
24336
24446
 
24337
- .k-input,
24338
- .k-picker {
24447
+ > .k-input,
24448
+ > .k-picker {
24339
24449
  border-width: 0 !important; // sass-lint:disable-line no-important
24340
24450
  color: inherit;
24341
24451
  background: none;
@@ -24527,6 +24637,7 @@ $_kendo-module-meta: (
24527
24637
  flex-flow: row nowrap;
24528
24638
  align-items: center;
24529
24639
  justify-content: center;
24640
+ box-sizing: content-box;
24530
24641
  }
24531
24642
 
24532
24643
  // Input with SVG icon
@@ -24699,7 +24810,6 @@ $_kendo-module-meta: (
24699
24810
  $_padding-y: k-map-get( $size-props, padding-y );
24700
24811
  $_font-size: k-map-get( $size-props, font-size );
24701
24812
  $_line-height: k-map-get( $size-props, line-height );
24702
- $_icon-size: k-map-get( $size-props, icon-size );
24703
24813
  $_button-padding-x: k-map-get( $size-props, button-padding-x );
24704
24814
  $_button-padding-y: k-map-get( $size-props, button-padding-y );
24705
24815
 
@@ -24737,8 +24847,9 @@ $_kendo-module-meta: (
24737
24847
  .k-input-prefix > .k-svg-icon,
24738
24848
  .k-input-suffix > .k-icon,
24739
24849
  .k-input-suffix > .k-svg-icon {
24740
- width: $_icon-size;
24741
- height: $_icon-size;
24850
+ padding-block: $_padding-y;
24851
+ padding-inline: $_padding-y;
24852
+ box-sizing: content-box;
24742
24853
  }
24743
24854
 
24744
24855
  &.k-icon-picker .k-input-inner {
@@ -26193,11 +26304,8 @@ $kendo-listbox-drop-hint-width: 1px !default;
26193
26304
  &[dir="rtl"],
26194
26305
  [dir="rtl"] & {
26195
26306
 
26196
- &.k-listbox-actions-left,
26197
- &.k-listbox-actions-right {
26198
- .k-listbox-actions {
26199
- transform: scaleX(-1);
26200
- }
26307
+ .k-listbox-actions .k-button-icon {
26308
+ transform: scaleX(-1);
26201
26309
  }
26202
26310
  }
26203
26311
  }
@@ -34740,12 +34848,12 @@ $kendo-fab-sm-padding-y: k-math-div( $kendo-fab-padding-y, 2 ) !default;
34740
34848
  $kendo-fab-md-padding-y: $kendo-fab-padding-y !default;
34741
34849
  $kendo-fab-lg-padding-y: ( $kendo-fab-padding-y * 1.5 ) !default;
34742
34850
 
34743
- /// FAB icon width.
34851
+ /// Horizontal padding of the FAB icon.
34744
34852
  /// @group floating-action-button
34745
- $kendo-fab-icon-width: 20px !default;
34746
- /// FAB icon height.
34853
+ $kendo-fab-icon-padding-x: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
34854
+ /// Vertical padding of the FAB icon.
34747
34855
  /// @group floating-action-button
34748
- $kendo-fab-icon-height: $kendo-fab-icon-width !default;
34856
+ $kendo-fab-icon-padding-y: $kendo-fab-icon-padding-x !default;
34749
34857
  /// FAB icon spacing.
34750
34858
  /// @group floating-action-button
34751
34859
  $kendo-fab-icon-spacing: k-map-get( $kendo-spacing, 0.5 ) !default; // sass-lint:disable-line leading-zero
@@ -34778,7 +34886,7 @@ $kendo-fab-item-text-line-height: 1.2 !default;
34778
34886
 
34779
34887
  /// FAB item icon horizontal padding.
34780
34888
  /// @group floating-action-button
34781
- $kendo-fab-item-icon-padding-x: k-map-get( $kendo-spacing, 2 ) !default;
34889
+ $kendo-fab-item-icon-padding-x: k-map-get( $kendo-spacing, 2 ) + $kendo-fab-icon-padding-x !default;
34782
34890
  /// FAB item icon vertical padding.
34783
34891
  /// @group floating-action-button
34784
34892
  $kendo-fab-item-icon-padding-y: $kendo-fab-item-icon-padding-x !default;
@@ -34788,12 +34896,6 @@ $kendo-fab-item-icon-border-width: 0 !default;
34788
34896
  /// Border radius of the FAB item icon.
34789
34897
  /// @group floating-action-button
34790
34898
  $kendo-fab-item-icon-border-radius: 50% !default;
34791
- /// Width of the FAB item icon.
34792
- /// @group floating-action-button
34793
- $kendo-fab-item-icon-width: 20px !default;
34794
- /// Height of the FAB item icon.
34795
- /// @group floating-action-button
34796
- $kendo-fab-item-icon-height: $kendo-fab-item-icon-width !default;
34797
34899
 
34798
34900
  /// Theme colors map for the FAB.
34799
34901
  /// @group floating-action-button
@@ -34913,8 +35015,9 @@ $kendo-fab-item-outline-color: rgba(0, 0, 0, .08) !default;
34913
35015
 
34914
35016
  // FAB Icon
34915
35017
  .k-fab-icon {
34916
- width: $kendo-fab-icon-width;
34917
- height: $kendo-fab-icon-height;
35018
+ padding-inline: $kendo-fab-icon-padding-x;
35019
+ padding-block: $kendo-fab-icon-padding-y;
35020
+ box-sizing: content-box;
34918
35021
 
34919
35022
  .k-icon-wrapper-host:not(:only-child) &,
34920
35023
  &:not(:only-child) {
@@ -34995,8 +35098,6 @@ $kendo-fab-item-outline-color: rgba(0, 0, 0, .08) !default;
34995
35098
  }
34996
35099
 
34997
35100
  .k-fab-item-icon {
34998
- width: $kendo-fab-item-icon-width;
34999
- height: $kendo-fab-item-icon-height;
35000
35101
  padding-block: $kendo-fab-item-icon-padding-y;
35001
35102
  padding-inline: $kendo-fab-item-icon-padding-x;
35002
35103
  border-width: $kendo-fab-item-icon-border-width;
@@ -35153,7 +35254,7 @@ $kendo-fab-item-outline-color: rgba(0, 0, 0, .08) !default;
35153
35254
  }
35154
35255
 
35155
35256
  // Popup
35156
- .k-animation-container > .k-fab-popup {
35257
+ .k-fab-popup {
35157
35258
  @include box-shadow( none );
35158
35259
  }
35159
35260
 
@@ -35521,7 +35622,7 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
35521
35622
  border-width: if( $kendo-actionsheet-border-width, $kendo-actionsheet-border-width, null );
35522
35623
  border-top-width: if( $kendo-actionsheet-border-width, 0, null );
35523
35624
  top: 0;
35524
- left: 50%;
35625
+ inset-inline-start: 50%;
35525
35626
  transform: translateX( -50% );
35526
35627
  }
35527
35628
  .k-actionsheet-bottom {
@@ -35529,7 +35630,7 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
35529
35630
  border-width: if( $kendo-actionsheet-border-width, $kendo-actionsheet-border-width, null );
35530
35631
  border-bottom-width: if( $kendo-actionsheet-border-width, 0, null );
35531
35632
  bottom: 0;
35532
- left: 50%;
35633
+ inset-inline-start: 50%;
35533
35634
  transform: translateX( -50% );
35534
35635
  }
35535
35636
  .k-actionsheet-left {
@@ -35688,6 +35789,15 @@ $kendo-adaptive-actionsheet-footer-padding-x: k-map-get( $kendo-spacing, 4 ) !de
35688
35789
  }
35689
35790
  }
35690
35791
 
35792
+ // RTL
35793
+ .k-rtl,
35794
+ [dir="rtl"] {
35795
+ .k-actionsheet-top,
35796
+ .k-actionsheet-bottom {
35797
+ transform: translateX( 50% );
35798
+ }
35799
+ }
35800
+
35691
35801
  }
35692
35802
 
35693
35803
 
@@ -36401,6 +36511,8 @@ $kendo-drawer-item-level-padding-x: $kendo-drawer-item-padding-x !default;
36401
36511
  $kendo-drawer-item-level-count: 5 !default;
36402
36512
 
36403
36513
  $kendo-drawer-icon-size: $kendo-icon-size !default;
36514
+ $kendo-drawer-icon-padding-x: 0 !default;
36515
+ $kendo-drawer-icon-padding-y: k-map-get( $kendo-spacing, 1 ) !default;
36404
36516
 
36405
36517
  $kendo-drawer-mini-initial-width: calc( 2 * #{$kendo-drawer-item-padding-x} + #{$kendo-drawer-icon-size} ) !default;
36406
36518
 
@@ -36575,16 +36687,26 @@ $kendo-drawer-selected-hover-text: $kendo-selected-hover-text !default;
36575
36687
 
36576
36688
  .k-svg-icon,
36577
36689
  .k-icon {
36578
- height: auto;
36579
- font-size: $kendo-drawer-icon-size;
36580
- line-height: $kendo-drawer-item-line-height;
36581
36690
  flex-shrink: 0;
36691
+ padding-inline: $kendo-drawer-icon-padding-x;
36692
+ padding-block: $kendo-drawer-icon-padding-y;
36693
+ box-sizing: content-box;
36582
36694
 
36583
36695
  &.k-i-none {
36584
36696
  margin: 0;
36585
36697
  }
36586
36698
  }
36587
36699
 
36700
+ .k-icon {
36701
+ height: auto;
36702
+ font-size: $kendo-drawer-icon-size;
36703
+ }
36704
+
36705
+ .k-svg-icon {
36706
+ width: $kendo-drawer-icon-size;
36707
+ height: $kendo-drawer-icon-size;
36708
+ }
36709
+
36588
36710
  .k-item-text {
36589
36711
  display: inline-block;
36590
36712
  white-space: nowrap;
@@ -38254,7 +38376,7 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
38254
38376
 
38255
38377
  // Solid
38256
38378
  @each $name, $color in $kendo-theme-colors {
38257
- .k-bottom-nav-solid.k-bottom-nav-#{$name} {
38379
+ .k-bottom-nav-solid-#{$name} {
38258
38380
  @include fill(
38259
38381
  $color: k-true-mix( $color, k-contrast-legacy( $color ), 35%),
38260
38382
  $bg: $color
@@ -38269,23 +38391,27 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
38269
38391
  @include fill( $color: k-contrast-legacy( $color ) );
38270
38392
  }
38271
38393
  }
38394
+ // TODO: remove when suites update class names
38395
+ .k-bottom-nav-solid.k-bottom-nav-#{$name} {
38396
+ @extend .k-bottom-nav-solid-#{$name} !optional;
38397
+ }
38272
38398
  }
38273
38399
 
38274
38400
  // Flat
38275
- .k-bottom-nav-flat {
38276
- @include fill(
38277
- $kendo-bottom-nav-flat-text,
38278
- $kendo-bottom-nav-flat-bg,
38279
- $kendo-bottom-nav-flat-border
38280
- );
38401
+ @each $name, $color in $kendo-theme-colors {
38402
+ .k-bottom-nav-flat-#{$name} {
38403
+ @include fill(
38404
+ $kendo-bottom-nav-flat-text,
38405
+ $kendo-bottom-nav-flat-bg,
38406
+ $kendo-bottom-nav-flat-border
38407
+ );
38281
38408
 
38282
- .k-bottom-nav-item.k-focus,
38283
- .k-bottom-nav-item:focus {
38284
- @include fill( $bg: rgba($kendo-bottom-nav-flat-text, .05) );
38285
- }
38409
+ .k-bottom-nav-item.k-focus,
38410
+ .k-bottom-nav-item:focus {
38411
+ @include fill( $bg: rgba($kendo-bottom-nav-flat-text, .05) );
38412
+ }
38286
38413
 
38287
- @each $name, $color in $kendo-theme-colors {
38288
- &.k-bottom-nav-#{$name} .k-bottom-nav-item.k-selected {
38414
+ .k-bottom-nav-item.k-selected {
38289
38415
  @if $name == "secondary" or $name == "light" {
38290
38416
  @include fill( $color: k-try-shade($color, 3) );
38291
38417
  } @else {
@@ -38293,6 +38419,9 @@ $kendo-bottom-nav-flat-border: $kendo-component-border !default;
38293
38419
  }
38294
38420
  }
38295
38421
  }
38422
+ .k-bottom-nav-flat.k-bottom-nav-#{$name} {
38423
+ @extend .k-bottom-nav-flat-#{$name} !optional;
38424
+ }
38296
38425
  }
38297
38426
 
38298
38427
  }
@@ -38469,12 +38598,6 @@ $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba( black, .06 ) !default;
38469
38598
  overflow: hidden;
38470
38599
  }
38471
38600
 
38472
- .k-breadcrumb-container {
38473
- // TODO: use !k-flex-wrap in rendering
38474
- &.k-flex-wrap {
38475
- flex-wrap: wrap;
38476
- }
38477
- }
38478
38601
  .k-breadcrumb-root-item-container {
38479
38602
  align-items: flex-start;
38480
38603
  flex-shrink: 0;
@@ -38486,6 +38609,7 @@ $kendo-breadcrumb-focus-shadow: 0 0 2px 1px rgba( black, .06 ) !default;
38486
38609
  vertical-align: middle;
38487
38610
  display: inline-flex;
38488
38611
  flex-direction: row;
38612
+ flex: none;
38489
38613
  align-items: center;
38490
38614
  overflow: hidden;
38491
38615
  }
@@ -38922,18 +39046,7 @@ $kendo-pager-sizes: (
38922
39046
  .k-rtl &,
38923
39047
  &[dir="rtl"],
38924
39048
  [dir="rtl"] & {
38925
- .k-i-caret-alt-to-left,
38926
- .k-i-caret-alt-to-right,
38927
- .k-i-caret-alt-left,
38928
- .k-i-caret-alt-right,
38929
- .k-i-arrow-end-left,
38930
- .k-i-arrow-60-left,
38931
- .k-i-arrow-60-right,
38932
- .k-i-arrow-end-right,
38933
- .k-i-seek-w,
38934
- .k-i-arrow-w,
38935
- .k-i-arrow-e,
38936
- .k-i-seek-e {
39049
+ .k-pager-nav .k-button-icon {
38937
39050
  transform: scaleX(-1);
38938
39051
  }
38939
39052
  }
@@ -40931,6 +41044,9 @@ $kendo-expander-content-padding-y: k-map-get( $kendo-spacing, 4 ) !default;
40931
41044
  // Expand / collapse icon
40932
41045
  .k-expander-indicator {
40933
41046
  margin-left: $kendo-expander-indicator-margin-x;
41047
+ display: flex;
41048
+ justify-content: center;
41049
+ align-items: center;
40934
41050
  }
40935
41051
 
40936
41052
  // Expander content
@@ -42549,15 +42665,11 @@ $kendo-adaptive-scheduler-subtle-text: $kendo-subtle-text !default;
42549
42665
  .k-task {
42550
42666
  display: flex;
42551
42667
  align-items: center;
42668
+ gap: .5em;
42552
42669
 
42553
42670
  .k-scheduler-mark {
42554
42671
  border-radius: 50%;
42555
- }
42556
-
42557
- .k-i-reload,
42558
- .k-i-arrow-rotate-cw {
42559
- font-size: 1em;
42560
- margin-right: .5em;
42672
+ margin: 0;
42561
42673
  }
42562
42674
 
42563
42675
  .k-scheduler-task-text {
@@ -42704,8 +42816,9 @@ $kendo-adaptive-scheduler-subtle-text: $kendo-subtle-text !default;
42704
42816
  &[dir="rtl"],
42705
42817
  [dir="rtl"] & {
42706
42818
 
42707
- .k-header-cancel .k-i-arrow-chevron-left,
42708
- .k-listgroup-item .k-select .k-i-arrow-chevron-right {
42819
+ .k-header-cancel .k-button-icon,
42820
+ .k-listgroup-item .k-select .k-svg-icon,
42821
+ .k-listgroup-item .k-select .k-icon {
42709
42822
  transform: scaleX( -1 );
42710
42823
  }
42711
42824
 
@@ -43325,6 +43438,7 @@ $kendo-grid-row-resizer-height: k-map-get( $kendo-spacing, .5 ) !default;
43325
43438
 
43326
43439
  .k-grid-header,
43327
43440
  .k-grid-content,
43441
+ .k-grid-content-locked,
43328
43442
  .k-grid-footer {
43329
43443
  .k-table {
43330
43444
  table-layout: fixed;
@@ -44592,7 +44706,8 @@ $kendo-grid-row-resizer-height: k-map-get( $kendo-spacing, .5 ) !default;
44592
44706
  cursor: pointer;
44593
44707
 
44594
44708
  > .k-icon,
44595
- > .k-svg-icon {
44709
+ > .k-svg-icon,
44710
+ > .k-expander-indicator {
44596
44711
  margin-inline-end: $kendo-icon-spacing;
44597
44712
  }
44598
44713
  }
@@ -45732,7 +45847,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
45732
45847
  align-items: center;
45733
45848
  flex: 1;
45734
45849
 
45735
- > .k-i-formula-fx {
45850
+ > .k-icon,
45851
+ > .k-svg-icon {
45736
45852
  padding-block: 0;
45737
45853
  padding-inline: $kendo-padding-md-y;
45738
45854
  box-sizing: content-box;
@@ -46243,7 +46359,8 @@ $kendo-spreadsheet-drawing-anchor-bg: rgba( $kendo-selected-bg, .25 ) !default;
46243
46359
  cursor: pointer;
46244
46360
 
46245
46361
  > .k-icon,
46246
- > .k-svg-icon {
46362
+ > .k-svg-icon,
46363
+ > .k-expander-indicator {
46247
46364
  margin-right: $kendo-padding-md-y;
46248
46365
  }
46249
46366
  }
@@ -50083,24 +50200,6 @@ $kendo-editor-selectednode-outline-color: #8cf !default; // sass-lint:disable-li
50083
50200
  }
50084
50201
  }
50085
50202
 
50086
- // Generic widgets
50087
- .k-numerictextbox {
50088
- width: 10em;
50089
-
50090
- & + .k-dropdown-list {
50091
- width: 5em;
50092
- }
50093
-
50094
- & + .k-color-picker,
50095
- & + .k-dropdown-list {
50096
- margin-left: k-map-get( $kendo-spacing, 2 );
50097
- }
50098
- }
50099
-
50100
- .k-color-picker {
50101
- vertical-align: middle;
50102
- }
50103
-
50104
50203
  .k-edit-field > .k-checkbox {
50105
50204
  position: relative; // fix scrolling
50106
50205
  }
@@ -52498,24 +52597,11 @@ $kendo-scheduler-tooltip-callout-text: $kendo-scheduler-tooltip-bg !default;
52498
52597
  // Scheduler navigation
52499
52598
  .k-scheduler-navigation {}
52500
52599
 
52501
-
52502
- // View switcher
52503
- .k-scheduler-views-wrapper {
52504
-
52505
- // Views dropdown
52506
- .k-views-dropdown {
52507
- width: auto;
52508
- font: inherit;
52509
- display: none;
52510
- }
52511
-
52512
- @media (max-width: 1024px) {
52513
- .k-scheduler-views { display: none; }
52514
- .k-views-dropdown { display: inline-block; }
52515
- }
52600
+ .k-scheduler-toolbar .k-views-dropdown {
52601
+ width: auto;
52602
+ font: inherit;
52516
52603
  }
52517
52604
 
52518
-
52519
52605
  // Scheduler footer
52520
52606
  .k-scheduler-footer {
52521
52607
  @include box-shadow( none );
@@ -56177,11 +56263,11 @@ $kendo-scrollview-transition-timing-function: ease-in-out !default;
56177
56263
  }
56178
56264
 
56179
56265
  .k-scrollview-prev {
56180
- left: 0;
56266
+ inset-inline-start: 0;
56181
56267
  }
56182
56268
 
56183
56269
  .k-scrollview-next {
56184
- right: 0;
56270
+ inset-inline-end: 0;
56185
56271
  }
56186
56272
 
56187
56273
 
@@ -56207,6 +56293,17 @@ $kendo-scrollview-transition-timing-function: ease-in-out !default;
56207
56293
  }
56208
56294
  }
56209
56295
 
56296
+ .k-rtl,
56297
+ [dir="rtl"] {
56298
+ .k-scrollview-prev,
56299
+ .k-scrollview-next {
56300
+ .k-icon,
56301
+ .k-svg-icon {
56302
+ transform: scaleX(-1);
56303
+ }
56304
+ }
56305
+ }
56306
+
56210
56307
  }
56211
56308
 
56212
56309