@syncfusion/blazor-themes 27.1.48 → 27.1.50

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 (169) hide show
  1. package/SCSS-Themes/bds-dark.scss +103 -87
  2. package/SCSS-Themes/bds.scss +103 -87
  3. package/SCSS-Themes/bootstrap-dark.scss +103 -87
  4. package/SCSS-Themes/bootstrap.scss +103 -87
  5. package/SCSS-Themes/bootstrap4.scss +103 -87
  6. package/SCSS-Themes/bootstrap5-dark.scss +103 -87
  7. package/SCSS-Themes/bootstrap5.3.scss +103 -87
  8. package/SCSS-Themes/bootstrap5.scss +103 -87
  9. package/SCSS-Themes/buttons/check-box/bds-dark.scss +7 -0
  10. package/SCSS-Themes/buttons/check-box/bds.scss +7 -0
  11. package/SCSS-Themes/buttons/check-box/bootstrap-dark.scss +7 -0
  12. package/SCSS-Themes/buttons/check-box/bootstrap.scss +7 -0
  13. package/SCSS-Themes/buttons/check-box/bootstrap4.scss +7 -0
  14. package/SCSS-Themes/buttons/check-box/bootstrap5-dark.scss +7 -0
  15. package/SCSS-Themes/buttons/check-box/bootstrap5.3.scss +7 -0
  16. package/SCSS-Themes/buttons/check-box/bootstrap5.scss +7 -0
  17. package/SCSS-Themes/buttons/check-box/fabric-dark.scss +7 -0
  18. package/SCSS-Themes/buttons/check-box/fabric.scss +7 -0
  19. package/SCSS-Themes/buttons/check-box/fluent-dark.scss +7 -0
  20. package/SCSS-Themes/buttons/check-box/fluent.scss +7 -0
  21. package/SCSS-Themes/buttons/check-box/fluent2-dark.scss +7 -0
  22. package/SCSS-Themes/buttons/check-box/fluent2.scss +7 -0
  23. package/SCSS-Themes/buttons/check-box/highcontrast.scss +7 -0
  24. package/SCSS-Themes/buttons/check-box/material-dark.scss +7 -0
  25. package/SCSS-Themes/buttons/check-box/material.scss +7 -0
  26. package/SCSS-Themes/buttons/check-box/material3-dark.scss +7 -0
  27. package/SCSS-Themes/buttons/check-box/material3.scss +7 -0
  28. package/SCSS-Themes/buttons/check-box/tailwind-dark.scss +7 -0
  29. package/SCSS-Themes/buttons/check-box/tailwind.scss +7 -0
  30. package/SCSS-Themes/dropdowns/drop-down-list/bds-dark.scss +1 -3
  31. package/SCSS-Themes/dropdowns/drop-down-list/bds.scss +1 -3
  32. package/SCSS-Themes/dropdowns/drop-down-list/bootstrap-dark.scss +1 -3
  33. package/SCSS-Themes/dropdowns/drop-down-list/bootstrap.scss +1 -3
  34. package/SCSS-Themes/dropdowns/drop-down-list/bootstrap4.scss +1 -3
  35. package/SCSS-Themes/dropdowns/drop-down-list/bootstrap5-dark.scss +1 -3
  36. package/SCSS-Themes/dropdowns/drop-down-list/bootstrap5.3.scss +1 -3
  37. package/SCSS-Themes/dropdowns/drop-down-list/bootstrap5.scss +1 -3
  38. package/SCSS-Themes/dropdowns/drop-down-list/fabric-dark.scss +1 -3
  39. package/SCSS-Themes/dropdowns/drop-down-list/fabric.scss +1 -3
  40. package/SCSS-Themes/dropdowns/drop-down-list/fluent-dark.scss +1 -3
  41. package/SCSS-Themes/dropdowns/drop-down-list/fluent.scss +1 -3
  42. package/SCSS-Themes/dropdowns/drop-down-list/fluent2-dark.scss +1 -3
  43. package/SCSS-Themes/dropdowns/drop-down-list/fluent2.scss +1 -3
  44. package/SCSS-Themes/dropdowns/drop-down-list/highcontrast.scss +1 -3
  45. package/SCSS-Themes/dropdowns/drop-down-list/material-dark.scss +1 -3
  46. package/SCSS-Themes/dropdowns/drop-down-list/material.scss +1 -3
  47. package/SCSS-Themes/dropdowns/drop-down-list/material3-dark.scss +1 -3
  48. package/SCSS-Themes/dropdowns/drop-down-list/material3.scss +1 -3
  49. package/SCSS-Themes/dropdowns/drop-down-list/tailwind-dark.scss +1 -3
  50. package/SCSS-Themes/dropdowns/drop-down-list/tailwind.scss +1 -3
  51. package/SCSS-Themes/dropdowns/list-box/bds-dark.scss +1 -0
  52. package/SCSS-Themes/dropdowns/list-box/bds.scss +1 -0
  53. package/SCSS-Themes/dropdowns/list-box/bootstrap-dark.scss +1 -0
  54. package/SCSS-Themes/dropdowns/list-box/bootstrap.scss +1 -0
  55. package/SCSS-Themes/dropdowns/list-box/bootstrap4.scss +1 -0
  56. package/SCSS-Themes/dropdowns/list-box/bootstrap5-dark.scss +1 -0
  57. package/SCSS-Themes/dropdowns/list-box/bootstrap5.3.scss +1 -0
  58. package/SCSS-Themes/dropdowns/list-box/bootstrap5.scss +1 -0
  59. package/SCSS-Themes/dropdowns/list-box/fabric-dark.scss +1 -0
  60. package/SCSS-Themes/dropdowns/list-box/fabric.scss +1 -0
  61. package/SCSS-Themes/dropdowns/list-box/fluent-dark.scss +1 -0
  62. package/SCSS-Themes/dropdowns/list-box/fluent.scss +1 -0
  63. package/SCSS-Themes/dropdowns/list-box/fluent2-dark.scss +1 -0
  64. package/SCSS-Themes/dropdowns/list-box/fluent2.scss +1 -0
  65. package/SCSS-Themes/dropdowns/list-box/highcontrast.scss +1 -0
  66. package/SCSS-Themes/dropdowns/list-box/material-dark.scss +1 -0
  67. package/SCSS-Themes/dropdowns/list-box/material.scss +1 -0
  68. package/SCSS-Themes/dropdowns/list-box/material3-dark.scss +1 -0
  69. package/SCSS-Themes/dropdowns/list-box/material3.scss +1 -0
  70. package/SCSS-Themes/dropdowns/list-box/tailwind-dark.scss +1 -0
  71. package/SCSS-Themes/dropdowns/list-box/tailwind.scss +1 -0
  72. package/SCSS-Themes/fabric-dark.scss +103 -87
  73. package/SCSS-Themes/fabric.scss +103 -87
  74. package/SCSS-Themes/fluent-dark.scss +104 -88
  75. package/SCSS-Themes/fluent.scss +104 -88
  76. package/SCSS-Themes/fluent2-dark.scss +104 -88
  77. package/SCSS-Themes/fluent2.scss +104 -88
  78. package/SCSS-Themes/grids/grid/bds-dark.scss +52 -41
  79. package/SCSS-Themes/grids/grid/bds.scss +52 -41
  80. package/SCSS-Themes/grids/grid/bootstrap-dark.scss +52 -41
  81. package/SCSS-Themes/grids/grid/bootstrap.scss +52 -41
  82. package/SCSS-Themes/grids/grid/bootstrap4.scss +52 -41
  83. package/SCSS-Themes/grids/grid/bootstrap5-dark.scss +52 -41
  84. package/SCSS-Themes/grids/grid/bootstrap5.3.scss +52 -41
  85. package/SCSS-Themes/grids/grid/bootstrap5.scss +52 -41
  86. package/SCSS-Themes/grids/grid/fabric-dark.scss +52 -41
  87. package/SCSS-Themes/grids/grid/fabric.scss +52 -41
  88. package/SCSS-Themes/grids/grid/fluent-dark.scss +53 -42
  89. package/SCSS-Themes/grids/grid/fluent.scss +53 -42
  90. package/SCSS-Themes/grids/grid/fluent2-dark.scss +53 -42
  91. package/SCSS-Themes/grids/grid/fluent2.scss +53 -42
  92. package/SCSS-Themes/grids/grid/highcontrast.scss +52 -41
  93. package/SCSS-Themes/grids/grid/material-dark.scss +52 -41
  94. package/SCSS-Themes/grids/grid/material.scss +52 -41
  95. package/SCSS-Themes/grids/grid/material3-dark.scss +52 -41
  96. package/SCSS-Themes/grids/grid/material3.scss +52 -41
  97. package/SCSS-Themes/grids/grid/tailwind-dark.scss +52 -41
  98. package/SCSS-Themes/grids/grid/tailwind.scss +52 -41
  99. package/SCSS-Themes/highcontrast.scss +103 -87
  100. package/SCSS-Themes/inputs/color-picker/bds-dark.scss +1 -1
  101. package/SCSS-Themes/inputs/color-picker/bds.scss +1 -1
  102. package/SCSS-Themes/inputs/color-picker/bootstrap-dark.scss +1 -1
  103. package/SCSS-Themes/inputs/color-picker/bootstrap.scss +1 -1
  104. package/SCSS-Themes/inputs/color-picker/bootstrap4.scss +1 -1
  105. package/SCSS-Themes/inputs/color-picker/bootstrap5-dark.scss +1 -1
  106. package/SCSS-Themes/inputs/color-picker/bootstrap5.3.scss +1 -1
  107. package/SCSS-Themes/inputs/color-picker/bootstrap5.scss +1 -1
  108. package/SCSS-Themes/inputs/color-picker/fabric-dark.scss +1 -1
  109. package/SCSS-Themes/inputs/color-picker/fabric.scss +1 -1
  110. package/SCSS-Themes/inputs/color-picker/fluent-dark.scss +1 -1
  111. package/SCSS-Themes/inputs/color-picker/fluent.scss +1 -1
  112. package/SCSS-Themes/inputs/color-picker/fluent2-dark.scss +1 -1
  113. package/SCSS-Themes/inputs/color-picker/fluent2.scss +1 -1
  114. package/SCSS-Themes/inputs/color-picker/highcontrast.scss +1 -1
  115. package/SCSS-Themes/inputs/color-picker/material-dark.scss +1 -1
  116. package/SCSS-Themes/inputs/color-picker/material.scss +1 -1
  117. package/SCSS-Themes/inputs/color-picker/material3-dark.scss +1 -1
  118. package/SCSS-Themes/inputs/color-picker/material3.scss +1 -1
  119. package/SCSS-Themes/inputs/color-picker/tailwind-dark.scss +1 -1
  120. package/SCSS-Themes/inputs/color-picker/tailwind.scss +1 -1
  121. package/SCSS-Themes/material-dark.scss +103 -87
  122. package/SCSS-Themes/material.scss +103 -87
  123. package/SCSS-Themes/material3-dark.scss +103 -87
  124. package/SCSS-Themes/material3.scss +103 -87
  125. package/SCSS-Themes/popups/dialog/bds-dark.scss +0 -35
  126. package/SCSS-Themes/popups/dialog/bds.scss +0 -35
  127. package/SCSS-Themes/popups/dialog/bootstrap-dark.scss +0 -35
  128. package/SCSS-Themes/popups/dialog/bootstrap.scss +0 -35
  129. package/SCSS-Themes/popups/dialog/bootstrap4.scss +0 -35
  130. package/SCSS-Themes/popups/dialog/bootstrap5-dark.scss +0 -35
  131. package/SCSS-Themes/popups/dialog/bootstrap5.3.scss +0 -35
  132. package/SCSS-Themes/popups/dialog/bootstrap5.scss +0 -35
  133. package/SCSS-Themes/popups/dialog/fabric-dark.scss +0 -35
  134. package/SCSS-Themes/popups/dialog/fabric.scss +0 -35
  135. package/SCSS-Themes/popups/dialog/fluent-dark.scss +0 -35
  136. package/SCSS-Themes/popups/dialog/fluent.scss +0 -35
  137. package/SCSS-Themes/popups/dialog/fluent2-dark.scss +0 -35
  138. package/SCSS-Themes/popups/dialog/fluent2.scss +0 -35
  139. package/SCSS-Themes/popups/dialog/highcontrast.scss +0 -35
  140. package/SCSS-Themes/popups/dialog/material-dark.scss +0 -35
  141. package/SCSS-Themes/popups/dialog/material.scss +0 -35
  142. package/SCSS-Themes/popups/dialog/material3-dark.scss +0 -35
  143. package/SCSS-Themes/popups/dialog/material3.scss +0 -35
  144. package/SCSS-Themes/popups/dialog/tailwind-dark.scss +0 -35
  145. package/SCSS-Themes/popups/dialog/tailwind.scss +0 -35
  146. package/SCSS-Themes/richtexteditor/rich-text-editor/bds-dark.scss +41 -7
  147. package/SCSS-Themes/richtexteditor/rich-text-editor/bds.scss +41 -7
  148. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap-dark.scss +41 -7
  149. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap.scss +41 -7
  150. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap4.scss +41 -7
  151. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap5-dark.scss +41 -7
  152. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap5.3.scss +41 -7
  153. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap5.scss +41 -7
  154. package/SCSS-Themes/richtexteditor/rich-text-editor/fabric-dark.scss +41 -7
  155. package/SCSS-Themes/richtexteditor/rich-text-editor/fabric.scss +41 -7
  156. package/SCSS-Themes/richtexteditor/rich-text-editor/fluent-dark.scss +41 -7
  157. package/SCSS-Themes/richtexteditor/rich-text-editor/fluent.scss +41 -7
  158. package/SCSS-Themes/richtexteditor/rich-text-editor/fluent2-dark.scss +41 -7
  159. package/SCSS-Themes/richtexteditor/rich-text-editor/fluent2.scss +41 -7
  160. package/SCSS-Themes/richtexteditor/rich-text-editor/highcontrast.scss +41 -7
  161. package/SCSS-Themes/richtexteditor/rich-text-editor/material-dark.scss +41 -7
  162. package/SCSS-Themes/richtexteditor/rich-text-editor/material.scss +41 -7
  163. package/SCSS-Themes/richtexteditor/rich-text-editor/material3-dark.scss +41 -7
  164. package/SCSS-Themes/richtexteditor/rich-text-editor/material3.scss +41 -7
  165. package/SCSS-Themes/richtexteditor/rich-text-editor/tailwind-dark.scss +41 -7
  166. package/SCSS-Themes/richtexteditor/rich-text-editor/tailwind.scss +41 -7
  167. package/SCSS-Themes/tailwind-dark.scss +103 -87
  168. package/SCSS-Themes/tailwind.scss +103 -87
  169. package/package.json +1 -1
