@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
@@ -1890,28 +1890,18 @@ $grid-checkmark-color: $white !default;
1890
1890
  }
1891
1891
 
1892
1892
  .e-bigger &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
1893
- &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground,
1894
- .e-bigger &.e-rtl td.e-rowcell.e-cellselectionbackground,
1895
- &.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1893
+ &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
1896
1894
  @if $grid-skin == 'material3' {
1897
1895
  border: 1px solid rgba($content-text-color);
1898
1896
  }
1899
1897
  }
1900
1898
 
1901
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1902
- .e-bigger & td.e-cellselectionbackground,
1903
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1904
- &.e-bigger td.e-cellselectionbackground {
1899
+ .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
1900
+ &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
1905
1901
  @if $grid-skin == 'material3' {
1906
- padding-bottom: 13px;
1907
- @include grid-padding-left-right(11.5px, 11.5px);
1908
- }
1909
- }
1910
-
1911
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
1912
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
1913
- @if $grid-skin == 'material3' {
1914
- padding-top: 13px;
1902
+ padding-top: 0;
1903
+ padding-bottom: 0;
1904
+ @include grid-padding-left-right(12px, 12px);
1915
1905
  }
1916
1906
  }
1917
1907
 
@@ -2551,6 +2541,9 @@ $grid-checkmark-color: $white !default;
2551
2541
 
2552
2542
  & .e-res-apply-btn:disabled {
2553
2543
  color: $grid-btn-disabled-bgcolor;
2544
+ @if $grid-skin == 'fluent2' {
2545
+ color: $primary-text-disabled;
2546
+ }
2554
2547
  }
2555
2548
  & .e-btn {
2556
2549
  @if $grid-skin != 'fluent2' {
@@ -3649,6 +3642,18 @@ $grid-checkmark-color: $white !default;
3649
3642
  }
3650
3643
  }
3651
3644
 
3645
+ &:not(.sf-grid) .e-res-toolbar .e-toolbar-items .e-search-wrapper {
3646
+ & .e-search-icon {
3647
+ padding: $grid-res-toolbar-search-wrapper-icon-padding;
3648
+ @if $grid-skin == 'bootstrap5.3' {
3649
+ padding: 9px 8px;
3650
+ }
3651
+ @if $grid-skin == 'bootstrap4' {
3652
+ padding: 9px 9.5px;
3653
+ }
3654
+ }
3655
+ }
3656
+
3652
3657
  .e-res-toolbar {
3653
3658
  border-bottom: 1px solid;
3654
3659
  border-bottom-color: $grid-header-border-color;
@@ -3749,18 +3754,6 @@ $grid-checkmark-color: $white !default;
3749
3754
  }
3750
3755
  }
3751
3756
 
3752
- &:not(.sf-grid).e-search-wrapper {
3753
- & .e-search-icon {
3754
- padding: $grid-res-toolbar-search-wrapper-icon-padding;
3755
- @if $grid-skin == 'bootstrap5.3' {
3756
- padding: 9px 8px;
3757
- }
3758
- @if $grid-skin == 'bootstrap4' {
3759
- padding: 9px 9.5px;
3760
- }
3761
- }
3762
- }
3763
-
3764
3757
  & .e-responsive-right {
3765
3758
  & .e-search-wrapper {
3766
3759
  padding-left: 0;
@@ -3957,8 +3950,11 @@ $grid-checkmark-color: $white !default;
3957
3950
  }
3958
3951
  }
3959
3952
 
3960
- &.e-default .e-grouptopleftcell {
3961
- border-top: $grid-grouptopleftcell-border-top;
3953
+ &.e-default {
3954
+ .e-grouptopleftcell,
3955
+ .e-rowdragheader {
3956
+ border-top: $grid-grouptopleftcell-border-top;
3957
+ }
3962
3958
  }
3963
3959
 
3964
3960
  &.e-default .e-gridheader .e-headercell.e-firstheader,
@@ -3966,10 +3962,13 @@ $grid-checkmark-color: $white !default;
3966
3962
  border-left: 1px solid;
3967
3963
  }
3968
3964
 
