@syncfusion/blazor-themes 26.2.8 → 26.2.10

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 (201) hide show
  1. package/SCSS-Themes/bds-dark.scss +68 -7
  2. package/SCSS-Themes/bds.scss +68 -7
  3. package/SCSS-Themes/bootstrap-dark.scss +68 -7
  4. package/SCSS-Themes/bootstrap.scss +68 -7
  5. package/SCSS-Themes/bootstrap4.scss +68 -7
  6. package/SCSS-Themes/bootstrap5-dark.scss +72 -11
  7. package/SCSS-Themes/bootstrap5.scss +72 -11
  8. package/SCSS-Themes/calendars/datetimepicker/bds-dark.scss +20 -0
  9. package/SCSS-Themes/calendars/datetimepicker/bds.scss +20 -0
  10. package/SCSS-Themes/calendars/datetimepicker/bootstrap-dark.scss +20 -0
  11. package/SCSS-Themes/calendars/datetimepicker/bootstrap.scss +20 -0
  12. package/SCSS-Themes/calendars/datetimepicker/bootstrap4.scss +20 -0
  13. package/SCSS-Themes/calendars/datetimepicker/bootstrap5-dark.scss +20 -0
  14. package/SCSS-Themes/calendars/datetimepicker/bootstrap5.scss +20 -0
  15. package/SCSS-Themes/calendars/datetimepicker/fabric-dark.scss +20 -0
  16. package/SCSS-Themes/calendars/datetimepicker/fabric.scss +20 -0
  17. package/SCSS-Themes/calendars/datetimepicker/fluent-dark.scss +20 -0
  18. package/SCSS-Themes/calendars/datetimepicker/fluent.scss +20 -0
  19. package/SCSS-Themes/calendars/datetimepicker/fluent2-dark.scss +20 -0
  20. package/SCSS-Themes/calendars/datetimepicker/fluent2.scss +20 -0
  21. package/SCSS-Themes/calendars/datetimepicker/highcontrast.scss +20 -0
  22. package/SCSS-Themes/calendars/datetimepicker/material-dark.scss +20 -0
  23. package/SCSS-Themes/calendars/datetimepicker/material.scss +20 -0
  24. package/SCSS-Themes/calendars/datetimepicker/material3-dark.scss +20 -0
  25. package/SCSS-Themes/calendars/datetimepicker/material3.scss +20 -0
  26. package/SCSS-Themes/calendars/datetimepicker/tailwind-dark.scss +20 -0
  27. package/SCSS-Themes/calendars/datetimepicker/tailwind.scss +20 -0
  28. package/SCSS-Themes/dropdowns/drop-down-base/bds-dark.scss +2 -0
  29. package/SCSS-Themes/dropdowns/drop-down-base/bds.scss +2 -0
  30. package/SCSS-Themes/dropdowns/drop-down-base/bootstrap-dark.scss +2 -0
  31. package/SCSS-Themes/dropdowns/drop-down-base/bootstrap.scss +2 -0
  32. package/SCSS-Themes/dropdowns/drop-down-base/bootstrap4.scss +2 -0
  33. package/SCSS-Themes/dropdowns/drop-down-base/bootstrap5-dark.scss +2 -0
  34. package/SCSS-Themes/dropdowns/drop-down-base/bootstrap5.scss +2 -0
  35. package/SCSS-Themes/dropdowns/drop-down-base/fabric-dark.scss +2 -0
  36. package/SCSS-Themes/dropdowns/drop-down-base/fabric.scss +2 -0
  37. package/SCSS-Themes/dropdowns/drop-down-base/fluent-dark.scss +2 -0
  38. package/SCSS-Themes/dropdowns/drop-down-base/fluent.scss +2 -0
  39. package/SCSS-Themes/dropdowns/drop-down-base/fluent2-dark.scss +2 -0
  40. package/SCSS-Themes/dropdowns/drop-down-base/fluent2.scss +2 -0
  41. package/SCSS-Themes/dropdowns/drop-down-base/highcontrast.scss +2 -0
  42. package/SCSS-Themes/dropdowns/drop-down-base/material-dark.scss +2 -0
  43. package/SCSS-Themes/dropdowns/drop-down-base/material.scss +2 -0
  44. package/SCSS-Themes/dropdowns/drop-down-base/material3-dark.scss +2 -0
  45. package/SCSS-Themes/dropdowns/drop-down-base/material3.scss +2 -0
  46. package/SCSS-Themes/dropdowns/drop-down-base/tailwind-dark.scss +2 -0
  47. package/SCSS-Themes/dropdowns/drop-down-base/tailwind.scss +2 -0
  48. package/SCSS-Themes/dropdowns/list-box/bds-dark.scss +6 -0
  49. package/SCSS-Themes/dropdowns/list-box/bds.scss +6 -0
  50. package/SCSS-Themes/dropdowns/list-box/bootstrap-dark.scss +6 -0
  51. package/SCSS-Themes/dropdowns/list-box/bootstrap.scss +6 -0
  52. package/SCSS-Themes/dropdowns/list-box/bootstrap4.scss +6 -0
  53. package/SCSS-Themes/dropdowns/list-box/bootstrap5-dark.scss +6 -0
  54. package/SCSS-Themes/dropdowns/list-box/bootstrap5.scss +6 -0
  55. package/SCSS-Themes/dropdowns/list-box/fabric-dark.scss +6 -0
  56. package/SCSS-Themes/dropdowns/list-box/fabric.scss +6 -0
  57. package/SCSS-Themes/dropdowns/list-box/fluent-dark.scss +6 -0
  58. package/SCSS-Themes/dropdowns/list-box/fluent.scss +6 -0
  59. package/SCSS-Themes/dropdowns/list-box/fluent2-dark.scss +6 -0
  60. package/SCSS-Themes/dropdowns/list-box/fluent2.scss +6 -0
  61. package/SCSS-Themes/dropdowns/list-box/highcontrast.scss +6 -0
  62. package/SCSS-Themes/dropdowns/list-box/material-dark.scss +6 -0
  63. package/SCSS-Themes/dropdowns/list-box/material.scss +6 -0
  64. package/SCSS-Themes/dropdowns/list-box/material3-dark.scss +6 -0
  65. package/SCSS-Themes/dropdowns/list-box/material3.scss +6 -0
  66. package/SCSS-Themes/dropdowns/list-box/tailwind-dark.scss +6 -0
  67. package/SCSS-Themes/dropdowns/list-box/tailwind.scss +6 -0
  68. package/SCSS-Themes/dropdowns/multi-select/bds-dark.scss +1 -0
  69. package/SCSS-Themes/dropdowns/multi-select/bds.scss +1 -0
  70. package/SCSS-Themes/dropdowns/multi-select/bootstrap-dark.scss +1 -0
  71. package/SCSS-Themes/dropdowns/multi-select/bootstrap.scss +1 -0
  72. package/SCSS-Themes/dropdowns/multi-select/bootstrap4.scss +1 -0
  73. package/SCSS-Themes/dropdowns/multi-select/bootstrap5-dark.scss +1 -0
  74. package/SCSS-Themes/dropdowns/multi-select/bootstrap5.scss +1 -0
  75. package/SCSS-Themes/dropdowns/multi-select/fabric-dark.scss +1 -0
  76. package/SCSS-Themes/dropdowns/multi-select/fabric.scss +1 -0
  77. package/SCSS-Themes/dropdowns/multi-select/fluent-dark.scss +1 -0
  78. package/SCSS-Themes/dropdowns/multi-select/fluent.scss +1 -0
  79. package/SCSS-Themes/dropdowns/multi-select/fluent2-dark.scss +1 -0
  80. package/SCSS-Themes/dropdowns/multi-select/fluent2.scss +1 -0
  81. package/SCSS-Themes/dropdowns/multi-select/highcontrast.scss +1 -0
  82. package/SCSS-Themes/dropdowns/multi-select/material-dark.scss +1 -0
  83. package/SCSS-Themes/dropdowns/multi-select/material.scss +1 -0
  84. package/SCSS-Themes/dropdowns/multi-select/material3-dark.scss +1 -0
  85. package/SCSS-Themes/dropdowns/multi-select/material3.scss +1 -0
  86. package/SCSS-Themes/dropdowns/multi-select/tailwind-dark.scss +1 -0
  87. package/SCSS-Themes/dropdowns/multi-select/tailwind.scss +1 -0
  88. package/SCSS-Themes/fabric-dark.scss +68 -7
  89. package/SCSS-Themes/fabric.scss +68 -7
  90. package/SCSS-Themes/fluent-dark.scss +68 -7
  91. package/SCSS-Themes/fluent.scss +68 -7
  92. package/SCSS-Themes/fluent2-dark.scss +71 -9
  93. package/SCSS-Themes/fluent2.scss +71 -9
  94. package/SCSS-Themes/grids/excel-filter/bds-dark.scss +2 -1
  95. package/SCSS-Themes/grids/excel-filter/bds.scss +2 -1
  96. package/SCSS-Themes/grids/excel-filter/bootstrap-dark.scss +2 -1
  97. package/SCSS-Themes/grids/excel-filter/bootstrap.scss +2 -1
  98. package/SCSS-Themes/grids/excel-filter/bootstrap4.scss +2 -1
  99. package/SCSS-Themes/grids/excel-filter/bootstrap5-dark.scss +2 -1
  100. package/SCSS-Themes/grids/excel-filter/bootstrap5.scss +2 -1
  101. package/SCSS-Themes/grids/excel-filter/fabric-dark.scss +2 -1
  102. package/SCSS-Themes/grids/excel-filter/fabric.scss +2 -1
  103. package/SCSS-Themes/grids/excel-filter/fluent-dark.scss +2 -1
  104. package/SCSS-Themes/grids/excel-filter/fluent.scss +2 -1
  105. package/SCSS-Themes/grids/excel-filter/fluent2-dark.scss +2 -1
  106. package/SCSS-Themes/grids/excel-filter/fluent2.scss +2 -1
  107. package/SCSS-Themes/grids/excel-filter/highcontrast.scss +2 -1
  108. package/SCSS-Themes/grids/excel-filter/material-dark.scss +2 -1
  109. package/SCSS-Themes/grids/excel-filter/material.scss +2 -1
  110. package/SCSS-Themes/grids/excel-filter/material3-dark.scss +2 -1
  111. package/SCSS-Themes/grids/excel-filter/material3.scss +2 -1
  112. package/SCSS-Themes/grids/excel-filter/tailwind-dark.scss +2 -1
  113. package/SCSS-Themes/grids/excel-filter/tailwind.scss +2 -1
  114. package/SCSS-Themes/grids/grid/bds-dark.scss +28 -4
  115. package/SCSS-Themes/grids/grid/bds.scss +28 -4
  116. package/SCSS-Themes/grids/grid/bootstrap-dark.scss +28 -4
  117. package/SCSS-Themes/grids/grid/bootstrap.scss +28 -4
  118. package/SCSS-Themes/grids/grid/bootstrap4.scss +28 -4
  119. package/SCSS-Themes/grids/grid/bootstrap5-dark.scss +32 -8
  120. package/SCSS-Themes/grids/grid/bootstrap5.scss +32 -8
  121. package/SCSS-Themes/grids/grid/fabric-dark.scss +28 -4
  122. package/SCSS-Themes/grids/grid/fabric.scss +28 -4
  123. package/SCSS-Themes/grids/grid/fluent-dark.scss +28 -4
  124. package/SCSS-Themes/grids/grid/fluent.scss +28 -4
  125. package/SCSS-Themes/grids/grid/fluent2-dark.scss +31 -6
  126. package/SCSS-Themes/grids/grid/fluent2.scss +31 -6
  127. package/SCSS-Themes/grids/grid/highcontrast.scss +29 -5
  128. package/SCSS-Themes/grids/grid/material-dark.scss +28 -4
  129. package/SCSS-Themes/grids/grid/material.scss +29 -5
  130. package/SCSS-Themes/grids/grid/material3-dark.scss +28 -4
  131. package/SCSS-Themes/grids/grid/material3.scss +28 -4
  132. package/SCSS-Themes/grids/grid/tailwind-dark.scss +28 -4
  133. package/SCSS-Themes/grids/grid/tailwind.scss +28 -4
  134. package/SCSS-Themes/highcontrast.scss +69 -8
  135. package/SCSS-Themes/inputs/signature/bds-dark.scss +2 -2
  136. package/SCSS-Themes/inputs/signature/bds.scss +2 -2
  137. package/SCSS-Themes/inputs/signature/bootstrap-dark.scss +2 -2
  138. package/SCSS-Themes/inputs/signature/bootstrap.scss +2 -2
  139. package/SCSS-Themes/inputs/signature/bootstrap4.scss +2 -2
  140. package/SCSS-Themes/inputs/signature/bootstrap5-dark.scss +2 -2
  141. package/SCSS-Themes/inputs/signature/bootstrap5.scss +2 -2
  142. package/SCSS-Themes/inputs/signature/fabric-dark.scss +2 -2
  143. package/SCSS-Themes/inputs/signature/fabric.scss +2 -2
  144. package/SCSS-Themes/inputs/signature/fluent-dark.scss +2 -2
  145. package/SCSS-Themes/inputs/signature/fluent.scss +2 -2
  146. package/SCSS-Themes/inputs/signature/fluent2-dark.scss +2 -2
  147. package/SCSS-Themes/inputs/signature/fluent2.scss +2 -2
  148. package/SCSS-Themes/inputs/signature/highcontrast.scss +2 -2
  149. package/SCSS-Themes/inputs/signature/material-dark.scss +2 -2
  150. package/SCSS-Themes/inputs/signature/material.scss +2 -2
  151. package/SCSS-Themes/inputs/signature/material3-dark.scss +2 -2
  152. package/SCSS-Themes/inputs/signature/material3.scss +2 -2
  153. package/SCSS-Themes/inputs/signature/tailwind-dark.scss +2 -2
  154. package/SCSS-Themes/inputs/signature/tailwind.scss +2 -2
  155. package/SCSS-Themes/material-dark.scss +68 -7
  156. package/SCSS-Themes/material.scss +69 -8
  157. package/SCSS-Themes/material3-dark.scss +68 -7
  158. package/SCSS-Themes/material3.scss +68 -7
  159. package/SCSS-Themes/navigations/pager/bds-dark.scss +6 -0
  160. package/SCSS-Themes/navigations/pager/bds.scss +6 -0
  161. package/SCSS-Themes/navigations/pager/bootstrap-dark.scss +6 -0
  162. package/SCSS-Themes/navigations/pager/bootstrap.scss +6 -0
  163. package/SCSS-Themes/navigations/pager/bootstrap4.scss +6 -0
  164. package/SCSS-Themes/navigations/pager/bootstrap5-dark.scss +6 -0
  165. package/SCSS-Themes/navigations/pager/bootstrap5.scss +6 -0
  166. package/SCSS-Themes/navigations/pager/fabric-dark.scss +6 -0
  167. package/SCSS-Themes/navigations/pager/fabric.scss +6 -0
  168. package/SCSS-Themes/navigations/pager/fluent-dark.scss +6 -0
  169. package/SCSS-Themes/navigations/pager/fluent.scss +6 -0
  170. package/SCSS-Themes/navigations/pager/fluent2-dark.scss +6 -0
  171. package/SCSS-Themes/navigations/pager/fluent2.scss +6 -0
  172. package/SCSS-Themes/navigations/pager/highcontrast.scss +6 -0
  173. package/SCSS-Themes/navigations/pager/material-dark.scss +6 -0
  174. package/SCSS-Themes/navigations/pager/material.scss +6 -0
  175. package/SCSS-Themes/navigations/pager/material3-dark.scss +6 -0
  176. package/SCSS-Themes/navigations/pager/material3.scss +6 -0
  177. package/SCSS-Themes/navigations/pager/tailwind-dark.scss +6 -0
  178. package/SCSS-Themes/navigations/pager/tailwind.scss +6 -0
  179. package/SCSS-Themes/popups/dialog/bds-dark.scss +1 -0
  180. package/SCSS-Themes/popups/dialog/bds.scss +1 -0
  181. package/SCSS-Themes/popups/dialog/bootstrap-dark.scss +1 -0
  182. package/SCSS-Themes/popups/dialog/bootstrap.scss +1 -0
  183. package/SCSS-Themes/popups/dialog/bootstrap4.scss +1 -0
  184. package/SCSS-Themes/popups/dialog/bootstrap5-dark.scss +1 -0
  185. package/SCSS-Themes/popups/dialog/bootstrap5.scss +1 -0
  186. package/SCSS-Themes/popups/dialog/fabric-dark.scss +1 -0
  187. package/SCSS-Themes/popups/dialog/fabric.scss +1 -0
  188. package/SCSS-Themes/popups/dialog/fluent-dark.scss +1 -0
  189. package/SCSS-Themes/popups/dialog/fluent.scss +1 -0
  190. package/SCSS-Themes/popups/dialog/fluent2-dark.scss +1 -0
  191. package/SCSS-Themes/popups/dialog/fluent2.scss +1 -0
  192. package/SCSS-Themes/popups/dialog/highcontrast.scss +1 -0
  193. package/SCSS-Themes/popups/dialog/material-dark.scss +1 -0
  194. package/SCSS-Themes/popups/dialog/material.scss +1 -0
  195. package/SCSS-Themes/popups/dialog/material3-dark.scss +1 -0
  196. package/SCSS-Themes/popups/dialog/material3.scss +1 -0
  197. package/SCSS-Themes/popups/dialog/tailwind-dark.scss +1 -0
  198. package/SCSS-Themes/popups/dialog/tailwind.scss +1 -0
  199. package/SCSS-Themes/tailwind-dark.scss +68 -7
  200. package/SCSS-Themes/tailwind.scss +68 -7
  201. package/package.json +1 -1