@@ -1881,28 +1881,18 @@ $grid-checkmark-color: $accent-font !default;
1881
1881
  }
1882
1882
 
1883
1883
  .e-bigger &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
1884
- &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground,
1885
- .e-bigger &.e-rtl td.e-rowcell.e-cellselectionbackground,
1886
- &.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1884
+ &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1887
1885
  @if $grid-skin == 'material3' {
1888
1886
  border: 1px solid rgba($content-text-color);
1889
1887
  }
1890
1888
  }
1891
1889
 
1892
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1893
- .e-bigger & td.e-cellselectionbackground,
1894
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1895
- &.e-bigger td.e-cellselectionbackground {
1890
+ .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
1891
+ &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
1896
1892
  @if $grid-skin == 'material3' {
1897
- padding-bottom: 13px;
1898
- @include grid-padding-left-right(11.5px, 11.5px);
1899
- }
1900
- }
1901
-
1902
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1903
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
1904
- @if $grid-skin == 'material3' {
1905
- padding-top: 13px;
1893
+ padding-top: 0;
1894
+ padding-bottom: 0;
1895
+ @include grid-padding-left-right(12px, 12px);
1906
1896
  }
1907
1897
  }
1908
1898
 
@@ -2542,6 +2532,9 @@ $grid-checkmark-color: $accent-font !default;
2542
2532
 
