@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
@@ -1895,28 +1895,18 @@ $grid-checkmark-color: $primary !default;
1895
1895
  }
1896
1896
 
1897
1897
  .e-bigger &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
1898
- &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground,
1899
- .e-bigger &.e-rtl td.e-rowcell.e-cellselectionbackground,
1900
- &.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1898
+ &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1901
1899
  @if $grid-skin == 'material3' {
1902
1900
  border: 1px solid rgba($content-text-color);
1903
1901
  }
1904
1902
  }
1905
1903
 
1906
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1907
- .e-bigger & td.e-cellselectionbackground,
1908
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1909
- &.e-bigger td.e-cellselectionbackground {
1904
+ .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
1905
+ &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
1910
1906
  @if $grid-skin == 'material3' {
1911
- padding-bottom: 13px;
1912
- @include grid-padding-left-right(11.5px, 11.5px);
1913
- }
1914
- }
1915
-
1916
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1917
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
1918
- @if $grid-skin == 'material3' {
1919
- padding-top: 13px;
1907
+ padding-top: 0;
1908
+ padding-bottom: 0;
1909
+ @include grid-padding-left-right(12px, 12px);
1920
1910
  }
1921
1911
  }
1922
1912
 
@@ -2556,6 +2546,9 @@ $grid-checkmark-color: $primary !default;
2556
2546
 
2557
2547
  & .e-res-apply-btn:disabled {
2558
2548
  color: $grid-btn-disabled-bgcolor;
2549
+ @if $grid-skin == 'fluent2' {
2550
+ color: $primary-text-disabled;
2551
+ }
2559
2552
  }
2560
2553
  & .e-btn {
2561
2554
  @if $grid-skin != 'fluent2' {
@@ -3654,6 +3647,18 @@ $grid-checkmark-color: $primary !default;
3654
3647
  }
3655
3648
  }
3656
3649
 
3650
+ &:not(.sf-grid) .e-res-toolbar .e-toolbar-items .e-search-wrapper {
3651
+ & .e-search-icon {
3652
+ padding: $grid-res-toolbar-search-wrapper-icon-padding;
3653
+ @if $grid-skin == 'bootstrap5.3' {
3654
+ padding: 9px 8px;
3655
+ }
3656
+ @if $grid-skin == 'bootstrap4' {
3657
+ padding: 9px 9.5px;
3658
+ }
3659
+ }
3660
+ }
3661
+
3657
3662
  .e-res-toolbar {
3658
3663
  border-bottom: 1px solid;
3659
3664
  border-bottom-color: $grid-header-border-color;
@@ -3754,18 +3759,6 @@ $grid-checkmark-color: $primary !default;
3754
3759
  }
3755
3760
  }
3756
3761
 
3757
- &:not(.sf-grid).e-search-wrapper {
3758
- & .e-search-icon {
3759
- padding: $grid-res-toolbar-search-wrapper-icon-padding;
3760
- @if $grid-skin == 'bootstrap5.3' {
3761
- padding: 9px 8px;
3762
- }
3763
- @if $grid-skin == 'bootstrap4' {
3764
- padding: 9px 9.5px;
3765
- }
3766
- }
3767
- }
3768
-
3769
3762
  & .e-responsive-right {
3770
3763
  & .e-search-wrapper {
3771
3764
  padding-left: 0;
@@ -3962,8 +3955,11 @@ $grid-checkmark-color: $primary !default;
3962
3955
  }
3963
3956
  }
3964
3957
 
3965
- &.e-default .e-grouptopleftcell {
3966
- border-top: $grid-grouptopleftcell-border-top;
3958
+ &.e-default {
3959
+ .e-grouptopleftcell,
3960
+ .e-rowdragheader {
3961
+ border-top: $grid-grouptopleftcell-border-top;
3962
+ }
3967
3963
  }
3968
3964
 
3969
3965
  &.e-default .e-gridheader .e-headercell.e-firstheader,
@@ -3971,10 +3967,13 @@ $grid-checkmark-color: $primary !default;
3971
3967
  border-left: 1px solid;
3972
3968
  }
3973
3969
 
