@syncfusion/blazor-themes 26.1.41 → 26.1.42

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 (141) hide show
  1. package/SCSS-Themes/bds-dark.scss +150 -52
  2. package/SCSS-Themes/bds.scss +150 -52
  3. package/SCSS-Themes/bootstrap-dark.scss +150 -52
  4. package/SCSS-Themes/bootstrap.scss +157 -59
  5. package/SCSS-Themes/bootstrap4.scss +157 -59
  6. package/SCSS-Themes/bootstrap5-dark.scss +161 -63
  7. package/SCSS-Themes/bootstrap5.scss +161 -63
  8. package/SCSS-Themes/documenteditor/document-editor-container/bds-dark.scss +1 -1
  9. package/SCSS-Themes/documenteditor/document-editor-container/bds.scss +1 -1
  10. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap-dark.scss +1 -1
  11. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap.scss +1 -1
  12. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap4.scss +1 -1
  13. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap5-dark.scss +1 -1
  14. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap5.scss +1 -1
  15. package/SCSS-Themes/documenteditor/document-editor-container/fabric-dark.scss +1 -1
  16. package/SCSS-Themes/documenteditor/document-editor-container/fabric.scss +1 -1
  17. package/SCSS-Themes/documenteditor/document-editor-container/fluent-dark.scss +1 -1
  18. package/SCSS-Themes/documenteditor/document-editor-container/fluent.scss +1 -1
  19. package/SCSS-Themes/documenteditor/document-editor-container/fluent2-dark.scss +1 -1
  20. package/SCSS-Themes/documenteditor/document-editor-container/fluent2.scss +1 -1
  21. package/SCSS-Themes/documenteditor/document-editor-container/highcontrast.scss +1 -1
  22. package/SCSS-Themes/documenteditor/document-editor-container/material-dark.scss +1 -1
  23. package/SCSS-Themes/documenteditor/document-editor-container/material.scss +1 -1
  24. package/SCSS-Themes/documenteditor/document-editor-container/material3-dark.scss +1 -1
  25. package/SCSS-Themes/documenteditor/document-editor-container/material3.scss +1 -1
  26. package/SCSS-Themes/documenteditor/document-editor-container/tailwind-dark.scss +1 -1
  27. package/SCSS-Themes/documenteditor/document-editor-container/tailwind.scss +1 -1
  28. package/SCSS-Themes/fabric-dark.scss +150 -52
  29. package/SCSS-Themes/fabric.scss +154 -56
  30. package/SCSS-Themes/fluent-dark.scss +158 -60
  31. package/SCSS-Themes/fluent.scss +158 -60
  32. package/SCSS-Themes/fluent2-dark.scss +167 -69
  33. package/SCSS-Themes/fluent2.scss +167 -69
  34. package/SCSS-Themes/grids/grid/bds-dark.scss +23 -7
  35. package/SCSS-Themes/grids/grid/bds.scss +23 -7
  36. package/SCSS-Themes/grids/grid/bootstrap-dark.scss +23 -7
  37. package/SCSS-Themes/grids/grid/bootstrap.scss +30 -14
  38. package/SCSS-Themes/grids/grid/bootstrap4.scss +30 -14
  39. package/SCSS-Themes/grids/grid/bootstrap5-dark.scss +33 -17
  40. package/SCSS-Themes/grids/grid/bootstrap5.scss +33 -17
  41. package/SCSS-Themes/grids/grid/fabric-dark.scss +23 -7
  42. package/SCSS-Themes/grids/grid/fabric.scss +27 -11
  43. package/SCSS-Themes/grids/grid/fluent-dark.scss +30 -14
  44. package/SCSS-Themes/grids/grid/fluent.scss +30 -14
  45. package/SCSS-Themes/grids/grid/fluent2-dark.scss +36 -20
  46. package/SCSS-Themes/grids/grid/fluent2.scss +36 -20
  47. package/SCSS-Themes/grids/grid/highcontrast.scss +30 -14
  48. package/SCSS-Themes/grids/grid/material-dark.scss +23 -7
  49. package/SCSS-Themes/grids/grid/material.scss +24 -8
  50. package/SCSS-Themes/grids/grid/material3-dark.scss +29 -13
  51. package/SCSS-Themes/grids/grid/material3.scss +29 -13
  52. package/SCSS-Themes/grids/grid/tailwind-dark.scss +33 -17
  53. package/SCSS-Themes/grids/grid/tailwind.scss +33 -17
  54. package/SCSS-Themes/highcontrast.scss +157 -59
  55. package/SCSS-Themes/inputs/slider/bds-dark.scss +34 -7
  56. package/SCSS-Themes/inputs/slider/bds.scss +34 -7
  57. package/SCSS-Themes/inputs/slider/bootstrap-dark.scss +34 -7
  58. package/SCSS-Themes/inputs/slider/bootstrap.scss +34 -7
  59. package/SCSS-Themes/inputs/slider/bootstrap4.scss +34 -7
  60. package/SCSS-Themes/inputs/slider/bootstrap5-dark.scss +34 -7
  61. package/SCSS-Themes/inputs/slider/bootstrap5.scss +34 -7
  62. package/SCSS-Themes/inputs/slider/fabric-dark.scss +34 -7
  63. package/SCSS-Themes/inputs/slider/fabric.scss +34 -7
  64. package/SCSS-Themes/inputs/slider/fluent-dark.scss +34 -7
  65. package/SCSS-Themes/inputs/slider/fluent.scss +34 -7
  66. package/SCSS-Themes/inputs/slider/fluent2-dark.scss +34 -7
  67. package/SCSS-Themes/inputs/slider/fluent2.scss +34 -7
  68. package/SCSS-Themes/inputs/slider/highcontrast.scss +34 -7
  69. package/SCSS-Themes/inputs/slider/material-dark.scss +44 -16
  70. package/SCSS-Themes/inputs/slider/material.scss +34 -7
  71. package/SCSS-Themes/inputs/slider/material3-dark.scss +34 -7
  72. package/SCSS-Themes/inputs/slider/material3.scss +34 -7
  73. package/SCSS-Themes/inputs/slider/tailwind-dark.scss +34 -7
  74. package/SCSS-Themes/inputs/slider/tailwind.scss +34 -7
  75. package/SCSS-Themes/material-dark.scss +161 -62
  76. package/SCSS-Themes/material.scss +152 -54
  77. package/SCSS-Themes/material3-dark.scss +157 -59
  78. package/SCSS-Themes/material3.scss +157 -59
  79. package/SCSS-Themes/navigations/treeview/bds-dark.scss +2 -1
  80. package/SCSS-Themes/navigations/treeview/bds.scss +2 -1
  81. package/SCSS-Themes/navigations/treeview/bootstrap-dark.scss +2 -1
  82. package/SCSS-Themes/navigations/treeview/bootstrap.scss +2 -1
  83. package/SCSS-Themes/navigations/treeview/bootstrap4.scss +2 -1
  84. package/SCSS-Themes/navigations/treeview/bootstrap5-dark.scss +2 -1
  85. package/SCSS-Themes/navigations/treeview/bootstrap5.scss +2 -1
  86. package/SCSS-Themes/navigations/treeview/fabric-dark.scss +2 -1
  87. package/SCSS-Themes/navigations/treeview/fabric.scss +2 -1
  88. package/SCSS-Themes/navigations/treeview/fluent-dark.scss +2 -1
  89. package/SCSS-Themes/navigations/treeview/fluent.scss +2 -1
  90. package/SCSS-Themes/navigations/treeview/fluent2-dark.scss +2 -1
  91. package/SCSS-Themes/navigations/treeview/fluent2.scss +2 -1
  92. package/SCSS-Themes/navigations/treeview/highcontrast.scss +2 -1
  93. package/SCSS-Themes/navigations/treeview/material-dark.scss +2 -1
  94. package/SCSS-Themes/navigations/treeview/material.scss +2 -1
  95. package/SCSS-Themes/navigations/treeview/material3-dark.scss +2 -1
  96. package/SCSS-Themes/navigations/treeview/material3.scss +2 -1
  97. package/SCSS-Themes/navigations/treeview/tailwind-dark.scss +2 -1
  98. package/SCSS-Themes/navigations/treeview/tailwind.scss +2 -1
  99. package/SCSS-Themes/pdfviewer/pdfviewer/bds-dark.scss +89 -36
  100. package/SCSS-Themes/pdfviewer/pdfviewer/bds.scss +89 -36
  101. package/SCSS-Themes/pdfviewer/pdfviewer/bootstrap-dark.scss +89 -36
  102. package/SCSS-Themes/pdfviewer/pdfviewer/bootstrap.scss +89 -36
  103. package/SCSS-Themes/pdfviewer/pdfviewer/bootstrap4.scss +89 -36
  104. package/SCSS-Themes/pdfviewer/pdfviewer/bootstrap5-dark.scss +90 -37
  105. package/SCSS-Themes/pdfviewer/pdfviewer/bootstrap5.scss +90 -37
  106. package/SCSS-Themes/pdfviewer/pdfviewer/fabric-dark.scss +89 -36
  107. package/SCSS-Themes/pdfviewer/pdfviewer/fabric.scss +89 -36
  108. package/SCSS-Themes/pdfviewer/pdfviewer/fluent-dark.scss +90 -37
  109. package/SCSS-Themes/pdfviewer/pdfviewer/fluent.scss +90 -37
  110. package/SCSS-Themes/pdfviewer/pdfviewer/fluent2-dark.scss +93 -40
  111. package/SCSS-Themes/pdfviewer/pdfviewer/fluent2.scss +93 -40
  112. package/SCSS-Themes/pdfviewer/pdfviewer/highcontrast.scss +89 -36
  113. package/SCSS-Themes/pdfviewer/pdfviewer/material-dark.scss +90 -37
  114. package/SCSS-Themes/pdfviewer/pdfviewer/material.scss +90 -37
  115. package/SCSS-Themes/pdfviewer/pdfviewer/material3-dark.scss +90 -37
  116. package/SCSS-Themes/pdfviewer/pdfviewer/material3.scss +90 -37
  117. package/SCSS-Themes/pdfviewer/pdfviewer/tailwind-dark.scss +90 -37
  118. package/SCSS-Themes/pdfviewer/pdfviewer/tailwind.scss +90 -37
  119. package/SCSS-Themes/ribbon/ribbon/bds-dark.scss +1 -0
  120. package/SCSS-Themes/ribbon/ribbon/bds.scss +1 -0
  121. package/SCSS-Themes/ribbon/ribbon/bootstrap-dark.scss +1 -0
  122. package/SCSS-Themes/ribbon/ribbon/bootstrap.scss +1 -0
  123. package/SCSS-Themes/ribbon/ribbon/bootstrap4.scss +1 -0
  124. package/SCSS-Themes/ribbon/ribbon/bootstrap5-dark.scss +1 -0
  125. package/SCSS-Themes/ribbon/ribbon/bootstrap5.scss +1 -0
  126. package/SCSS-Themes/ribbon/ribbon/fabric-dark.scss +1 -0
  127. package/SCSS-Themes/ribbon/ribbon/fabric.scss +1 -0
  128. package/SCSS-Themes/ribbon/ribbon/fluent-dark.scss +1 -0
  129. package/SCSS-Themes/ribbon/ribbon/fluent.scss +1 -0
  130. package/SCSS-Themes/ribbon/ribbon/fluent2-dark.scss +1 -0
  131. package/SCSS-Themes/ribbon/ribbon/fluent2.scss +1 -0
  132. package/SCSS-Themes/ribbon/ribbon/highcontrast.scss +1 -0
  133. package/SCSS-Themes/ribbon/ribbon/material-dark.scss +1 -0
  134. package/SCSS-Themes/ribbon/ribbon/material.scss +1 -0
  135. package/SCSS-Themes/ribbon/ribbon/material3-dark.scss +1 -0
  136. package/SCSS-Themes/ribbon/ribbon/material3.scss +1 -0
  137. package/SCSS-Themes/ribbon/ribbon/tailwind-dark.scss +1 -0
  138. package/SCSS-Themes/ribbon/ribbon/tailwind.scss +1 -0
  139. package/SCSS-Themes/tailwind-dark.scss +161 -63
  140. package/SCSS-Themes/tailwind.scss +161 -63
  141. package/package.json +1 -1
