@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
@@ -5573,9 +5573,7 @@ $ddl-list-disable-item-color: $flyout-text-color-disabled !default;
5573
5573
 
5574
5574
  .e-ddl.e-popup .e-filter-parent .e-input-group input.e-input-filter {
5575
5575
  border-color: transparent;
5576
- @if $skin-name == 'bootstrap4' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' or $skin-name == 'highcontrast' {
5577
- background: none;
5578
- }
5576
+ background: none;
5579
5577
  }
5580
5578
  }
5581
5579
 
@@ -32423,6 +32421,13 @@ $cbox-border-style: solid !default;
32423
32421
  }
32424
32422
  }
32425
32423
  }
32424
+
32425
+ &:hover .e-checkbox:focus + .e-frame.e-check {
32426
+ @if $theme-name == 'fluent2-highcontrast' {
32427
+ background-color: $primary-border-color-hover !important; /* stylelint-disable-line declaration-no-important */
32428
+ border-color: $primary-border-color-hover !important; /* stylelint-disable-line declaration-no-important */
32429
+ }
32430
+ }
32426
32431
  }
32427
32432
  }
32428
32433
  }
@@ -40178,7 +40183,7 @@ $cpicker-recent-color-tile-border: $border-light !default;
40178
40183
  color: $cpicker-handler-tooltip-color;
40179
40184
  }
40180
40185
  @else if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
40181
- background-color: $btn-hover-bgcolor !important; /* stylelint-disable-line declaration-no-important */
40186
+ background-color: $btn-hover-bgcolor;
40182
40187
  color: $cpicker-handler-tooltip-color;
40183
40188
  }
40184
40189
  }
@@ -51422,41 +51427,6 @@ $dialog-footer-flat-btn-hover-color: $secondary-text-color-hover !default;
51422
51427
  .e-footer-content {
51423
51428
  background-color: $dialog-footer-bg-color;
51424
51429
 
51425
- @if $skin-name == 'material' or $skin-name == 'material-dark' {
51426
- .e-btn.e-primary {
51427
- background: none;
51428
- box-shadow: none;
51429
- color: $dialog-primary-button-color;
51430
- }
51431
-
51432
- .e-btn:not(.e-primary) {
51433
- background: none;
51434
- box-shadow: none;
51435
- color: $dialog-secondary-button-color;
51436
- }
51437
- }
51438
-
51439
- @if $skin-name == 'material' or $skin-name == 'material-dark' {
51440
- .e-btn.e-primary:not([DISABLED]):focus-visible,
51441
- .e-btn.e-primary:not([DISABLED]):focus {
51442
- background: $dialog-footer-primary-focus-btn-bg-color;
51443
- }
51444
- .e-btn.e-primary:not([DISABLED]):hover {
51445
- background: $dialog-footer-primary-hover-btn-bg-color;
51446
- }
51447
- .e-btn.e-primary:not([DISABLED]):active {
51448
- background: $dialog-footer-primary-active-btn-bg-color;
51449
- }
51450
- .e-btn:not([DISABLED]):focus-visible,
51451
- .e-btn:not(.e-primary):not([DISABLED]):focus,
51452
- .e-btn:not([DISABLED]):hover {
51453
- background: $dialog-footer-flat-hover-btn-bg-color;
51454
- }
51455
- .e-btn:not([DISABLED]):active {
51456
- background: $dialog-footer-flat-active-btn-bg-color;
51457
- }
51458
- }
51459
-
51460
51430
  @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' or $skin-name == 'Material3' or $skin-name == 'tailwind' or $skin-name == 'FluentUI' or $skin-name == 'fluent2' {
51461
51431
  .e-btn.e-primary.e-flat:not([DISABLED]) {
51462
51432
  background: $dialog-footer-btn-bg-color;
@@ -70854,6 +70824,7 @@ $listbox-dragged-item-text-color: $content-text-color !default;
70854
70824
  }
70855
70825
  }
70856
70826
 