@@ -19879,14 +19879,14 @@ $signature-border-color: $border-light !default;
19879
19879
  $signature-background-color: $white !default;
19880
19880
 
19881
19881
  @include export-module('signature-layout') {
19882
- .e-signature {
19882
+ .e-signature.e-control {
19883
19883
  border: $signature-border;
19884
19884
  }
19885
19885
  }
19886
19886
 
19887
19887
 
19888
19888
  @include export-module('signature-theme') {
19889
- .e-signature {
19889
+ .e-signature.e-control {
19890
19890
  background-color: $signature-background-color;
19891
19891
  border: $signature-border;
19892
19892
  border-color: $signature-border-color;
@@ -20698,6 +20698,8 @@ $ddl-group-list-item-text-intent: 0 !default;
20698
20698
  min-height: $ddl-list-line-height;
20699
20699
  padding-left: $ddl-list-header-padding-left;
20700
20700
  padding-right: $ddl-list-padding-right;
20701
+ overflow: hidden;
20702
+ text-overflow: ellipsis;
20701
20703
  @if $skin-name == 'Material3' {
20702
20704
  background: $ddl-list-bg-color;
20703
20705
  }
@@ -44837,6 +44839,26 @@ $modal-datetime-wrapper-width: 100% !default;
44837
44839
  }
44838
44840
  }
44839
44841
 
44842
+ .e-datetime-mob-popup-wrap {
44843
+ align-items: center;
44844
+ display: flex;
44845
+ flex-direction: column;
44846
+ height: 100%;
44847
+ justify-content: center;
44848
+ left: 0;
44849
+ max-height: 100%;
44850
+ position: fixed;
44851
+ top: 0;
44852
+ width: 100%;
44853
+ z-index: 1002;
44854
+
44855
+ .e-datetimepicker.e-popup.e-lib.e-control.e-popup-open {
44856
+ left: 0 !important; /* stylelint-disable-line declaration-no-important */
44857
+ position: relative;
44858
+ top: 0 !important; /* stylelint-disable-line declaration-no-important */
44859
+ }
44860
+ }
44861
+
44840
44862
  #{&}.e-datetimepicker.e-time-modal {
44841
44863
  @if $skin-name != 'Material3' {
44842
44864
  background-color: $datetime-default-overlay;
@@ -47314,6 +47336,7 @@ $dialog-enable-resize-padding-bottom: 15px !default;
47314
47336
 
47315
47337
  .e-btn:hover.e-flat:not([DISABLED]) {
47316
47338
  background: $dialog-footer-flat-hover-btn-bg-color;
47339
+ color: $dialog-footer-flat-btn-bg-color;
47317
47340
  }
47318
47341
  }
47319
47342
  }
@@ -62700,6 +62723,7 @@ $ddl-close-icon-hover-color: $icon-color-hover !default;
62700
62723
  display: block;
62701
62724
  line-height: $ddl-select-all-height;
62702
62725
  overflow: hidden;
62726
+ text-overflow: ellipsis;
62703
62727
  padding-right: $ddl-list-padding-right;
62704
62728
  position: relative;
62705
62729
  text-indent: $ddl-check-right;
@@ -65946,6 +65970,12 @@ $listbox-ej2-filterselect-bigger-height: calc(100% - 106px) !default;
65946
65970
  }