3974
- &.e-default.e-verticallines .e-grouptopleftcell,
3975
- &.e-default.e-bothlines .e-grouptopleftcell,
3976
- &.e-default.e-hidelines .e-grouptopleftcell {
3977
- border-top-width: 0;
3970
+ &.e-default.e-verticallines,
3971
+ &.e-default.e-bothlines,
3972
+ &.e-default.e-hidelines {
3973
+ .e-grouptopleftcell,
3974
+ .e-rowdragheader {
3975
+ border-top-width: 0;
3976
+ }
3978
3977
  }
3979
3978
 
3980
3979
  &.e-default.e-verticallines,
@@ -4235,6 +4234,12 @@ $grid-checkmark-color: $primary !default;
4235
4234
  width: auto;
4236
4235
  }
4237
4236
 
4237
+ .e-rowcell.e-gridchkbox {
4238
+ @if $grid-skin == 'fluent' {
4239
+ padding-left: 8px;
4240
+ }
4241
+ }
4242
+
4238
4243
  &.e-left-shadow,
4239
4244
  &.e-rtl.e-left-shadow,
4240
4245
  &.e-rtl.e-default.e-left-shadow,
@@ -5178,13 +5183,12 @@ $grid-checkmark-color: $primary !default;
5178
5183
  font-weight: $grid-selection-font-weight;
5179
5184
  }
5180
5185
 
5181
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
5186
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
5182
5187
  td.e-cellselectionbackground {
5183
5188
  font-weight: $grid-selection-font-weight;
5184
5189
  @if $grid-skin == 'material3' {
5185
- border: 1px solid rgba($content-text-color);
5186
5190
  padding-bottom: 7px;
5187
- @include grid-padding-left-right(7.5px, 7.5px);
5191
+ @include grid-padding-left-right(8px, 8px);
5188
5192
  }
5189
5193
  }
5190
5194
 
@@ -5195,14 +5199,13 @@ $grid-checkmark-color: $primary !default;
5195
5199
  }
5196
5200
 
5197
5201
  &.e-bothlines td.e-rowcell.e-cellselectionbackground,
5198
- &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
5199
- &.e-rtl td.e-rowcell.e-cellselectionbackground {
5202
+ &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground {
5200
5203
  @if $grid-skin == 'material3' {
5201
5204
  border: 1px solid rgba($content-text-color);
5202
5205
  }
5203
5206
  }
5204
5207
 
5205
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
5208
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
5206
5209
  @if $grid-skin == 'material3' {
5207
5210
  padding-top: 7px;
5208
5211
  }
@@ -6282,7 +6285,8 @@ $grid-checkmark-color: $primary !default;
6282
6285
  }
6283
6286
 
6284
6287
  &.e-wrap {
6285
- & .e-rowcell,
6288
+ & .e-gridheader .e-rowcell,
6289
+ & .e-gridcontent .e-rowcell,
6286
6290
  & .e-columnheader .e-stackedheadercelldiv,
6287
6291
  & .e-columnheader .e-headercelldiv,
6288
6292
  & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
@@ -6295,6 +6299,10 @@ $grid-checkmark-color: $primary !default;
6295
6299
  max-height: $grid-rowcell-wrap-max-height;
6296
6300
  }
6297
6301
  }
6302
+
6303
+ & .e-checkbox-wrapper {
6304
+ vertical-align: middle;
6305
+ }
6298
6306
  }
6299
6307
 
6300
6308
  &.e-wrap .e-columnheader {
@@ -6467,6 +6475,7 @@ $grid-checkmark-color: $primary !default;
6467
6475
  }
6468
6476
 