@@ -1185,7 +1185,7 @@ $grid-checkmark-color: $primary !default;
1185
1185
  .e-headercell.e-fltr-icon .e-headercelldiv .e-sortnumber {
1186
1186
  margin: $grid-rtl-bigger-sortnumber-withfilter-margin;
1187
1187
  @if $grid-skin == 'tailwind' {
1188
- margin-left: 0;
1188
+ margin-left: 4px;
1189
1189
  }
1190
1190
  }
1191
1191
 
@@ -2525,7 +2525,17 @@ $grid-checkmark-color: $primary !default;
2525
2525
  text-transform: $grid-header-text-transform;
2526
2526
  user-select: none;
2527
2527
  }
2528
-
2528
+
2529
+ .e-rightalign:not(.e-fltr-icon) .e-headercelldiv {
2530
+ padding: 0 .4em ;
2531
+ @if $grid-skin == 'fabric' {
2532
+ padding: 0 1px 0;
2533
+ }
2534
+ @if $grid-skin == 'highcontrast' {
2535
+ padding: 0;
2536
+ }
2537
+ }
2538
+
2529
2539
  .e-headercelldiv.e-headerchkcelldiv {
2530
2540
  overflow: visible;
2531
2541
  }
@@ -3027,6 +3037,9 @@ $grid-checkmark-color: $primary !default;
3027
3037
  right: 2px;