65947
65971
  }
65948
65972
 
65973
+ .e-listbox-wrapper:not(.e-list-template) .e-list-parent li {
65974
+ overflow: hidden;
65975
+ white-space: nowrap;
65976
+ text-overflow: ellipsis;
65977
+ }
65978
+
65949
65979
 
65950
65980
  @mixin avatar {
65951
65981
  height: $listbox-template-avatar-size;
@@ -76892,6 +76922,12 @@ $pager-rtl-e-bigger-adaptive-constant-pagesizeall-top: 12px !default;
76892
76922
  color: $pager-icon-color;
76893
76923
  }
76894
76924
 
76925
+ div.e-icons.e-pager-default:not(.e-numericitem):hover {
76926
+ @if $pager-skin == 'fluent2' {
76927
+ color: $pager-hover-color;
76928
+ }
76929
+ }
76930
+
76895
76931
  div.e-icons.e-disable {
76896
76932
  color: $pager-numeric-txt-bg-color;
76897
76933
  }
@@ -77644,7 +77680,8 @@ $grid-xlfl-skin: $skin-name !default;
77644
77680
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
77645
77681
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
77646
77682
  @if $grid-xlfl-skin == 'fluent2' {
77647
- margin-top: -2px;
77683
+ margin-top: -3px;
77684
+ margin-right: 17px;
77648
77685
  }