2543
2533
  & .e-res-apply-btn:disabled {
2544
2534
  color: $grid-btn-disabled-bgcolor;
2535
+ @if $grid-skin == 'fluent2' {
2536
+ color: $primary-text-disabled;
2537
+ }
2545
2538
  }
2546
2539
  & .e-btn {
2547
2540
  @if $grid-skin != 'fluent2' {
@@ -3640,6 +3633,18 @@ $grid-checkmark-color: $accent-font !default;
3640
3633
  }
3641
3634
  }
3642
3635
 
3636
+ &:not(.sf-grid) .e-res-toolbar .e-toolbar-items .e-search-wrapper {
3637
+ & .e-search-icon {
3638
+ padding: $grid-res-toolbar-search-wrapper-icon-padding;
3639
+ @if $grid-skin == 'bootstrap5.3' {
3640
+ padding: 9px 8px;
3641
+ }
3642
+ @if $grid-skin == 'bootstrap4' {
3643
+ padding: 9px 9.5px;
3644
+ }
3645
+ }
3646
+ }
3647
+
3643
3648
  .e-res-toolbar {
3644
3649
  border-bottom: 1px solid;
3645
3650
  border-bottom-color: $grid-header-border-color;
@@ -3740,18 +3745,6 @@ $grid-checkmark-color: $accent-font !default;
3740
3745
  }