70827
+ & .e-list-wrap:focus-visible,
70857
70828
  &:focus {
70858
70829
  outline: none;
70859
70830
  }
@@ -83946,7 +83917,7 @@ $grid-headercelldiv-padding: 0 18px 0 5px !default;
83946
83917
  $grid-headercelldiv-sort-centeralign-padding-right: 5px !default;
83947
83918
  $grid-headercell-div-padding: 0 1.5em 0 .4em !default;
83948
83919
  $grid-group-text-width: auto !default;
83949
- $grid-grouptopleftcell-border-top: 2px solid !default;
83920
+ $grid-grouptopleftcell-border-top: 1px solid !default;
83950
83921
  $grid-group-caption-font-size: $text-sm !default;
83951
83922
  $grid-group-caption-header-padding: 12px 8px 12px 8px !default;
83952
83923
  $group-sorticon-margin-left: -10px !default;
@@ -85492,28 +85463,18 @@ $grid-checkmark-color: $primary-text-color !default;
85492
85463
  }
85493
85464
 
85494
85465
  .e-bigger &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
85495
- &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground,
85496
- .e-bigger &.e-rtl td.e-rowcell.e-cellselectionbackground,
85497
- &.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
85466
+ &.e-bothlines.e-bigger.e-rtl td.e-rowcell.e-cellselectionbackground {
85498
85467
  @if $grid-skin == 'material3' {
85499
85468
  border: 1px solid rgba($content-text-color);
85500
85469
  }
85501
85470
  }
85502
85471
 
85503
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
85504
- .e-bigger & td.e-cellselectionbackground,
85505
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
85506
- &.e-bigger td.e-cellselectionbackground {
85507
- @if $grid-skin == 'material3' {
85508
- padding-bottom: 13px;
85509
- @include grid-padding-left-right(11.5px, 11.5px);
85510
- }
85511
- }
85512
-
85513
- .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
85514
- &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
85472
+ .e-bigger &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
85473
+ &.e-bigger:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
85515
85474
  @if $grid-skin == 'material3' {
85516
- padding-top: 13px;
85475
+ padding-top: 0;
85476
+ padding-bottom: 0;
85477
+ @include grid-padding-left-right(12px, 12px);
85517
85478
  }
85518
85479
  }
85519
85480
 
@@ -86153,6 +86114,9 @@ $grid-checkmark-color: $primary-text-color !default;
86153
86114
 
86154
86115
  & .e-res-apply-btn:disabled {
86155
86116
  color: $grid-btn-disabled-bgcolor;
86117
+ @if $grid-skin == 'fluent2' {
86118
+ color: $primary-text-disabled;
86119
+ }
86156
86120
  }
86157
86121
  & .e-btn {
86158
86122
  @if $grid-skin != 'fluent2' {
@@ -87251,6 +87215,18 @@ $grid-checkmark-color: $primary-text-color !default;
87251
87215
  }
87252
87216
  }
87253
87217
 
87218
+ &:not(.sf-grid) .e-res-toolbar .e-toolbar-items .e-search-wrapper {
87219
+ & .e-search-icon {
87220
+ padding: $grid-res-toolbar-search-wrapper-icon-padding;
87221
+ @if $grid-skin == 'bootstrap5.3' {
87222
+ padding: 9px 8px;
87223
+ }
87224
+ @if $grid-skin == 'bootstrap4' {
87225
+ padding: 9px 9.5px;
87226
+ }
87227
+ }
87228
+ }
87229
+
87254
87230
  .e-res-toolbar {
87255
87231
  border-bottom: 1px solid;
87256
87232
  border-bottom-color: $grid-header-border-color;
@@ -87351,18 +87327,6 @@ $grid-checkmark-color: $primary-text-color !default;
87351
87327
  }
87352
87328
  }
87353
87329
 