77649
77686
  }
77650
77687
  }
@@ -78123,7 +78160,7 @@ $grid-group-right-arrow-icon-font-size: $text-sm !default;
78123
78160
  $grid-group-right-arrow-icon-padding: 10px 8px 12px 8px !default;
78124
78161
  $grid-group-unpgroupicon-padding-top: 4px !default;
78125
78162
  $grid-summary-cell-line-height: 20px !default;
78126
- $grid-batch-updated-bg-color: $success-light-alt !default;
78163
+ $grid-batch-updated-bg-color: $success-light !default;
78127
78164
  $grid-val-error-color: $danger !default;
78128
78165
  $grid-val-error-bg-color: $tooltip-bg-color !default;
78129
78166
  $grid-edit-input-padding-bottom: 1px !default;
@@ -78234,7 +78271,7 @@ $grid-freezeline-right-border: $primary-light !default;
78234
78271
  $grid-freezeline-border: 3px solid !default;
78235
78272
  $grid-edit-checkbox-bigger-padding-left: 8px !default;
78236
78273
  $grid-edit-checkbox-bigger-padding-top: 8px !default;
78237
- $grid-cell-focus-shadow: 0 0 0 1px $primary inset !default;
78274
+ $grid-cell-focus-shadow: 0 0 0 1px $border-alt inset !default;
78238
78275
  $grid-cell-focus-border-color: $primary !default;