6469
6477
  &.sf-grid {
6478
+
6470
6479
  span.e-ungroupbutton.e-icons {
6471
6480
  margin-left: $grid-group-ungroupicon-margin-left;
6472
6481
  @if $grid-skin == 'material3' {
@@ -7145,10 +7154,12 @@ $grid-checkmark-color: $primary !default;
7145
7154
 
7146
7155
  .e-verticallines tr th,
7147
7156
  .e-grouptopleftcell,
7157
+ .e-rowdragheader,
7148
7158
  .e-gridpopup .e-content,
7149
7159
  .e-filterbarcell,
7150
7160
  .e-filterbarcelldisabled,
7151
7161
  &.e-default .e-grouptopleftcell,
7162
+ &.e-default .e-rowdragheader,
7152
7163
  .e-headercell,
7153
7164
  .e-summarycell,
7154
7165
  .e-detailheadercell,
@@ -1884,28 +1884,18 @@ $grid-checkmark-color: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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: $grey-light-font !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,
@@ -1883,28 +1883,18 @@ $grid-checkmark-color: $grey !default;
1883
1883
  }
1884
1884
 
1885
1885
  .e-bigger &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
1886
- &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground,
1887
- .e-bigger &.e-rtl td.e-rowcell.e-cellselectionbackground,
1888
- &.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1886
+ &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1889
1887
  @if $grid-skin == 'material3' {
1890
1888
  border: 1px solid rgba($content-text-color);
1891
1889
  }
1892
1890
  }
1893
1891
 
1894
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1895
- .e-bigger & td.e-cellselectionbackground,
1896
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1897
- &.e-bigger td.e-cellselectionbackground {
1892
+ .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
1893
+ &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
1898
1894
  @if $grid-skin == 'material3' {
1899
- padding-bottom: 13px;
1900
- @include grid-padding-left-right(11.5px, 11.5px);
1901
- }
1902
- }
1903
-
1904
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1905
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
1906
- @if $grid-skin == 'material3' {
1907
- padding-top: 13px;
1895
+ padding-top: 0;
1896
+ padding-bottom: 0;
1897
+ @include grid-padding-left-right(12px, 12px);
1908
1898
  }
1909
1899
  }
1910
1900
 
@@ -2544,6 +2534,9 @@ $grid-checkmark-color: $grey !default;
2544
2534
 
2545
2535
  & .e-res-apply-btn:disabled {
2546
2536
  color: $grid-btn-disabled-bgcolor;
2537
+ @if $grid-skin == 'fluent2' {
2538
+ color: $primary-text-disabled;
2539
+ }
2547
2540
  }
2548
2541
  & .e-btn {
2549
2542
  @if $grid-skin != 'fluent2' {
@@ -3642,6 +3635,18 @@ $grid-checkmark-color: $grey !default;
3642
3635
  }
3643
3636
  }
3644
3637
 
3638
+ &:not(.sf-grid) .e-res-toolbar .e-toolbar-items .e-search-wrapper {
3639
+ & .e-search-icon {
3640
+ padding: $grid-res-toolbar-search-wrapper-icon-padding;
3641
+ @if $grid-skin == 'bootstrap5.3' {
3642
+ padding: 9px 8px;
3643
+ }
3644
+ @if $grid-skin == 'bootstrap4' {
3645
+ padding: 9px 9.5px;
3646
+ }
3647
+ }
3648
+ }
3649
+
3645
3650
  .e-res-toolbar {
3646
3651
  border-bottom: 1px solid;
3647
3652
  border-bottom-color: $grid-header-border-color;
@@ -3742,18 +3747,6 @@ $grid-checkmark-color: $grey !default;
3742
3747
  }
3743
3748
  }
3744
3749
 
3745
- &:not(.sf-grid).e-search-wrapper {
3746
- & .e-search-icon {
3747
- padding: $grid-res-toolbar-search-wrapper-icon-padding;
3748
- @if $grid-skin == 'bootstrap5.3' {
3749
- padding: 9px 8px;
3750
- }
3751
- @if $grid-skin == 'bootstrap4' {
3752
- padding: 9px 9.5px;
3753
- }
3754
- }
3755
- }
3756
-
3757
3750
  & .e-responsive-right {
3758
3751
  & .e-search-wrapper {
3759
3752
  padding-left: 0;
@@ -3950,8 +3943,11 @@ $grid-checkmark-color: $grey !default;
3950
3943
  }
3951
3944
  }
3952
3945
 
3953
- &.e-default .e-grouptopleftcell {
3954
- border-top: $grid-grouptopleftcell-border-top;
3946
+ &.e-default {
3947
+ .e-grouptopleftcell,
3948
+ .e-rowdragheader {
3949
+ border-top: $grid-grouptopleftcell-border-top;
3950
+ }
3955
3951
  }
3956
3952
 
3957
3953
  &.e-default .e-gridheader .e-headercell.e-firstheader,
@@ -3959,10 +3955,13 @@ $grid-checkmark-color: $grey !default;
3959
3955
  border-left: 1px solid;
3960
3956
  }
3961
3957
 