3741
3746
  }
3742
3747
 
3743
- &:not(.sf-grid).e-search-wrapper {
3744
- & .e-search-icon {
3745
- padding: $grid-res-toolbar-search-wrapper-icon-padding;
3746
- @if $grid-skin == 'bootstrap5.3' {
3747
- padding: 9px 8px;
3748
- }
3749
- @if $grid-skin == 'bootstrap4' {
3750
- padding: 9px 9.5px;
3751
- }
3752
- }
3753
- }
3754
-
3755
3748
  & .e-responsive-right {
3756
3749
  & .e-search-wrapper {
3757
3750
  padding-left: 0;
@@ -3948,8 +3941,11 @@ $grid-checkmark-color: $accent-font !default;
3948
3941
  }
3949
3942
  }
3950
3943
 
3951
- &.e-default .e-grouptopleftcell {
3952
- border-top: $grid-grouptopleftcell-border-top;
3944
+ &.e-default {
3945
+ .e-grouptopleftcell,
3946
+ .e-rowdragheader {
3947
+ border-top: $grid-grouptopleftcell-border-top;
3948
+ }
3953
3949
  }
3954
3950
 
3955
3951
  &.e-default .e-gridheader .e-headercell.e-firstheader,
@@ -3957,10 +3953,13 @@ $grid-checkmark-color: $accent-font !default;
3957
3953
  border-left: 1px solid;
3958
3954
  }
3959
3955
 
3960
- &.e-default.e-verticallines .e-grouptopleftcell,
3961
- &.e-default.e-bothlines .e-grouptopleftcell,
3962
- &.e-default.e-hidelines .e-grouptopleftcell {
3963
- border-top-width: 0;
3956
+ &.e-default.e-verticallines,
3957
+ &.e-default.e-bothlines,
3958
+ &.e-default.e-hidelines {
3959
+ .e-grouptopleftcell,
3960
+ .e-rowdragheader {
3961
+ border-top-width: 0;
3962
+ }
3964
3963
  }
3965
3964
 
3966
3965
  &.e-default.e-verticallines,
@@ -4221,6 +4220,12 @@ $grid-checkmark-color: $accent-font !default;
4221
4220
  width: auto;
4222
4221
  }