78239
78276
  $grid-headercelldiv-fltricon-margin: -5px 20px -5px -5px !default;
78240
78277
  $grid-headercelldiv-rightalign-fltricon-margin: -5px 15px -5px 0 !default;
@@ -78312,6 +78349,7 @@ $grid-clone-prop-box-shadow: $shadow-md !default;
78312
78349
  $grid-drag-icon-opacity: .54 !default;
78313
78350
  $grid-clone-dropitemscount-border: $border-light !default;
78314
78351
  $grid-clone-dragdrop-bg-color: $content-bg-color-dragged !default;
78352
+ $grid-dragdrop-text-color: $content-text-color-dragged !default;
78315
78353
  $grid-group-clone-box-shadow: $shadow-08 !default;
78316
78354
  $grid-unboundcelldiv-margin: 0 4px !default;
78317
78355
  $grid-bigger-flmenu-padding: 16px 0 0 !default;
@@ -79208,6 +79246,7 @@ $grid-checkmark-color: $primary-text-color !default;
79208
79246
  }
79209
79247
 
79210
79248
  .e-dropitemscount {
79249
+ font-size: 14px;
79211
79250
  @if $grid-skin == 'tailwind' {
79212
79251
  margin-left: 1px;
79213
79252
  }
@@ -82478,7 +82517,7 @@ $grid-checkmark-color: $primary-text-color !default;
82478
82517
  }
82479
82518
 
82480
82519
  & .e-cloneproperties {
82481
- border-width: $grid-border-size $grid-border-size 3px;
82520
+ border-width: $grid-border-size $grid-border-size 2px;
82482
82521
  }
82483
82522
 
82484
82523
  & tr {
@@ -83265,6 +83304,9 @@ $grid-checkmark-color: $primary-text-color !default;
83265
83304
  @if $grid-skin == 'fluent2' {
83266
83305
  margin-top: -8px;
83267
83306
  }
83307
+ @if $grid-skin == 'bootstrap5.3' {
83308
+ margin-top: -9px;
83309
+ }
83268
83310
  }
83269
83311
 
83270
83312
  .e-reorderdownarrow {
@@ -83529,6 +83571,12 @@ $grid-checkmark-color: $primary-text-color !default;
83529
83571
  }
83530
83572
  }
83531
83573
 
83574
+ & .e-tbar-btn.e-icon-btn:hover {
83575
+ @if $grid-skin == 'fluent2' {
83576
+ background-color: $group-header-hover-bg-color;
83577
+ }
83578
+ }
83579
+
83532
83580
  .e-search-icon {
83533
83581
  background: none;
83534
83582
  }
@@ -84198,7 +84246,9 @@ $grid-checkmark-color: $primary-text-color !default;
84198
84246
  }
84199
84247
 
84200
84248
  & .e-menu-item.e-focused {
84201
- background-color: transparent;
84249
+ @if $grid-skin != 'bootstrap5.3' {
84250
+ background-color: transparent;
84251
+ }
84202
84252
  }
84203
84253
  }
84204
84254
  }
@@ -84577,6 +84627,11 @@ $grid-checkmark-color: $primary-text-color !default;
84577
84627
  .e-emptyrow {
84578
84628
  &:not(.e-editedbatchcell):not(.e-updatedtd) {
84579
84629
  color: $grid-rowcell-color;
84630
+ &.e-active {
84631
+ @if $grid-skin == 'fluent2' or $grid-skin == 'highcontrast' {
84632
+ color: $grid-row-selection-color;
84633
+ }
84634
+ }
84580
84635
  }
84581
84636
  }
84582
84637
 
@@ -84663,9 +84718,9 @@ $grid-checkmark-color: $primary-text-color !default;
84663
84718
 