3969
- &.e-default.e-verticallines .e-grouptopleftcell,
3970
- &.e-default.e-bothlines .e-grouptopleftcell,
3971
- &.e-default.e-hidelines .e-grouptopleftcell {
3972
- border-top-width: 0;
3965
+ &.e-default.e-verticallines,
3966
+ &.e-default.e-bothlines,
3967
+ &.e-default.e-hidelines {
3968
+ .e-grouptopleftcell,
3969
+ .e-rowdragheader {
3970
+ border-top-width: 0;
3971
+ }
3973
3972
  }
3974
3973
 
3975
3974
  &.e-default.e-verticallines,
@@ -4230,6 +4229,12 @@ $grid-checkmark-color: $white !default;
4230
4229
  width: auto;
4231
4230
  }
4232
4231
 
4232
+ .e-rowcell.e-gridchkbox {
4233
+ @if $grid-skin == 'fluent' {
4234
+ padding-left: 8px;
4235
+ }
4236
+ }
4237
+
4233
4238
  &.e-left-shadow,
4234
4239
  &.e-rtl.e-left-shadow,
4235
4240
  &.e-rtl.e-default.e-left-shadow,
@@ -5173,13 +5178,12 @@ $grid-checkmark-color: $white !default;
5173
5178
  font-weight: $grid-selection-font-weight;
5174
5179
  }
5175
5180
 
5176
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
5181
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
5177
5182
  td.e-cellselectionbackground {
5178
5183
  font-weight: $grid-selection-font-weight;
5179
5184
  @if $grid-skin == 'material3' {
5180
- border: 1px solid rgba($content-text-color);
5181
5185
  padding-bottom: 7px;
5182
- @include grid-padding-left-right(7.5px, 7.5px);
5186
+ @include grid-padding-left-right(8px, 8px);
5183
5187
  }
5184
5188
  }
5185
5189
 
@@ -5190,14 +5194,13 @@ $grid-checkmark-color: $white !default;
5190
5194
  }
5191
5195
 
5192
5196
  &.e-bothlines td.e-rowcell.e-cellselectionbackground,
5193
- &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
5194
- &.e-rtl td.e-rowcell.e-cellselectionbackground {
5197
+ &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground {
5195
5198
  @if $grid-skin == 'material3' {
5196
5199
  border: 1px solid rgba($content-text-color);
5197
5200
  }
5198
5201
  }
5199
5202
 
5200
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
5203
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
5201
5204
  @if $grid-skin == 'material3' {
5202
5205
  padding-top: 7px;
5203
5206
  }
@@ -6277,7 +6280,8 @@ $grid-checkmark-color: $white !default;
6277
6280
  }
6278
6281
 
6279
6282
  &.e-wrap {
6280
- & .e-rowcell,
6283
+ & .e-gridheader .e-rowcell,
6284
+ & .e-gridcontent .e-rowcell,
6281
6285
  & .e-columnheader .e-stackedheadercelldiv,
6282
6286
  & .e-columnheader .e-headercelldiv,
6283
6287
  & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
@@ -6290,6 +6294,10 @@ $grid-checkmark-color: $white !default;
6290
6294
  max-height: $grid-rowcell-wrap-max-height;
6291
6295
  }
6292
6296
  }
6297
+
6298
+ & .e-checkbox-wrapper {
6299
+ vertical-align: middle;
6300
+ }
6293
6301
  }
6294
6302
 
6295
6303
  &.e-wrap .e-columnheader {
@@ -6462,6 +6470,7 @@ $grid-checkmark-color: $white !default;
6462
6470
  }
6463
6471
 
6464
6472
  &.sf-grid {
6473
+
6465
6474
  span.e-ungroupbutton.e-icons {
6466
6475
  margin-left: $grid-group-ungroupicon-margin-left;
6467
6476
  @if $grid-skin == 'material3' {
@@ -7140,10 +7149,12 @@ $grid-checkmark-color: $white !default;
7140
7149
 
7141
7150
  .e-verticallines tr th,
7142
7151
  .e-grouptopleftcell,
7152
+ .e-rowdragheader,
7143
7153
  .e-gridpopup .e-content,
7144
7154
  .e-filterbarcell,
7145
7155
  .e-filterbarcelldisabled,
7146
7156
  &.e-default .e-grouptopleftcell,
7157
+ &.e-default .e-rowdragheader,
7147
7158
  .e-headercell,
7148
7159
  .e-summarycell,
7149
7160
  .e-detailheadercell,
@@ -1883,28 +1883,18 @@ $grid-checkmark-color: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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,
@@ -1883,28 +1883,18 @@ $grid-checkmark-color: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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: $primary-text-color !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,