87354
- &:not(.sf-grid).e-search-wrapper {
87355
- & .e-search-icon {
87356
- padding: $grid-res-toolbar-search-wrapper-icon-padding;
87357
- @if $grid-skin == 'bootstrap5.3' {
87358
- padding: 9px 8px;
87359
- }
87360
- @if $grid-skin == 'bootstrap4' {
87361
- padding: 9px 9.5px;
87362
- }
87363
- }
87364
- }
87365
-
87366
87330
  & .e-responsive-right {
87367
87331
  & .e-search-wrapper {
87368
87332
  padding-left: 0;
@@ -87559,8 +87523,11 @@ $grid-checkmark-color: $primary-text-color !default;
87559
87523
  }
87560
87524
  }
87561
87525
 
87562
- &.e-default .e-grouptopleftcell {
87563
- border-top: $grid-grouptopleftcell-border-top;
87526
+ &.e-default {
87527
+ .e-grouptopleftcell,
87528
+ .e-rowdragheader {
87529
+ border-top: $grid-grouptopleftcell-border-top;
87530
+ }
87564
87531
  }
87565
87532
 
87566
87533
  &.e-default .e-gridheader .e-headercell.e-firstheader,
@@ -87568,10 +87535,13 @@ $grid-checkmark-color: $primary-text-color !default;
87568
87535
  border-left: 1px solid;
87569
87536
  }
87570
87537
 
87571
- &.e-default.e-verticallines .e-grouptopleftcell,
87572
- &.e-default.e-bothlines .e-grouptopleftcell,
87573
- &.e-default.e-hidelines .e-grouptopleftcell {
87574
- border-top-width: 0;
87538
+ &.e-default.e-verticallines,
87539
+ &.e-default.e-bothlines,
87540
+ &.e-default.e-hidelines {
87541
+ .e-grouptopleftcell,
87542
+ .e-rowdragheader {
87543
+ border-top-width: 0;
87544
+ }
87575
87545
  }
87576
87546
 
87577
87547
  &.e-default.e-verticallines,
@@ -87832,6 +87802,12 @@ $grid-checkmark-color: $primary-text-color !default;
87832
87802
  width: auto;
87833
87803
  }
87834
87804
 
87805
+ .e-rowcell.e-gridchkbox {
87806
+ @if $grid-skin == 'fluent' {
87807
+ padding-left: 8px;
87808
+ }
87809
+ }
87810
+
87835
87811
  &.e-left-shadow,
87836
87812
  &.e-rtl.e-left-shadow,
87837
87813
  &.e-rtl.e-default.e-left-shadow,
@@ -88775,13 +88751,12 @@ $grid-checkmark-color: $primary-text-color !default;
88775
88751
  font-weight: $grid-selection-font-weight;
88776
88752
  }
88777
88753
 
88778
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground,
88754
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell),
88779
88755
  td.e-cellselectionbackground {
88780
88756
  font-weight: $grid-selection-font-weight;
88781
88757
  @if $grid-skin == 'material3' {
88782
- border: 1px solid rgba($content-text-color);
88783
88758
  padding-bottom: 7px;
88784
- @include grid-padding-left-right(7.5px, 7.5px);
88759
+ @include grid-padding-left-right(8px, 8px);
88785
88760
  }
88786
88761
  }
88787
88762
 
@@ -88792,14 +88767,13 @@ $grid-checkmark-color: $primary-text-color !default;
88792
88767
  }
88793
88768
 
88794
88769
  &.e-bothlines td.e-rowcell.e-cellselectionbackground,