84664
84719
  &.e-gridhover .e-frozenhover,
84665
84720
  &.e-gridhover .e-row tr:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
84666
- &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
84721
+ &.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
84667
84722
  &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse,
84668
- &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
84723
+ &.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
84669
84724
  &.e-rtl .e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
84670
84725
  &.e-gridhover .e-row.e-addedrow:not(.e-disable-gridhover):not(.e-detailrow):hover .e-dragindentcell,
84671
84726
  &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand {
@@ -84865,6 +84920,10 @@ $grid-checkmark-color: $primary-text-color !default;
84865
84920
  color: $grid-filtered-color;
84866
84921
  }
84867
84922
 
84923
+ .e-focused .e-filtered::before {
84924
+ color: $grid-hover-icon-color;
84925
+ }
84926
+
84868
84927
  .e-gridpopup {
84869
84928
  .e-content {
84870
84929
  background-color: $grid-popup-bg-color;
@@ -85087,6 +85146,9 @@ $grid-checkmark-color: $primary-text-color !default;
85087
85146
  padding-top: 6px;
85088
85147
  padding-bottom: 6px;
85089
85148
  }
85149
+ @if $grid-skin == 'fluent2' {
85150
+ color: $grid-dragdrop-text-color;
85151
+ }
85090
85152
 
85091
85153
  &.e-focused {
85092
85154
  box-shadow: none;
@@ -551,7 +551,8 @@ $grid-xlfl-skin: $skin-name !default;
551
551
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
552
552
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
553
553
  @if $grid-xlfl-skin == 'fluent2' {
554
- margin-top: -2px;
554
+ margin-top: -3px;
555
+ margin-right: 17px;
555
556
  }
556
557
  }
557
558
  }
@@ -551,7 +551,8 @@ $grid-xlfl-skin: $skin-name !default;
551
551
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
552
552
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
553
553
  @if $grid-xlfl-skin == 'fluent2' {
554
- margin-top: -2px;
554
+ margin-top: -3px;
555
+ margin-right: 17px;
555
556
  }
556
557
  }
557
558
  }
@@ -541,7 +541,8 @@ $grid-xlfl-skin: 'bootstrap' !default;
541
541
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
542
542
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
543
543
  @if $grid-xlfl-skin == 'fluent2' {
544
- margin-top: -2px;
544
+ margin-top: -3px;
545
+ margin-right: 17px;
545
546
  }
546
547
  }
547
548
  }
@@ -546,7 +546,8 @@ $grid-xlfl-skin: 'bootstrap' !default;
546
546
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
547
547
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
548
548
  @if $grid-xlfl-skin == 'fluent2' {
549
- margin-top: -2px;
549
+ margin-top: -3px;
550
+ margin-right: 17px;
550
551
  }
551
552
  }
552
553
  }
@@ -551,7 +551,8 @@ $grid-xlfl-skin: 'bootstrap4' !default;
551
551
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
552
552
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
553
553
  @if $grid-xlfl-skin == 'fluent2' {
554
- margin-top: -2px;
554
+ margin-top: -3px;
555
+ margin-right: 17px;
555
556
  }
556
557
  }
557
558
  }
@@ -552,7 +552,8 @@ $grid-xlfl-skin: 'bootstrap5' !default;
552
552
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
553
553
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
554
554
  @if $grid-xlfl-skin == 'fluent2' {
555
- margin-top: -2px;
555
+ margin-top: -3px;
556
+ margin-right: 17px;
556
557
  }
557
558
  }
558
559
  }
@@ -552,7 +552,8 @@ $grid-xlfl-skin: 'bootstrap5' !default;
552
552
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
553
553
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
554
554
  @if $grid-xlfl-skin == 'fluent2' {
555
- margin-top: -2px;
555
+ margin-top: -3px;
556
+ margin-right: 17px;
556
557
  }
557
558
  }
558
559
  }
@@ -541,7 +541,8 @@ $grid-xlfl-skin: 'fabric' !default;
541
541
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
542
542
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
543
543
  @if $grid-xlfl-skin == 'fluent2' {
544
- margin-top: -2px;
544
+ margin-top: -3px;
545
+ margin-right: 17px;
545
546
  }
546
547
  }
547
548
  }
@@ -546,7 +546,8 @@ $grid-xlfl-skin: 'fabric' !default;
546
546
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
547
547
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
548
548
  @if $grid-xlfl-skin == 'fluent2' {
549
- margin-top: -2px;
549
+ margin-top: -3px;
550
+ margin-right: 17px;
550
551
  }
551
552
  }
552
553
  }
@@ -552,7 +552,8 @@ $grid-xlfl-skin: 'fluent' !default;
552
552
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
553
553
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
554
554
  @if $grid-xlfl-skin == 'fluent2' {
555
- margin-top: -2px;
555
+ margin-top: -3px;
556
+ margin-right: 17px;
556
557
  }
557
558
  }
558
559
  }
@@ -552,7 +552,8 @@ $grid-xlfl-skin: 'fluent' !default;
552
552
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
553
553
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
554
554
  @if $grid-xlfl-skin == 'fluent2' {
555
- margin-top: -2px;
555
+ margin-top: -3px;
556
+ margin-right: 17px;
556
557
  }
557
558
  }
558
559
  }
@@ -551,7 +551,8 @@ $grid-xlfl-skin: $skin-name !default;
551
551
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
552
552
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
553
553
  @if $grid-xlfl-skin == 'fluent2' {
554
- margin-top: -2px;
554
+ margin-top: -3px;
555
+ margin-right: 17px;
555
556
  }