4223
4222
 
4223
+ .e-rowcell.e-gridchkbox {
4224
+ @if $grid-skin == 'fluent' {
4225
+ padding-left: 8px;
4226
+ }
4227
+ }
4228
+
4224
4229
  &.e-left-shadow,
4225
4230
  &.e-rtl.e-left-shadow,
4226
4231
  &.e-rtl.e-default.e-left-shadow,
@@ -5164,13 +5169,12 @@ $grid-checkmark-color: $accent-font !default;
5164
5169
  font-weight: $grid-selection-font-weight;
5165
5170
  }
5166
5171
 
5167
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
5172
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
5168
5173
  td.e-cellselectionbackground {
5169
5174
  font-weight: $grid-selection-font-weight;
5170
5175
  @if $grid-skin == 'material3' {
5171
- border: 1px solid rgba($content-text-color);
5172
5176
  padding-bottom: 7px;
5173
- @include grid-padding-left-right(7.5px, 7.5px);
5177
+ @include grid-padding-left-right(8px, 8px);
5174
5178
  }
5175
5179
  }
5176
5180
 
@@ -5181,14 +5185,13 @@ $grid-checkmark-color: $accent-font !default;
5181
5185
  }
5182
5186
 
5183
5187
  &.e-bothlines td.e-rowcell.e-cellselectionbackground,
5184
- &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
5185
- &.e-rtl td.e-rowcell.e-cellselectionbackground {
5188
+ &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground {
5186
5189
  @if $grid-skin == 'material3' {
5187
5190
  border: 1px solid rgba($content-text-color);
5188
5191
  }
5189
5192
  }
5190
5193
 
5191
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
5194
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
5192
5195
  @if $grid-skin == 'material3' {
5193
5196
  padding-top: 7px;
5194
5197
  }
@@ -6268,7 +6271,8 @@ $grid-checkmark-color: $accent-font !default;
6268
6271
  }
6269
6272
 
6270
6273
  &.e-wrap {
6271
- & .e-rowcell,
6274
+ & .e-gridheader .e-rowcell,
6275
+ & .e-gridcontent .e-rowcell,
6272
6276
  & .e-columnheader .e-stackedheadercelldiv,
6273
6277
  & .e-columnheader .e-headercelldiv,
6274
6278
  & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
@@ -6281,6 +6285,10 @@ $grid-checkmark-color: $accent-font !default;
6281
6285
  max-height: $grid-rowcell-wrap-max-height;
6282
6286
  }
6283
6287
  }
6288
+
6289
+ & .e-checkbox-wrapper {
6290
+ vertical-align: middle;
6291
+ }
6284
6292
  }
6285
6293
 
6286
6294
  &.e-wrap .e-columnheader {
@@ -6453,6 +6461,7 @@ $grid-checkmark-color: $accent-font !default;
6453
6461
  }
6454
6462
 
6455
6463
  &.sf-grid {
6464
+
6456
6465
  span.e-ungroupbutton.e-icons {
6457
6466
  margin-left: $grid-group-ungroupicon-margin-left;
6458
6467
  @if $grid-skin == 'material3' {
@@ -7131,10 +7140,12 @@ $grid-checkmark-color: $accent-font !default;
7131
7140
 
7132
7141
  .e-verticallines tr th,
7133
7142
  .e-grouptopleftcell,
7143
+ .e-rowdragheader,
7134
7144
  .e-gridpopup .e-content,
7135
7145
  .e-filterbarcell,
7136
7146
  .e-filterbarcelldisabled,
7137
7147
  &.e-default .e-grouptopleftcell,
7148
+ &.e-default .e-rowdragheader,
7138
7149
  .e-headercell,
7139
7150
  .e-summarycell,
7140
7151
  .e-detailheadercell,
@@ -1884,28 +1884,18 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
1884
1884
  }
1885
1885
 
1886
1886
  .e-bigger &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
1887
- &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground,
1888
- .e-bigger &.e-rtl td.e-rowcell.e-cellselectionbackground,
1889
- &.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1887
+ &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1890
1888
  @if $grid-skin == 'material3' {
1891
1889
  border: 1px solid rgba($content-text-color);
1892
1890
  }
1893
1891
  }
1894
1892
 
1895
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1896
- .e-bigger & td.e-cellselectionbackground,
1897
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1898
- &.e-bigger td.e-cellselectionbackground {
1893
+ .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
1894
+ &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
1899
1895
  @if $grid-skin == 'material3' {
1900
- padding-bottom: 13px;
1901
- @include grid-padding-left-right(11.5px, 11.5px);
1902
- }
1903
- }
1904
-
1905
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1906
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
1907
- @if $grid-skin == 'material3' {
1908
- padding-top: 13px;
1896
+ padding-top: 0;
1897
+ padding-bottom: 0;
1898
+ @include grid-padding-left-right(12px, 12px);
1909
1899
  }
1910
1900
  }