88795
- &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground,
88796
- &.e-rtl td.e-rowcell.e-cellselectionbackground {
88770
+ &.e-bothlines.e-rtl td.e-rowcell.e-cellselectionbackground {
88797
88771
  @if $grid-skin == 'material3' {
88798
88772
  border: 1px solid rgba($content-text-color);
88799
88773
  }
88800
88774
  }
88801
88775
 
88802
- &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground {
88776
+ &:not(.e-row-responsive) .e-gridcontent tr.e-row:first-child td.e-cellselectionbackground:not(.e-gridchkbox-cell) {
88803
88777
  @if $grid-skin == 'material3' {
88804
88778
  padding-top: 7px;
88805
88779
  }
@@ -89879,7 +89853,8 @@ $grid-checkmark-color: $primary-text-color !default;
89879
89853
  }
89880
89854
 
89881
89855
  &.e-wrap {
89882
- & .e-rowcell,
89856
+ & .e-gridheader .e-rowcell,
89857
+ & .e-gridcontent .e-rowcell,
89883
89858
  & .e-columnheader .e-stackedheadercelldiv,
89884
89859
  & .e-columnheader .e-headercelldiv,
89885
89860
  & .e-columnheader .e-headercell.e-fltr-icon .e-headercelldiv {
@@ -89892,6 +89867,10 @@ $grid-checkmark-color: $primary-text-color !default;
89892
89867
  max-height: $grid-rowcell-wrap-max-height;
89893
89868
  }
89894
89869
  }
89870
+
89871
+ & .e-checkbox-wrapper {
89872
+ vertical-align: middle;
89873
+ }
89895
89874
  }
89896
89875
 
89897
89876
  &.e-wrap .e-columnheader {
@@ -90064,6 +90043,7 @@ $grid-checkmark-color: $primary-text-color !default;
90064
90043
  }
90065
90044
 
90066
90045
  &.sf-grid {
90046
+
90067
90047
  span.e-ungroupbutton.e-icons {
90068
90048
  margin-left: $grid-group-ungroupicon-margin-left;
90069
90049
  @if $grid-skin == 'material3' {
@@ -90742,10 +90722,12 @@ $grid-checkmark-color: $primary-text-color !default;
90742
90722
 
90743
90723
  .e-verticallines tr th,
90744
90724
  .e-grouptopleftcell,
90725
+ .e-rowdragheader,
90745
90726
  .e-gridpopup .e-content,
90746
90727
  .e-filterbarcell,
90747
90728
  .e-filterbarcelldisabled,
90748
90729
  &.e-default .e-grouptopleftcell,
90730
+ &.e-default .e-rowdragheader,
90749
90731
  .e-headercell,
90750
90732
  .e-summarycell,
90751
90733
  .e-detailheadercell,
@@ -98764,6 +98746,22 @@ $rte-dialog-upload-status-progress: $info;
98764
98746
  margin-block-start: 10px;
98765
98747
  }
98766
98748
 
98749
+ .e-content ul {
98750
+ list-style-type: disc;
98751
+ }
98752
+
98753
+ .e-content ul ul,
98754
+ .e-content ol ul {
98755
+ list-style-type: circle;
98756
+ }
98757
+
98758
+ .e-content ul ul ul,
98759
+ .e-content ol ul ul,
98760
+ .e-content ul ol ul,
98761
+ .e-content ol ol ul {
98762
+ list-style-type: square;
98763
+ }
98764
+
98767
98765
  .e-content h1 {
98768
98766
  font-size: 2.857em;
98769
98767
  font-weight: 600;
@@ -98832,7 +98830,7 @@ $rte-dialog-upload-status-progress: $info;
98832
98830
  word-break: inherit;
98833
98831
  word-wrap: break-word;
98834
98832
 
98835
- @if $skin-name == 'fluent2' or $skin-name == 'fluent2-highcontrast' or $skin-name == 'fluent2-dark' {
98833
+ @if $skin-name == 'fluent2' or $theme-name == 'fluent2-highcontrast' or $skin-name == 'fluent2-dark' {
98836
98834
  background-color: $rte-pre-bg-color;
98837
98835
  }
98838
98836
  }
@@ -100673,6 +100671,12 @@ $rte-dialog-upload-status-progress: $info;
100673
100671
  color: $rte-drop-btn-active-color;
100674
100672
  }
100675
100673
  }
100674
+
100675
+ .e-tbar-btn:hover {
100676
+ @if $theme-name == 'bootstrap5.3' {
100677
+ color: $rte-drop-btn-active-color;
100678
+ }
100679
+ }
100676
100680
  }
100677
100681
 
100678
100682
  .e-toolbar-extended {
@@ -100699,6 +100703,12 @@ $rte-dialog-upload-status-progress: $info;
100699
100703
  background: $rte-drop-btn-active-bg;
100700
100704
  }
100701
100705
 
100706
+ .e-toolbar-item .e-tbar-btn:hover {
100707
+ @if $theme-name == 'bootstrap5.3' {
100708
+ color: $rte-drop-btn-active-color;
100709
+ }
100710
+ }
100711
+
100702
100712
  @if $skin-name == 'bootstrap5' {
100703
100713
  .e-toolbar-item .e-tbar-btn:focus,
100704
100714
  .e-toolbar-item .e-tbar-btn:hover {
@@ -100717,7 +100727,7 @@ $rte-dialog-upload-status-progress: $info;
100717
100727
  background: transparent;
100718
100728
  color: transparent;
100719
100729
  }
100720
- @if $skin-name == 'Material3' or $skin-name == 'fluent2' or $skin-name == 'fluent2-highcontrast' or $skin-name == 'fluent2-dark' {
100730
+ @if $skin-name == 'Material3' or $skin-name == 'fluent2' or $theme-name == 'fluent2-highcontrast' or $skin-name == 'fluent2-dark' {
100721
100731
  ::selection {
100722
100732
  color: $rte-selection-color;
100723
100733
  background: $rte-selection-bg;
@@ -100835,7 +100845,7 @@ $rte-dialog-upload-status-progress: $info;
100835
100845
  .e-rte-list-primary-content {
100836
100846
 
100837
100847
  &:hover {
100838
- @if $skin-name == 'fluent2-highcontrast' {
100848
+ @if $theme-name == 'fluent2-highcontrast' {
100839
100849
  background: $rte-split-btn-span-active-bg;
100840
100850
  }
100841
100851
  @else {
@@ -100855,7 +100865,7 @@ $rte-dialog-upload-status-progress: $info;
100855
100865
  .e-caret {
100856
100866
 
100857
100867
  &:hover {
100858
- @if $skin-name == 'fluent2-highcontrast' {
100868
+ @if $theme-name == 'fluent2-highcontrast' {
100859
100869
  background: $rte-split-btn-span-active-bg;
100860
100870
  }
100861
100871
  @else {
@@ -100917,7 +100927,7 @@ $rte-dialog-upload-status-progress: $info;
100917
100927
  justify-content: center;
100918
100928
  }
100919
100929
  &:hover {
100920
- @if $skin-name == 'fluent2-highcontrast' {
100930
+ @if $theme-name == 'fluent2-highcontrast' {
100921
100931
  background: $rte-split-btn-span-active-bg;
100922
100932
  }
100923
100933
  @else {
@@ -100928,7 +100938,7 @@ $rte-dialog-upload-status-progress: $info;
100928
100938
 
100929
100939
  .e-caret {
100930
100940
  &:hover {
100931
- @if $skin-name == 'fluent2-highcontrast' {
100941
+ @if $theme-name == 'fluent2-highcontrast' {
100932
100942
  background: $rte-split-btn-span-active-bg;
100933
100943
  }
100934
100944
  @else {
@@ -101222,8 +101232,14 @@ $rte-dialog-upload-status-progress: $info;
101222
101232
  }
101223
101233
  }
101224
101234
  }
101235
+
101225
101236
  .e-richtexteditor .e-rte-toolbar .e-toolbar-extended .e-toolbar-item .e-tbar-btn.e-active .e-icons {
101226
- color: $rte-tlbar-expand-active;
101237
+ @if $theme-name == 'fluent2-highcontrast' {
101238
+ color: $rte-drop-btn-active-color;
101239
+ }
101240
+ @else {
101241
+ color: $rte-tlbar-expand-active;
101242
+ }
101227
101243
  }
101228
101244
 
101229
101245
  .e-rte-emojipicker-popup.e-popup.e-popup-open {
@@ -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,