556
557
  }
557
558
  }
@@ -551,7 +551,8 @@ $grid-xlfl-skin: $skin-name !default;
551
551
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
552
552
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
553
553
  @if $grid-xlfl-skin == 'fluent2' {
554
- margin-top: -2px;
554
+ margin-top: -3px;
555
+ margin-right: 17px;
555
556
  }
556
557
  }
557
558
  }
@@ -541,7 +541,8 @@ $grid-xlfl-skin: 'highcontrast' !default;
541
541
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
542
542
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
543
543
  @if $grid-xlfl-skin == 'fluent2' {
544
- margin-top: -2px;
544
+ margin-top: -3px;
545
+ margin-right: 17px;
545
546
  }
546
547
  }
547
548
  }
@@ -543,7 +543,8 @@ $grid-xlfl-skin: 'material' !default;
543
543
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
544
544
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
545
545
  @if $grid-xlfl-skin == 'fluent2' {
546
- margin-top: -2px;
546
+ margin-top: -3px;
547
+ margin-right: 17px;
547
548
  }
548
549
  }
549
550
  }
@@ -544,7 +544,8 @@ $grid-xlfl-skin: 'material' !default;
544
544
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
545
545
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
546
546
  @if $grid-xlfl-skin == 'fluent2' {
547
- margin-top: -2px;
547
+ margin-top: -3px;
548
+ margin-right: 17px;
548
549
  }
549
550
  }
550
551
  }
@@ -552,7 +552,8 @@ $grid-xlfl-skin: 'material3' !default;
552
552
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
553
553
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
554
554
  @if $grid-xlfl-skin == 'fluent2' {
555
- margin-top: -2px;
555
+ margin-top: -3px;
556
+ margin-right: 17px;
556
557
  }
557
558
  }
558
559
  }
@@ -552,7 +552,8 @@ $grid-xlfl-skin: 'material3' !default;
552
552
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
553
553
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
554
554
  @if $grid-xlfl-skin == 'fluent2' {
555
- margin-top: -2px;
555
+ margin-top: -3px;
556
+ margin-right: 17px;
556
557
  }
557
558
  }
558
559
  }
@@ -551,7 +551,8 @@ $grid-xlfl-skin: 'tailwind' !default;
551
551
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
552
552
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
553
553
  @if $grid-xlfl-skin == 'fluent2' {
554
- margin-top: -2px;
554
+ margin-top: -3px;
555
+ margin-right: 17px;
555
556
  }
556
557
  }
557
558
  }
@@ -551,7 +551,8 @@ $grid-xlfl-skin: 'tailwind' !default;
551
551
  @include height-styles($grid-xlfl-li-height, $grid-xlfl-li-height);
552
552
  margin-right: $grid-xlfl-li-icon-margin-arrow-icon;
553
553
  @if $grid-xlfl-skin == 'fluent2' {
554
- margin-top: -2px;
554
+ margin-top: -3px;
555
+ margin-right: 17px;
555
556
  }
556
557
  }
557
558
  }
@@ -1400,6 +1400,7 @@ $grid-checkmark-color: $primary !default;
1400
1400
  }
1401
1401
 
1402
1402
  .e-dropitemscount {
1403
+ font-size: 14px;
1403
1404
  @if $grid-skin == 'tailwind' {
1404
1405
  margin-left: 1px;
1405
1406
  }
@@ -4670,7 +4671,7 @@ $grid-checkmark-color: $primary !default;
4670
4671
  }
4671
4672
 
4672
4673
  & .e-cloneproperties {
4673
- border-width: $grid-border-size $grid-border-size 3px;
4674
+ border-width: $grid-border-size $grid-border-size 2px;
4674
4675
  }
4675
4676
 
4676
4677
  & tr {
@@ -5457,6 +5458,9 @@ $grid-checkmark-color: $primary !default;
5457
5458
  @if $grid-skin == 'fluent2' {
5458
5459
  margin-top: -8px;
5459
5460
  }
5461
+ @if $grid-skin == 'bootstrap5.3' {
5462
+ margin-top: -9px;
5463
+ }
5460
5464
  }
5461
5465
 
5462
5466
  .e-reorderdownarrow {
@@ -5721,6 +5725,12 @@ $grid-checkmark-color: $primary !default;
5721
5725
  }
5722
5726
  }
5723
5727
 
5728
+ & .e-tbar-btn.e-icon-btn:hover {
5729
+ @if $grid-skin == 'fluent2' {
5730
+ background-color: $group-header-hover-bg-color;
5731
+ }
5732
+ }
5733
+
5724
5734
  .e-search-icon {
5725
5735
  background: none;
5726
5736
  }
@@ -6390,7 +6400,9 @@ $grid-checkmark-color: $primary !default;
6390
6400
  }
6391
6401
 
6392
6402
  & .e-menu-item.e-focused {
6393
- background-color: transparent;
6403
+ @if $grid-skin != 'bootstrap5.3' {
6404
+ background-color: transparent;
6405
+ }
6394
6406
  }
6395
6407
  }
6396
6408
  }
@@ -6769,6 +6781,11 @@ $grid-checkmark-color: $primary !default;
6769
6781
  .e-emptyrow {
6770
6782
  &:not(.e-editedbatchcell):not(.e-updatedtd) {
6771
6783
  color: $grid-rowcell-color;
6784
+ &.e-active {
6785
+ @if $grid-skin == 'fluent2' or $grid-skin == 'highcontrast' {
6786
+ color: $grid-row-selection-color;
6787
+ }
6788
+ }
6772
6789
  }
6773
6790
  }