1911
1901
 
@@ -2545,6 +2535,9 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
2545
2535
 
2546
2536
  & .e-res-apply-btn:disabled {
2547
2537
  color: $grid-btn-disabled-bgcolor;
2538
+ @if $grid-skin == 'fluent2' {
2539
+ color: $primary-text-disabled;
2540
+ }
2548
2541
  }
2549
2542
  & .e-btn {
2550
2543
  @if $grid-skin != 'fluent2' {
@@ -3643,6 +3636,18 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
3643
3636
  }
3644
3637
  }
3645
3638
 
3639
+ &:not(.sf-grid) .e-res-toolbar .e-toolbar-items .e-search-wrapper {
3640
+ & .e-search-icon {
3641
+ padding: $grid-res-toolbar-search-wrapper-icon-padding;
3642
+ @if $grid-skin == 'bootstrap5.3' {
3643
+ padding: 9px 8px;
3644
+ }
3645
+ @if $grid-skin == 'bootstrap4' {
3646
+ padding: 9px 9.5px;
3647
+ }
3648
+ }
3649
+ }
3650
+
3646
3651
  .e-res-toolbar {
3647
3652
  border-bottom: 1px solid;
3648
3653
  border-bottom-color: $grid-header-border-color;
@@ -3743,18 +3748,6 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
3743
3748
  }
3744
3749
  }
3745
3750
 
3746
- &:not(.sf-grid).e-search-wrapper {
3747
- & .e-search-icon {
3748
- padding: $grid-res-toolbar-search-wrapper-icon-padding;
3749
- @if $grid-skin == 'bootstrap5.3' {
3750
- padding: 9px 8px;
3751
- }
3752
- @if $grid-skin == 'bootstrap4' {
3753
- padding: 9px 9.5px;
3754
- }
3755
- }
3756
- }
3757
-
3758
3751
  & .e-responsive-right {
3759
3752
  & .e-search-wrapper {
3760
3753
  padding-left: 0;
@@ -3951,8 +3944,11 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
3951
3944
  }
3952
3945
  }
3953
3946
 
3954
- &.e-default .e-grouptopleftcell {
3955
- border-top: $grid-grouptopleftcell-border-top;
3947
+ &.e-default {
3948
+ .e-grouptopleftcell,
3949
+ .e-rowdragheader {
3950
+ border-top: $grid-grouptopleftcell-border-top;
3951
+ }
3956
3952
  }
3957
3953
 
3958
3954
  &.e-default .e-gridheader .e-headercell.e-firstheader,
@@ -3960,10 +3956,13 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
3960
3956
  border-left: 1px solid;
3961
3957
  }
3962
3958
 
3963
- &.e-default.e-verticallines .e-grouptopleftcell,
3964
- &.e-default.e-bothlines .e-grouptopleftcell,
3965
- &.e-default.e-hidelines .e-grouptopleftcell {
3966
- border-top-width: 0;
3959
+ &.e-default.e-verticallines,
3960
+ &.e-default.e-bothlines,
3961
+ &.e-default.e-hidelines {
3962
+ .e-grouptopleftcell,
3963
+ .e-rowdragheader {
3964
+ border-top-width: 0;
3965
+ }
3967
3966
  }
3968
3967
 
3969
3968
  &.e-default.e-verticallines,
@@ -4224,6 +4223,12 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
4224
4223
  width: auto;
4225
4224
  }
4226
4225
 
4226
+ .e-rowcell.e-gridchkbox {
4227
+ @if $grid-skin == 'fluent' {
4228
+ padding-left: 8px;
4229
+ }
4230
+ }
4231
+
4227
4232
  &.e-left-shadow,
4228
4233
  &.e-rtl.e-left-shadow,
4229
4234
  &.e-rtl.e-default.e-left-shadow,
@@ -5167,13 +5172,12 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
5167
5172
  font-weight: $grid-selection-font-weight;
5168
5173
  }
5169
5174
 
5170
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
5175
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
5171
5176
  td.e-cellselectionbackground {
5172
5177
  font-weight: $grid-selection-font-weight;
5173
5178
  @if $grid-skin == 'material3' {
5174
- border: 1px solid rgba($content-text-color);
5175
5179
  padding-bottom: 7px;
5176
- @include grid-padding-left-right(7.5px, 7.5px);
5180
+ @include grid-padding-left-right(8px, 8px);
5177
5181
  }
5178
5182
  }
5179
5183
 
@@ -5184,14 +5188,13 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
5184
5188
  }
5185
5189
 
5186
5190
  &.e-bothlines td.e-rowcell.e-cellselectionbackground,
5187
- &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
5188
- &.e-rtl td.e-rowcell.e-cellselectionbackground {
5191
+ &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground {
5189
5192
  @if $grid-skin == 'material3' {
5190
5193
  border: 1px solid rgba($content-text-color);
5191
5194
  }
5192
5195
  }
5193
5196
 
5194
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
5197
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
5195
5198
  @if $grid-skin == 'material3' {
5196
5199
  padding-top: 7px;
5197
5200
  }
@@ -6271,7 +6274,8 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
6271
6274
  }