3028
3038
  }
3029
3039
  }
3040
+ &.e-rtl .e-sortfilter .e-rightalign .e-headercelldiv {
3041
+ padding: $grid-headercelldiv-right-align-padding;
3042
+ }
3030
3043
 
3031
3044
  .e-sortfilterdiv {
3032
3045
  float: right;
@@ -3073,7 +3086,7 @@ $grid-checkmark-color: $primary !default;
3073
3086
  }
3074
3087
 
3075
3088
  &.e-rtl .e-gridheader .e-sortfilter {
3076
- .e-centeralign.e-headercell[aria-sort="none"],
3089
+ .e-centeralign.e-headercell[aria-sort="none"]:not(.e-centeralign),
3077
3090
  .e-centeralign.e-headercell:not([aria-sort]) {
3078
3091
  .e-headercelldiv,
3079
3092
  .e-stackedheadercelldiv {
@@ -4426,6 +4439,9 @@ $grid-checkmark-color: $primary !default;
4426
4439
  .e-headercelldiv.e-headerchkcelldiv {
4427
4440
  padding: $grid-rtl-headercelldiv-padding;
4428
4441
  text-align: right;
4442
+ @if $grid-skin == 'highcontrast' {
4443
+ margin: -7px 0;
4444
+ }
4429
4445
 
4430
4446
  & .e-sortnumber {
4431
4447
  @include grid-flot-margin(left, $grid-fltr-rtl-sortnumber-margin);
@@ -4437,6 +4453,9 @@ $grid-checkmark-color: $primary !default;
4437
4453
  .e-headercelldiv.e-headerchkcelldiv {
4438
4454
  padding: $grid-rtl-headercelldiv-padding;
4439
4455
  text-align: right;
4456
+ @if $grid-skin == 'highcontrast' {
4457
+ margin: -7px 0;
4458
+ }
4440
4459
 
4441
4460
  & .e-sortnumber {
4442
4461
  @include grid-flot-margin(left, $grid-rtl-sortnumber-margin);
@@ -4457,9 +4476,6 @@ $grid-checkmark-color: $primary !default;
4457
4476
 
4458
4477
  & .e-sortnumber {
4459
4478
  margin: $grid-rtl-sort-num-left-align-margin;
4460
- @if $grid-skin == 'bootstrap4' {
4461
- margin: 4px -2px 0 0;
4462
- }
4463
4479
  }
4464
4480
  }
4465
4481
 
@@ -4478,7 +4494,7 @@ $grid-checkmark-color: $primary !default;
4478
4494
  }
4479
4495
 
4480
4496
  & .e-headercelldiv {
4481
- padding: 0 25px 0 .7em;
4497
+ padding: 0 1.6em 0 1.2em;
4482
4498
 
4483
4499
  & .e-sortnumber {
4484
4500
  @include grid-flot-margin(right, $grid-bigger-sort-right-margin);
@@ -1174,7 +1174,7 @@ $grid-checkmark-color: $grey-light-font !default;
1174
1174
  .e-headercell.e-fltr-icon .e-headercelldiv .e-sortnumber {
1175
1175
  margin: $grid-rtl-bigger-sortnumber-withfilter-margin;
1176
1176
  @if $grid-skin == 'tailwind' {
1177
- margin-left: 0;
1177
+ margin-left: 4px;
1178
1178
  }
1179
1179
  }
1180
1180
 
@@ -2514,7 +2514,17 @@ $grid-checkmark-color: $grey-light-font !default;
2514
2514
  text-transform: $grid-header-text-transform;
2515
2515
  user-select: none;
2516
2516
  }
2517
-
2517
+
2518
+ .e-rightalign:not(.e-fltr-icon) .e-headercelldiv {
2519
+ padding: 0 .4em ;
2520
+ @if $grid-skin == 'fabric' {
2521
+ padding: 0 1px 0;
2522
+ }
2523
+ @if $grid-skin == 'highcontrast' {
2524
+ padding: 0;
2525
+ }
2526
+ }
2527
+
2518
2528
  .e-headercelldiv.e-headerchkcelldiv {
2519
2529
  overflow: visible;
2520
2530
  }
@@ -3016,6 +3026,9 @@ $grid-checkmark-color: $grey-light-font !default;
3016
3026
  right: 2px;
3017
3027
  }
3018
3028
  }
3029
+ &.e-rtl .e-sortfilter .e-rightalign .e-headercelldiv {
3030
+ padding: $grid-headercelldiv-right-align-padding;
3031
+ }
3019
3032
 
3020
3033
  .e-sortfilterdiv {
3021
3034
  float: right;
@@ -3062,7 +3075,7 @@ $grid-checkmark-color: $grey-light-font !default;
3062
3075
  }
3063
3076
 
3064
3077
  &.e-rtl .e-gridheader .e-sortfilter {
3065
- .e-centeralign.e-headercell[aria-sort="none"],
3078
+ .e-centeralign.e-headercell[aria-sort="none"]:not(.e-centeralign),
3066
3079
  .e-centeralign.e-headercell:not([aria-sort]) {
3067
3080
  .e-headercelldiv,
3068
3081
  .e-stackedheadercelldiv {
@@ -4415,6 +4428,9 @@ $grid-checkmark-color: $grey-light-font !default;
4415
4428
  .e-headercelldiv.e-headerchkcelldiv {
4416
4429
  padding: $grid-rtl-headercelldiv-padding;
4417
4430
  text-align: right;
4431
+ @if $grid-skin == 'highcontrast' {
4432
+ margin: -7px 0;
4433
+ }
4418
4434
 
4419
4435
  & .e-sortnumber {
4420
4436
  @include grid-flot-margin(left, $grid-fltr-rtl-sortnumber-margin);
@@ -4426,6 +4442,9 @@ $grid-checkmark-color: $grey-light-font !default;
4426
4442
  .e-headercelldiv.e-headerchkcelldiv {
4427
4443
  padding: $grid-rtl-headercelldiv-padding;
4428
4444
  text-align: right;
4445
+ @if $grid-skin == 'highcontrast' {
4446
+ margin: -7px 0;
4447
+ }
4429
4448
 
4430
4449
  & .e-sortnumber {
4431
4450
  @include grid-flot-margin(left, $grid-rtl-sortnumber-margin);
@@ -4446,9 +4465,6 @@ $grid-checkmark-color: $grey-light-font !default;
4446
4465
 
4447
4466
  & .e-sortnumber {
4448
4467
  margin: $grid-rtl-sort-num-left-align-margin;
4449
- @if $grid-skin == 'bootstrap4' {
4450
- margin: 4px -2px 0 0;
4451
- }
4452
4468
  }
4453
4469
  }
4454
4470
 
@@ -4467,7 +4483,7 @@ $grid-checkmark-color: $grey-light-font !default;
4467
4483
  }
4468
4484
 
4469
4485
  & .e-headercelldiv {
4470
- padding: 0 25px 0 .7em;
4486
+ padding: 0 1.6em 0 1.2em;
4471
4487
 
4472
4488
  & .e-sortnumber {
4473
4489
  @include grid-flot-margin(right, $grid-bigger-sort-right-margin);
@@ -266,9 +266,9 @@ $grid-summary-template-row-bg-color: '' !default;
266
266
  $grid-summary-row-bg-color: $grey-lighter !default;
267
267
  $grid-sortdiv-width: 16px !default;
268
268
  $grid-sortdiv-height: 16px !default;
269
- $grid-sortnumber-margin: 8px 8px 0 2px !default;
269
+ $grid-sortnumber-margin: 8px 10px 0 2px !default;
270
270
  $grid-fltr-sortnumber-margin: $grid-sortnumber-margin !default;
271
- $grid-fltr-sortnumber-rightalign-margin: 8px 0 0 20px !default;
271
+ $grid-fltr-sortnumber-rightalign-margin: 8px 0 0 10px !default;
272
272
  $grid-sortnumber-rightalign-margin: $grid-fltr-sortnumber-rightalign-margin !default;
273
273
  $grid-sortnumer-line-height: 15px !default;
274
274
  $grid-bigger-sortnumer-line-height: $grid-sortnumer-line-height !default;
@@ -340,9 +340,9 @@ $grid-rtl-headercelldiv-padding: 0 .4em 0 1.8em !default;
340
340
  $grid-rtl-headercelldiv-chkbox-padding: 0 .35em 0 .3em !default;
341
341
  $grid-bigger-rtl-headercelldiv-chkbox-padding: 0 .35em 0 .3em !default;
342
342
  $grid-ungroup-rtl-padding-right: -8px !default;
343
- $grid-headercelldiv-padding: 0 1.8em 0 .4em !default;
343
+ $grid-headercelldiv-padding: 0 .7em 0 .4em !default;
344
344
  $grid-headercelldiv-sort-centeralign-padding-right: .4em !default;
345
- $grid-headercell-div-padding: 0 .4em !default;
345
+ $grid-headercell-div-padding: 0 1.2em 0 .4em !default;
346
346
  $grid-group-text-width: auto !default;
347
347
  $grid-grouptopleftcell-border-top: 2px solid !default;
348
348
  $grid-group-caption-font-size: 14px !default;
@@ -509,10 +509,10 @@ $grid-rowcell-wrap-height: 18px !default;
509
509
  $grid-rowcell-autofill-top-height: 16px !default;
510
510
  $grid-rowcell-autofill-top-bottom-height: 14px !default;
511
511
  $grid-rowcell-wrap-max-height: 36px !default;
512
- $grid-bigger-fltr-sortnumber-rightalign-margin: 8px 0 0 12px !default;
512
+ $grid-bigger-fltr-sortnumber-rightalign-margin: 8px 2px 0 3px !default;
513
513
  $grid-bigger-sortnumber-rightalign-margin: 7px 0 0 20px !default;
514
514
  $grid-bigger-columnmenu-bottom: 16px !default;
515
- $grid-bigger-sortnumber-margin: 7px 0 0 2px !default;
515
+ $grid-bigger-sortnumber-margin: 7px 6px 0 2px !default;
516
516
  $grid-bigger-fltr-sortnumber-margin: $grid-bigger-sortnumber-margin !default;
517
517
  $grid-rtl-searchclear: 0 !default;
518
518
  $grid-column-chosser-searchdiv-top: -46px !default;
@@ -598,7 +598,7 @@ $grid-responsive-apply-btn-top: 3px !default;
598
598
  $grid-responsive-column-menu-icon-margin-top: 0 !default;
599
599
  $grid-rtl-headercelldiv-left-align-margin: 10px !default;
600
600
  $grid-rtl-filtermenudiv-left-align-margin: -5px !default;
601
- $grid-rtl-sort-num-left-align-margin: 8px -6px 0 0 !default;
601
+ $grid-rtl-sort-num-left-align-margin: 8px -6px 0 2px !default;
602
602
  $grid-frozen-mac-scrollbar-background: rgba(0, 0, 0, .5) !default;
603
603
  $grid-rowcell-color: rgba($grid-content-font-color, $grid-conent-font-opacity) !default;
604
604
  $grid-reorderarrow-margin-top: -6.5px !default;
@@ -1173,7 +1173,7 @@ $grid-checkmark-color: $grey !default;
1173
1173
  .e-headercell.e-fltr-icon .e-headercelldiv .e-sortnumber {
1174
1174
  margin: $grid-rtl-bigger-sortnumber-withfilter-margin;
1175
1175
  @if $grid-skin == 'tailwind' {
1176
- margin-left: 0;
1176
+ margin-left: 4px;
1177
1177
  }
1178
1178
  }
1179
1179
 
@@ -2513,7 +2513,17 @@ $grid-checkmark-color: $grey !default;
2513
2513
  text-transform: $grid-header-text-transform;
2514
2514
  user-select: none;
2515
2515
  }
2516
-
2516
+
2517
+ .e-rightalign:not(.e-fltr-icon) .e-headercelldiv {
2518
+ padding: 0 .4em ;
2519
+ @if $grid-skin == 'fabric' {
2520
+ padding: 0 1px 0;
2521
+ }
2522
+ @if $grid-skin == 'highcontrast' {
2523
+ padding: 0;
2524
+ }
2525
+ }
2526
+
2517
2527
  .e-headercelldiv.e-headerchkcelldiv {
2518
2528
  overflow: visible;
2519
2529
  }
@@ -3015,6 +3025,9 @@ $grid-checkmark-color: $grey !default;
3015
3025
  right: 2px;
3016
3026
  }
3017
3027
  }
3028
+ &.e-rtl .e-sortfilter .e-rightalign .e-headercelldiv {
3029
+ padding: $grid-headercelldiv-right-align-padding;
3030
+ }
3018
3031
 
3019
3032
  .e-sortfilterdiv {
3020
3033
  float: right;
@@ -3061,7 +3074,7 @@ $grid-checkmark-color: $grey !default;
3061
3074
  }
3062
3075
 
3063
3076
  &.e-rtl .e-gridheader .e-sortfilter {
3064
- .e-centeralign.e-headercell[aria-sort="none"],
3077
+ .e-centeralign.e-headercell[aria-sort="none"]:not(.e-centeralign),
3065
3078
  .e-centeralign.e-headercell:not([aria-sort]) {
3066
3079
  .e-headercelldiv,
3067
3080
  .e-stackedheadercelldiv {
@@ -4414,6 +4427,9 @@ $grid-checkmark-color: $grey !default;
4414
4427
  .e-headercelldiv.e-headerchkcelldiv {
4415
4428
  padding: $grid-rtl-headercelldiv-padding;
4416
4429
  text-align: right;
4430
+ @if $grid-skin == 'highcontrast' {
4431
+ margin: -7px 0;
4432
+ }
4417
4433
 
4418
4434
  & .e-sortnumber {
4419
4435
  @include grid-flot-margin(left, $grid-fltr-rtl-sortnumber-margin);
@@ -4425,6 +4441,9 @@ $grid-checkmark-color: $grey !default;
4425
4441
  .e-headercelldiv.e-headerchkcelldiv {
4426
4442
  padding: $grid-rtl-headercelldiv-padding;
4427
4443
  text-align: right;
4444
+ @if $grid-skin == 'highcontrast' {
4445
+ margin: -7px 0;
4446
+ }
4428
4447
 
4429
4448
  & .e-sortnumber {
4430
4449
  @include grid-flot-margin(left, $grid-rtl-sortnumber-margin);
@@ -4445,9 +4464,6 @@ $grid-checkmark-color: $grey !default;
4445
4464
 
4446
4465
  & .e-sortnumber {
4447
4466
  margin: $grid-rtl-sort-num-left-align-margin;
4448
- @if $grid-skin == 'bootstrap4' {
4449
- margin: 4px -2px 0 0;
4450
- }
4451
4467
  }
4452
4468
  }
4453
4469
 
@@ -4466,7 +4482,7 @@ $grid-checkmark-color: $grey !default;
4466
4482
  }
4467
4483
 
4468
4484
  & .e-headercelldiv {
4469
- padding: 0 25px 0 .7em;
4485
+ padding: 0 1.6em 0 1.2em;
4470
4486
 
4471
4487
  & .e-sortnumber {
4472
4488
  @include grid-flot-margin(right, $grid-bigger-sort-right-margin);
@@ -268,9 +268,9 @@ $grid-summary-template-row-bg-color: '' !default;
268
268
  $grid-summary-row-bg-color: $gray-100 !default;
269
269
  $grid-sortdiv-width: 16px !default;
270
270
  $grid-sortdiv-height: 16px !default;
271
- $grid-sortnumber-margin: 2px -6px 0 0 !default;
271
+ $grid-sortnumber-margin: 2px 0 0 0 !default;
272
272
  $grid-fltr-sortnumber-margin: $grid-sortnumber-margin !default;
273
- $grid-fltr-sortnumber-rightalign-margin: 2px 8px 0 8px !default;
273
+ $grid-fltr-sortnumber-rightalign-margin: 2px 8px 0 4px !default;
274
274
  $grid-sortnumber-rightalign-margin: $grid-fltr-sortnumber-rightalign-margin !default;
275
275
  $grid-sortnumer-line-height: 16px !default;
276
276
  $grid-bigger-sortnumer-line-height: $grid-sortnumer-line-height !default;
@@ -342,9 +342,9 @@ $grid-rtl-headercelldiv-padding: 0 .4em 0 1.8em !default;
342
342
  $grid-rtl-headercelldiv-chkbox-padding: 0 .35em 0 .3em !default;
343
343
  $grid-bigger-rtl-headercelldiv-chkbox-padding: 0 .35em 0 .3em !default;
344
344
  $grid-ungroup-rtl-padding-right: -10px !default;
345
- $grid-headercelldiv-padding: 0 20px 0 5px !default;
345
+ $grid-headercelldiv-padding: 0 10px 0 5px !default;
346
346
  $grid-headercelldiv-sort-centeralign-padding-right: 5px !default;
347
- $grid-headercell-div-padding: 0 .4em !default;
347
+ $grid-headercell-div-padding: 0 1.1em 0 .4em !default;
348
348
  $grid-group-text-width: auto !default;
349
349
  $grid-grouptopleftcell-border-top: 2px solid !default;
350
350
  $grid-group-caption-font-size: 14px !default;
@@ -517,10 +517,10 @@ $grid-rowcell-wrap-height: 21px !default;
517
517
  $grid-rowcell-autofill-top-height: 19px !default;
518
518
  $grid-rowcell-autofill-top-bottom-height: 17px !default;
519
519
  $grid-rowcell-wrap-max-height: 36px !default;
520
- $grid-bigger-fltr-sortnumber-rightalign-margin: 4px 0 0 10px !default;
520
+ $grid-bigger-fltr-sortnumber-rightalign-margin: 4px 2px 0 4px !default;
521
521
  $grid-bigger-sortnumber-rightalign-margin: 4px 0 0 10px !default;
522
522
  $grid-bigger-columnmenu-bottom: 13px !default;
523
- $grid-bigger-sortnumber-margin: 4px 5px 0 2px !default;
523
+ $grid-bigger-sortnumber-margin: 4px 8px 0 2px !default;
524
524
  $grid-bigger-fltr-sortnumber-margin: $grid-bigger-sortnumber-margin !default;
525
525
  $grid-rtl-searchclear: 0 !default;
526
526
  $grid-column-chosser-searchdiv-top: -44px !default;
@@ -605,7 +605,7 @@ $grid-responsive-apply-btn-top: 7px !default;
605
605
  $grid-responsive-column-menu-icon-margin-top: 4px !default;
606
606
  $grid-rtl-headercelldiv-left-align-margin: 10px !default;
607
607
  $grid-rtl-filtermenudiv-left-align-margin: -5px !default;
608
- $grid-rtl-sort-num-left-align-margin: 2px -2px 0 0 !default;
608
+ $grid-rtl-sort-num-left-align-margin: 2px -2px 0 2px !default;
609
609
  $grid-frozen-mac-scrollbar-background: rgba(0, 0, 0, .5) !default;
610
610
  $grid-rowcell-color: $grid-content-font-color !default;
611
611
  $grid-reorderarrow-margin-top: -7.5px !default;
@@ -1180,7 +1180,7 @@ $grid-checkmark-color: $white !default;
1180
1180
  .e-headercell.e-fltr-icon .e-headercelldiv .e-sortnumber {
1181
1181
  margin: $grid-rtl-bigger-sortnumber-withfilter-margin;
1182
1182
  @if $grid-skin == 'tailwind' {
1183
- margin-left: 0;
1183
+ margin-left: 4px;
1184
1184
  }
1185
1185
  }
1186
1186
 
@@ -2520,7 +2520,17 @@ $grid-checkmark-color: $white !default;
2520
2520
  text-transform: $grid-header-text-transform;
2521
2521
  user-select: none;
2522
2522
  }
2523
-
2523
+
2524
+ .e-rightalign:not(.e-fltr-icon) .e-headercelldiv {
2525
+ padding: 0 .4em ;
2526
+ @if $grid-skin == 'fabric' {
2527
+ padding: 0 1px 0;
2528
+ }
2529
+ @if $grid-skin == 'highcontrast' {
2530
+ padding: 0;
2531
+ }
2532
+ }
2533
+
2524
2534
  .e-headercelldiv.e-headerchkcelldiv {
2525
2535
  overflow: visible;
2526
2536
  }
@@ -3022,6 +3032,9 @@ $grid-checkmark-color: $white !default;
3022
3032
  right: 2px;
3023
3033
  }
3024
3034
  }
3035
+ &.e-rtl .e-sortfilter .e-rightalign .e-headercelldiv {
3036
+ padding: $grid-headercelldiv-right-align-padding;
3037
+ }
3025
3038
 
3026
3039
  .e-sortfilterdiv {
3027
3040
  float: right;
@@ -3068,7 +3081,7 @@ $grid-checkmark-color: $white !default;
3068
3081
  }
3069
3082
 
3070
3083
  &.e-rtl .e-gridheader .e-sortfilter {
3071
- .e-centeralign.e-headercell[aria-sort="none"],
3084
+ .e-centeralign.e-headercell[aria-sort="none"]:not(.e-centeralign),
3072
3085
  .e-centeralign.e-headercell:not([aria-sort]) {
3073
3086
  .e-headercelldiv,
3074
3087
  .e-stackedheadercelldiv {
@@ -4421,6 +4434,9 @@ $grid-checkmark-color: $white !default;
4421
4434
  .e-headercelldiv.e-headerchkcelldiv {
4422
4435
  padding: $grid-rtl-headercelldiv-padding;
4423
4436
  text-align: right;
4437
+ @if $grid-skin == 'highcontrast' {
4438
+ margin: -7px 0;
4439
+ }
4424
4440
 
4425
4441
  & .e-sortnumber {
4426
4442
  @include grid-flot-margin(left, $grid-fltr-rtl-sortnumber-margin);
@@ -4432,6 +4448,9 @@ $grid-checkmark-color: $white !default;
4432
4448
  .e-headercelldiv.e-headerchkcelldiv {
4433
4449
  padding: $grid-rtl-headercelldiv-padding;
4434
4450
  text-align: right;
4451
+ @if $grid-skin == 'highcontrast' {
4452
+ margin: -7px 0;
4453
+ }
4435
4454
 
4436
4455
  & .e-sortnumber {
4437
4456
  @include grid-flot-margin(left, $grid-rtl-sortnumber-margin);
@@ -4452,9 +4471,6 @@ $grid-checkmark-color: $white !default;
4452
4471
 
4453
4472
  & .e-sortnumber {
4454
4473
  margin: $grid-rtl-sort-num-left-align-margin;
4455
- @if $grid-skin == 'bootstrap4' {
4456
- margin: 4px -2px 0 0;
4457
- }
4458
4474
  }
4459
4475
  }
4460
4476
 
@@ -4473,7 +4489,7 @@ $grid-checkmark-color: $white !default;
4473
4489
  }
4474
4490
 
4475
4491
  & .e-headercelldiv {
4476
- padding: 0 25px 0 .7em;
4492
+ padding: 0 1.6em 0 1.2em;
4477
4493
 
4478
4494
  & .e-sortnumber {
4479
4495
  @include grid-flot-margin(right, $grid-bigger-sort-right-margin);
@@ -110,7 +110,7 @@ $grid-columnchooser-input-padding-left: 4px !default;
110
110
  $grid-columnchooser-ul-margin: 13px 0 !default;
111
111
  $grid-column-chooser-dlg-footer-padding: 8px !default;
112
112
  $grid-rtl-bigger-sortnumber-margin: 4px 0 0 -20px !default;
113
- $grid-rtl-bigger-sortnumber-withfilter-margin: 2px 0 0 4px !default;
113
+ $grid-rtl-bigger-sortnumber-withfilter-margin: 2px 0 0 11px !default;
114
114
  $grid-rtl-bigger-rightalign-sortnumber-margin: 3px 0 0 8px !default;
115
115
  $grid-rtl-group-text-marign-right: 0 !default;
116
116
  $grid-rtl-group-text-margin-right: 0 !default;
@@ -266,7 +266,7 @@ $grid-sortdiv-width: 18px !default;
266
266
  $grid-sortdiv-height: 18px !default;
267
267
  $grid-sortnumber-margin: 2px 10px 1px 8px !default;
268
268
  $grid-fltr-sortnumber-margin: 2px 8px 1px 8px !default;
269
- $grid-fltr-sortnumber-rightalign-margin: 2px 8px 0 10px !default;
269
+ $grid-fltr-sortnumber-rightalign-margin: 2px 8px 0 3px !default;
270
270
  $grid-sortnumber-rightalign-margin: 2px 8px 0 10px !default;
271
271
  $grid-sortnumer-line-height: 14px !default;
272
272
  $grid-bigger-sortnumer-line-height: 16px !default;
@@ -322,9 +322,9 @@ $grid-ungroup-rtl-padding-top: 2px !default;
322
322
  $grid-bigger-ungroup-rtl-padding-top: $grid-ungroup-rtl-padding-top !default;
323
323
  $grid-rtl-group-headercell-margin-right: 5px !default;
324
324
  $grid-rtl-group-headercell-margin-left: 0 !default;
325
- $grid-fltr-rtl-sortnumber-margin: 1px 0 0 12px !default;
325
+ $grid-fltr-rtl-sortnumber-margin: 1px 0 0 15px !default;
326
326
  $grid-rtl-sortnumber-margin: 1px 0 0 -10px !default;
327
- $grid-fltr-rtl-sortnumber-rightalign-margin: 1px 0 0 12px !default;
327
+ $grid-fltr-rtl-sortnumber-rightalign-margin: 1px 0 0 15px !default;
328
328
  $grid-rtl-sortnumber-rightalign-margin: 1px 0 0 10px !default;
329
329
  $grid-rtl-sortcelldiv-margin: -10px 8px -12px -2px !default;
330
330
  $grid-rtl-sortcelldiv-right-align-margin: -10px 8px -12px -2px !default;
@@ -334,13 +334,13 @@ $grid-rtl-grouped-headercell-padding: 5px 0 !default;
334
334
  $grid-rtl-group-text-margin-left: 0 !default;
335
335
  $grid-rtl-group-sorticon-margin-right: -7px !default;
336
336
  $grid-rtl-headercell-border-width: 0 !default;
337
- $grid-rtl-headercelldiv-padding: 0 .4em 0 2.8em !default;
337
+ $grid-rtl-headercelldiv-padding: 0 .4em 0 2em !default;
338
338
  $grid-rtl-headercelldiv-chkbox-padding: 0 .45em 0 .5em !default;
339
339
  $grid-bigger-rtl-headercelldiv-chkbox-padding: 0 .45em 0 .5em !default;
340
340
  $grid-ungroup-rtl-padding-right: -9px !default;
341
- $grid-headercelldiv-padding: 0 20px 0 5px !default;
341
+ $grid-headercelldiv-padding: 0 10px 0 5px !default;
342
342
  $grid-headercelldiv-sort-centeralign-padding-right: 5px !default;
343
- $grid-headercell-div-padding: 0 .4em !default;
343
+ $grid-headercell-div-padding: 0 1.5em 0 .4em !default;
344
344
  $grid-group-text-width: auto !default;
345
345
  $grid-grouptopleftcell-border-top: 2px solid !default;
346
346
  $grid-group-caption-font-size: $text-sm !default;
@@ -504,11 +504,11 @@ $grid-rowcell-wrap-height: 21px !default;
504
504
  $grid-rowcell-autofill-top-height: 19px !default;
505
505
  $grid-rowcell-autofill-top-bottom-height: 17px !default;
506
506
  $grid-rowcell-wrap-max-height: 36px !default;
507
- $grid-bigger-fltr-sortnumber-rightalign-margin: 2px 4px 0 -6px !default;
507
+ $grid-bigger-fltr-sortnumber-rightalign-margin: 2px 4px 0 -11px !default;
508
508
  $grid-bigger-sortnumber-rightalign-margin: 2px 4px 0 6px !default;
509
509
  $grid-bigger-columnmenu-bottom: 13px !default;
510
510
  $grid-bigger-sortnumber-margin: 2px 4px 0 4px !default;
511
- $grid-bigger-fltr-sortnumber-margin: 2px 4px 0 -6px !default;
511
+ $grid-bigger-fltr-sortnumber-margin: 2px 4px 0 0 !default;
512
512
  $grid-rtl-searchclear: 0 !default;
513
513
  $grid-column-chosser-searchdiv-top: -41px !default;
514
514
  $grid-reorderarrow-font-size: $text-xxs !default;
@@ -592,7 +592,7 @@ $grid-responsive-apply-btn-top: 4px !default;
592
592
  $grid-responsive-column-menu-icon-margin-top: 4px !default;
593
593
  $grid-rtl-headercelldiv-left-align-margin: 10px !default;
594
594
  $grid-rtl-filtermenudiv-left-align-margin: -2px !default;
595
- $grid-rtl-sort-num-left-align-margin: 2px 8px 0 0 !default;
595
+ $grid-rtl-sort-num-left-align-margin: 2px 8px 0 2px !default;
596
596
  $grid-frozen-mac-scrollbar-background: rgba(0, 0, 0, .5) !default;
597
597
  $grid-rowcell-color: $content-text-color !default;
598
598
  $grid-header-text-transform: none !default;
@@ -1173,7 +1173,7 @@ $grid-checkmark-color: $primary-text-color !default;
1173
1173
  .e-headercell.e-fltr-icon .e-headercelldiv .e-sortnumber {
1174
1174
  margin: $grid-rtl-bigger-sortnumber-withfilter-margin;
1175
1175
  @if $grid-skin == 'tailwind' {
1176
- margin-left: 0;
1176
+ margin-left: 4px;
1177
1177
  }
1178
1178
  }
1179
1179
 
@@ -2513,7 +2513,17 @@ $grid-checkmark-color: $primary-text-color !default;
2513
2513
  text-transform: $grid-header-text-transform;
2514
2514
  user-select: none;
2515
2515
  }
2516
-
2516
+
2517
+ .e-rightalign:not(.e-fltr-icon) .e-headercelldiv {
2518
+ padding: 0 .4em ;
2519
+ @if $grid-skin == 'fabric' {
2520
+ padding: 0 1px 0;
2521
+ }
2522
+ @if $grid-skin == 'highcontrast' {
2523
+ padding: 0;
2524
+ }
2525
+ }
2526
+
2517
2527
  .e-headercelldiv.e-headerchkcelldiv {
2518
2528
  overflow: visible;
2519
2529
  }
@@ -3015,6 +3025,9 @@ $grid-checkmark-color: $primary-text-color !default;
3015
3025
  right: 2px;
3016
3026
  }
3017
3027
  }
3028
+ &.e-rtl .e-sortfilter .e-rightalign .e-headercelldiv {
3029
+ padding: $grid-headercelldiv-right-align-padding;
3030
+ }
3018
3031
 
3019
3032
  .e-sortfilterdiv {
3020
3033
  float: right;
@@ -3061,7 +3074,7 @@ $grid-checkmark-color: $primary-text-color !default;
3061
3074
  }
3062
3075
 
3063
3076
  &.e-rtl .e-gridheader .e-sortfilter {
3064
- .e-centeralign.e-headercell[aria-sort="none"],
3077
+ .e-centeralign.e-headercell[aria-sort="none"]:not(.e-centeralign),
3065
3078
  .e-centeralign.e-headercell:not([aria-sort]) {
3066
3079
  .e-headercelldiv,
3067
3080
  .e-stackedheadercelldiv {
@@ -4414,6 +4427,9 @@ $grid-checkmark-color: $primary-text-color !default;
4414
4427
  .e-headercelldiv.e-headerchkcelldiv {
4415
4428
  padding: $grid-rtl-headercelldiv-padding;
4416
4429
  text-align: right;
4430
+ @if $grid-skin == 'highcontrast' {
4431
+ margin: -7px 0;
4432
+ }
4417
4433
 
4418
4434
  & .e-sortnumber {
4419
4435
  @include grid-flot-margin(left, $grid-fltr-rtl-sortnumber-margin);
@@ -4425,6 +4441,9 @@ $grid-checkmark-color: $primary-text-color !default;
4425
4441
  .e-headercelldiv.e-headerchkcelldiv {
4426
4442
  padding: $grid-rtl-headercelldiv-padding;
4427
4443
  text-align: right;
4444
+ @if $grid-skin == 'highcontrast' {
4445
+ margin: -7px 0;
4446
+ }
4428
4447
 
4429
4448
  & .e-sortnumber {
4430
4449
  @include grid-flot-margin(left, $grid-rtl-sortnumber-margin);
@@ -4445,9 +4464,6 @@ $grid-checkmark-color: $primary-text-color !default;
4445
4464
 
4446
4465
  & .e-sortnumber {
4447
4466
  margin: $grid-rtl-sort-num-left-align-margin;
4448
- @if $grid-skin == 'bootstrap4' {
4449
- margin: 4px -2px 0 0;
4450
- }
4451
4467
  }
4452
4468
  }
4453
4469
 
@@ -4466,7 +4482,7 @@ $grid-checkmark-color: $primary-text-color !default;
4466
4482
  }
4467
4483
 
4468
4484
  & .e-headercelldiv {
4469
- padding: 0 25px 0 .7em;
4485
+ padding: 0 1.6em 0 1.2em;
4470
4486
 
4471
4487
  & .e-sortnumber {
4472
4488
  @include grid-flot-margin(right, $grid-bigger-sort-right-margin);