6774
6791
 
@@ -6855,9 +6872,9 @@ $grid-checkmark-color: $primary !default;
6855
6872
 
6856
6873
  &.e-gridhover .e-frozenhover,
6857
6874
  &.e-gridhover .e-row tr:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
6858
- &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
6875
+ &.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
6859
6876
  &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse,
6860
- &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
6877
+ &.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
6861
6878
  &.e-rtl .e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
6862
6879
  &.e-gridhover .e-row.e-addedrow:not(.e-disable-gridhover):not(.e-detailrow):hover .e-dragindentcell,
6863
6880
  &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand {
@@ -7057,6 +7074,10 @@ $grid-checkmark-color: $primary !default;
7057
7074
  color: $grid-filtered-color;
7058
7075
  }
7059
7076
 
7077
+ .e-focused .e-filtered::before {
7078
+ color: $grid-hover-icon-color;
7079
+ }
7080
+
7060
7081
  .e-gridpopup {
7061
7082
  .e-content {
7062
7083
  background-color: $grid-popup-bg-color;
@@ -7279,6 +7300,9 @@ $grid-checkmark-color: $primary !default;
7279
7300
  padding-top: 6px;
7280
7301
  padding-bottom: 6px;
7281
7302
  }
7303
+ @if $grid-skin == 'fluent2' {
7304
+ color: $grid-dragdrop-text-color;
7305
+ }
7282
7306
 
7283
7307
  &.e-focused {
7284
7308
  box-shadow: none;
@@ -1400,6 +1400,7 @@ $grid-checkmark-color: $primary !default;
1400
1400
  }
1401
1401
 
1402
1402
  .e-dropitemscount {
1403
+ font-size: 14px;
1403
1404
  @if $grid-skin == 'tailwind' {
1404
1405
  margin-left: 1px;
1405
1406
  }
@@ -4670,7 +4671,7 @@ $grid-checkmark-color: $primary !default;
4670
4671
  }
4671
4672
 
4672
4673
  & .e-cloneproperties {
4673
- border-width: $grid-border-size $grid-border-size 3px;
4674
+ border-width: $grid-border-size $grid-border-size 2px;
4674
4675
  }
4675
4676
 
4676
4677
  & tr {
@@ -5457,6 +5458,9 @@ $grid-checkmark-color: $primary !default;
5457
5458
  @if $grid-skin == 'fluent2' {
5458
5459
  margin-top: -8px;
5459
5460
  }
5461
+ @if $grid-skin == 'bootstrap5.3' {
5462
+ margin-top: -9px;
5463
+ }
5460
5464
  }
5461
5465
 
5462
5466
  .e-reorderdownarrow {
@@ -5721,6 +5725,12 @@ $grid-checkmark-color: $primary !default;
5721
5725
  }
5722
5726
  }
5723
5727
 
5728
+ & .e-tbar-btn.e-icon-btn:hover {
5729
+ @if $grid-skin == 'fluent2' {
5730
+ background-color: $group-header-hover-bg-color;
5731
+ }
5732
+ }
5733
+
5724
5734
  .e-search-icon {
5725
5735
  background: none;
5726
5736
  }
@@ -6390,7 +6400,9 @@ $grid-checkmark-color: $primary !default;
6390
6400
  }
6391
6401
 
6392
6402
  & .e-menu-item.e-focused {
6393
- background-color: transparent;
6403
+ @if $grid-skin != 'bootstrap5.3' {
6404
+ background-color: transparent;
6405
+ }
6394
6406
  }
6395
6407
  }
6396
6408
  }
@@ -6769,6 +6781,11 @@ $grid-checkmark-color: $primary !default;
6769
6781
  .e-emptyrow {
6770
6782
  &:not(.e-editedbatchcell):not(.e-updatedtd) {
6771
6783
  color: $grid-rowcell-color;
6784
+ &.e-active {
6785
+ @if $grid-skin == 'fluent2' or $grid-skin == 'highcontrast' {
6786
+ color: $grid-row-selection-color;
6787
+ }
6788
+ }
6772
6789
  }
6773
6790
  }
6774
6791
 
@@ -6855,9 +6872,9 @@ $grid-checkmark-color: $primary !default;
6855
6872
 
6856
6873
  &.e-gridhover .e-frozenhover,
6857
6874
  &.e-gridhover .e-row tr:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
6858
- &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
6875
+ &.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell,
6859
6876
  &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse,
6860
- &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
6877
+ &.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
6861
6878
  &.e-rtl .e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop,
6862
6879
  &.e-gridhover .e-row.e-addedrow:not(.e-disable-gridhover):not(.e-detailrow):hover .e-dragindentcell,
6863
6880
  &.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand {
@@ -7057,6 +7074,10 @@ $grid-checkmark-color: $primary !default;
7057
7074
  color: $grid-filtered-color;
7058
7075
  }
7059
7076
 
7077
+ .e-focused .e-filtered::before {
7078
+ color: $grid-hover-icon-color;
7079
+ }
7080
+
7060
7081
  .e-gridpopup {
7061
7082
  .e-content {
7062
7083
  background-color: $grid-popup-bg-color;
@@ -7279,6 +7300,9 @@ $grid-checkmark-color: $primary !default;
7279
7300
  padding-top: 6px;
7280
7301
  padding-bottom: 6px;
7281
7302
  }
7303
+ @if $grid-skin == 'fluent2' {
7304
+ color: $grid-dragdrop-text-color;
7305
+ }
7282
7306
 
7283
7307
  &.e-focused {
7284
7308
  box-shadow: none;