6272
6275
 
6273
6276
  &.e-wrap {
6274
- & .e-rowcell,
6277
+ & .e-gridheader .e-rowcell,
6278
+ & .e-gridcontent .e-rowcell,
6275
6279
  & .e-columnheader .e-stackedheadercelldiv,
6276
6280
  & .e-columnheader .e-headercelldiv,
6277
6281
  & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
@@ -6284,6 +6288,10 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
6284
6288
  max-height: $grid-rowcell-wrap-max-height;
6285
6289
  }
6286
6290
  }
6291
+
6292
+ & .e-checkbox-wrapper {
6293
+ vertical-align: middle;
6294
+ }
6287
6295
  }
6288
6296
 
6289
6297
  &.e-wrap .e-columnheader {
@@ -6456,6 +6464,7 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
6456
6464
  }
6457
6465
 
6458
6466
  &.sf-grid {
6467
+
6459
6468
  span.e-ungroupbutton.e-icons {
6460
6469
  margin-left: $grid-group-ungroupicon-margin-left;
6461
6470
  @if $grid-skin == 'material3' {
@@ -7134,10 +7143,12 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
7134
7143
 
7135
7144
  .e-verticallines tr th,
7136
7145
  .e-grouptopleftcell,
7146
+ .e-rowdragheader,
7137
7147
  .e-gridpopup .e-content,
7138
7148
  .e-filterbarcell,
7139
7149
  .e-filterbarcelldisabled,
7140
7150
  &.e-default .e-grouptopleftcell,
7151
+ &.e-default .e-rowdragheader,
7141
7152
  .e-headercell,
7142
7153
  .e-summarycell,
7143
7154
  .e-detailheadercell,
@@ -1884,28 +1884,18 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
1884
1884
  }
1885
1885
 
1886
1886
  .e-bigger &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
1887
- &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground,
1888
- .e-bigger &.e-rtl td.e-rowcell.e-cellselectionbackground,
1889
- &.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1887
+ &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1890
1888
  @if $grid-skin == 'material3' {
1891
1889
  border: 1px solid rgba($content-text-color);
1892
1890
  }
1893
1891
  }
1894
1892
 
1895
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1896
- .e-bigger & td.e-cellselectionbackground,
1897
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1898
- &.e-bigger td.e-cellselectionbackground {
1893
+ .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
1894
+ &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
1899
1895
  @if $grid-skin == 'material3' {
1900
- padding-bottom: 13px;
1901
- @include grid-padding-left-right(11.5px, 11.5px);
1902
- }
1903
- }
1904
-
1905
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1906
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
1907
- @if $grid-skin == 'material3' {
1908
- padding-top: 13px;
1896
+ padding-top: 0;
1897
+ padding-bottom: 0;
1898
+ @include grid-padding-left-right(12px, 12px);
1909
1899
  }
1910
1900
  }
1911
1901
 
@@ -2545,6 +2535,9 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
2545
2535
 
2546
2536
  & .e-res-apply-btn:disabled {
2547
2537
  color: $grid-btn-disabled-bgcolor;
2538
+ @if $grid-skin == 'fluent2' {
2539
+ color: $primary-text-disabled;
2540
+ }
2548
2541
  }
2549
2542
  & .e-btn {
2550
2543
  @if $grid-skin != 'fluent2' {
@@ -3643,6 +3636,18 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
3643
3636
  }
3644
3637
  }
3645
3638
 
3639
+ &:not(.sf-grid) .e-res-toolbar .e-toolbar-items .e-search-wrapper {
3640
+ & .e-search-icon {
3641
+ padding: $grid-res-toolbar-search-wrapper-icon-padding;
3642
+ @if $grid-skin == 'bootstrap5.3' {
3643
+ padding: 9px 8px;
3644
+ }
3645
+ @if $grid-skin == 'bootstrap4' {
3646
+ padding: 9px 9.5px;
3647
+ }
3648
+ }
3649
+ }
3650
+
3646
3651
  .e-res-toolbar {
3647
3652
  border-bottom: 1px solid;
3648
3653
  border-bottom-color: $grid-header-border-color;
@@ -3743,18 +3748,6 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
3743
3748
  }
3744
3749
  }
3745
3750
 
3746
- &:not(.sf-grid).e-search-wrapper {
3747
- & .e-search-icon {
3748
- padding: $grid-res-toolbar-search-wrapper-icon-padding;
3749
- @if $grid-skin == 'bootstrap5.3' {
3750
- padding: 9px 8px;
3751
- }
3752
- @if $grid-skin == 'bootstrap4' {
3753
- padding: 9px 9.5px;
3754
- }
3755
- }
3756
- }
3757
-
3758
3751
  & .e-responsive-right {
3759
3752
  & .e-search-wrapper {
3760
3753
  padding-left: 0;
@@ -3951,8 +3944,11 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
3951
3944
  }
3952
3945
  }