3962
- &.e-default.e-verticallines .e-grouptopleftcell,
3963
- &.e-default.e-bothlines .e-grouptopleftcell,
3964
- &.e-default.e-hidelines .e-grouptopleftcell {
3965
- border-top-width: 0;
3958
+ &.e-default.e-verticallines,
3959
+ &.e-default.e-bothlines,
3960
+ &.e-default.e-hidelines {
3961
+ .e-grouptopleftcell,
3962
+ .e-rowdragheader {
3963
+ border-top-width: 0;
3964
+ }
3966
3965
  }
3967
3966
 
3968
3967
  &.e-default.e-verticallines,
@@ -4223,6 +4222,12 @@ $grid-checkmark-color: $grey !default;
4223
4222
  width: auto;
4224
4223
  }
4225
4224
 
4225
+ .e-rowcell.e-gridchkbox {
4226
+ @if $grid-skin == 'fluent' {
4227
+ padding-left: 8px;
4228
+ }
4229
+ }
4230
+
4226
4231
  &.e-left-shadow,
4227
4232
  &.e-rtl.e-left-shadow,
4228
4233
  &.e-rtl.e-default.e-left-shadow,
@@ -5166,13 +5171,12 @@ $grid-checkmark-color: $grey !default;
5166
5171
  font-weight: $grid-selection-font-weight;
5167
5172
  }
5168
5173
 
5169
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
5174
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
5170
5175
  td.e-cellselectionbackground {
5171
5176
  font-weight: $grid-selection-font-weight;
5172
5177
  @if $grid-skin == 'material3' {
5173
- border: 1px solid rgba($content-text-color);
5174
5178
  padding-bottom: 7px;
5175
- @include grid-padding-left-right(7.5px, 7.5px);
5179
+ @include grid-padding-left-right(8px, 8px);
5176
5180
  }
5177
5181
  }
5178
5182
 
@@ -5183,14 +5187,13 @@ $grid-checkmark-color: $grey !default;
5183
5187
  }
5184
5188
 
5185
5189
  &.e-bothlines td.e-rowcell.e-cellselectionbackground,
5186
- &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
5187
- &.e-rtl td.e-rowcell.e-cellselectionbackground {
5190
+ &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground {
5188
5191
  @if $grid-skin == 'material3' {
5189
5192
  border: 1px solid rgba($content-text-color);
5190
5193
  }
5191
5194
  }
5192
5195
 
5193
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
5196
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
5194
5197
  @if $grid-skin == 'material3' {
5195
5198
  padding-top: 7px;
5196
5199
  }
@@ -6270,7 +6273,8 @@ $grid-checkmark-color: $grey !default;
6270
6273
  }
6271
6274
 
6272
6275
  &.e-wrap {
6273
- & .e-rowcell,
6276
+ & .e-gridheader .e-rowcell,
6277
+ & .e-gridcontent .e-rowcell,
6274
6278
  & .e-columnheader .e-stackedheadercelldiv,
6275
6279
  & .e-columnheader .e-headercelldiv,
6276
6280
  & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
@@ -6283,6 +6287,10 @@ $grid-checkmark-color: $grey !default;
6283
6287
  max-height: $grid-rowcell-wrap-max-height;
6284
6288
  }
6285
6289
  }
6290
+
6291
+ & .e-checkbox-wrapper {
6292
+ vertical-align: middle;
6293
+ }
6286
6294
  }
6287
6295
 
6288
6296
  &.e-wrap .e-columnheader {
@@ -6455,6 +6463,7 @@ $grid-checkmark-color: $grey !default;
6455
6463
  }
6456
6464
 
6457
6465
  &.sf-grid {
6466
+
6458
6467
  span.e-ungroupbutton.e-icons {
6459
6468
  margin-left: $grid-group-ungroupicon-margin-left;
6460
6469
  @if $grid-skin == 'material3' {
@@ -7133,10 +7142,12 @@ $grid-checkmark-color: $grey !default;
7133
7142
 
7134
7143
  .e-verticallines tr th,
7135
7144
  .e-grouptopleftcell,
7145
+ .e-rowdragheader,
7136
7146
  .e-gridpopup .e-content,
7137
7147
  .e-filterbarcell,
7138
7148
  .e-filterbarcelldisabled,
7139
7149
  &.e-default .e-grouptopleftcell,
7150
+ &.e-default .e-rowdragheader,
7140
7151
  .e-headercell,
7141
7152
  .e-summarycell,
7142
7153
  .e-detailheadercell,