3953
3946
 
3954
- &.e-default .e-grouptopleftcell {
3955
- border-top: $grid-grouptopleftcell-border-top;
3947
+ &.e-default {
3948
+ .e-grouptopleftcell,
3949
+ .e-rowdragheader {
3950
+ border-top: $grid-grouptopleftcell-border-top;
3951
+ }
3956
3952
  }
3957
3953
 
3958
3954
  &.e-default .e-gridheader .e-headercell.e-firstheader,
@@ -3960,10 +3956,13 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
3960
3956
  border-left: 1px solid;
3961
3957
  }
3962
3958
 
3963
- &.e-default.e-verticallines .e-grouptopleftcell,
3964
- &.e-default.e-bothlines .e-grouptopleftcell,
3965
- &.e-default.e-hidelines .e-grouptopleftcell {
3966
- border-top-width: 0;
3959
+ &.e-default.e-verticallines,
3960
+ &.e-default.e-bothlines,
3961
+ &.e-default.e-hidelines {
3962
+ .e-grouptopleftcell,
3963
+ .e-rowdragheader {
3964
+ border-top-width: 0;
3965
+ }
3967
3966
  }
3968
3967
 
3969
3968
  &.e-default.e-verticallines,
@@ -4224,6 +4223,12 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
4224
4223
  width: auto;
4225
4224
  }
4226
4225
 
4226
+ .e-rowcell.e-gridchkbox {
4227
+ @if $grid-skin == 'fluent' {
4228
+ padding-left: 8px;
4229
+ }
4230
+ }
4231
+
4227
4232
  &.e-left-shadow,
4228
4233
  &.e-rtl.e-left-shadow,
4229
4234
  &.e-rtl.e-default.e-left-shadow,
@@ -5167,13 +5172,12 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
5167
5172
  font-weight: $grid-selection-font-weight;
5168
5173
  }
5169
5174
 
5170
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
5175
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
5171
5176
  td.e-cellselectionbackground {
5172
5177
  font-weight: $grid-selection-font-weight;
5173
5178
  @if $grid-skin == 'material3' {
5174
- border: 1px solid rgba($content-text-color);
5175
5179
  padding-bottom: 7px;
5176
- @include grid-padding-left-right(7.5px, 7.5px);
5180
+ @include grid-padding-left-right(8px, 8px);
5177
5181
  }
5178
5182
  }
5179
5183
 
@@ -5184,14 +5188,13 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
5184
5188
  }
5185
5189
 
5186
5190
  &.e-bothlines td.e-rowcell.e-cellselectionbackground,
5187
- &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
5188
- &.e-rtl td.e-rowcell.e-cellselectionbackground {
5191
+ &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground {
5189
5192
  @if $grid-skin == 'material3' {
5190
5193
  border: 1px solid rgba($content-text-color);
5191
5194
  }
5192
5195
  }
5193
5196
 
5194
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
5197
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
5195
5198
  @if $grid-skin == 'material3' {
5196
5199
  padding-top: 7px;
5197
5200
  }
@@ -6271,7 +6274,8 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
6271
6274
  }
6272
6275
 
6273
6276
  &.e-wrap {
6274
- & .e-rowcell,
6277
+ & .e-gridheader .e-rowcell,
6278
+ & .e-gridcontent .e-rowcell,
6275
6279
  & .e-columnheader .e-stackedheadercelldiv,
6276
6280
  & .e-columnheader .e-headercelldiv,
6277
6281
  & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
@@ -6284,6 +6288,10 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
6284
6288
  max-height: $grid-rowcell-wrap-max-height;
6285
6289
  }
6286
6290
  }
6291
+
6292
+ & .e-checkbox-wrapper {
6293
+ vertical-align: middle;
6294
+ }
6287
6295
  }
6288
6296
 
6289
6297
  &.e-wrap .e-columnheader {
@@ -6456,6 +6464,7 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
6456
6464
  }
6457
6465
 
6458
6466
  &.sf-grid {
6467
+
6459
6468
  span.e-ungroupbutton.e-icons {
6460
6469
  margin-left: $grid-group-ungroupicon-margin-left;
6461
6470
  @if $grid-skin == 'material3' {
@@ -7134,10 +7143,12 @@ $grid-checkmark-color: rgba($primary-text-color) !default;
7134
7143
 
7135
7144
  .e-verticallines tr th,
7136
7145
  .e-grouptopleftcell,
7146
+ .e-rowdragheader,
7137
7147
  .e-gridpopup .e-content,
7138
7148
  .e-filterbarcell,
7139
7149
  .e-filterbarcelldisabled,
7140
7150
  &.e-default .e-grouptopleftcell,
7151
+ &.e-default .e-rowdragheader,
7141
7152
  .e-headercell,
7142
7153
  .e-summarycell,
7143
7154
  .e-detailheadercell,