@syncfusion/blazor-themes 20.4.44 → 20.4.48

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 (160) hide show
  1. package/SCSS-Themes/bootstrap-dark.scss +86 -46
  2. package/SCSS-Themes/bootstrap.scss +86 -46
  3. package/SCSS-Themes/bootstrap4.scss +87 -47
  4. package/SCSS-Themes/bootstrap5-dark.scss +87 -47
  5. package/SCSS-Themes/bootstrap5.scss +87 -47
  6. package/SCSS-Themes/buttons/check-box/bootstrap-dark.scss +4 -0
  7. package/SCSS-Themes/buttons/check-box/bootstrap.scss +4 -0
  8. package/SCSS-Themes/buttons/check-box/bootstrap4.scss +4 -0
  9. package/SCSS-Themes/buttons/check-box/bootstrap5-dark.scss +4 -0
  10. package/SCSS-Themes/buttons/check-box/bootstrap5.scss +4 -0
  11. package/SCSS-Themes/buttons/check-box/fabric-dark.scss +4 -0
  12. package/SCSS-Themes/buttons/check-box/fabric.scss +4 -0
  13. package/SCSS-Themes/buttons/check-box/fluent-dark.scss +4 -0
  14. package/SCSS-Themes/buttons/check-box/fluent.scss +4 -0
  15. package/SCSS-Themes/buttons/check-box/highcontrast.scss +4 -0
  16. package/SCSS-Themes/buttons/check-box/material-dark.scss +4 -0
  17. package/SCSS-Themes/buttons/check-box/material.scss +4 -0
  18. package/SCSS-Themes/buttons/check-box/tailwind-dark.scss +4 -0
  19. package/SCSS-Themes/buttons/check-box/tailwind.scss +4 -0
  20. package/SCSS-Themes/dropdowns/multi-select/bootstrap-dark.scss +3 -2
  21. package/SCSS-Themes/dropdowns/multi-select/bootstrap.scss +3 -2
  22. package/SCSS-Themes/dropdowns/multi-select/bootstrap4.scss +3 -2
  23. package/SCSS-Themes/dropdowns/multi-select/bootstrap5-dark.scss +3 -2
  24. package/SCSS-Themes/dropdowns/multi-select/bootstrap5.scss +3 -2
  25. package/SCSS-Themes/dropdowns/multi-select/fabric-dark.scss +3 -2
  26. package/SCSS-Themes/dropdowns/multi-select/fabric.scss +3 -2
  27. package/SCSS-Themes/dropdowns/multi-select/fluent-dark.scss +3 -2
  28. package/SCSS-Themes/dropdowns/multi-select/fluent.scss +3 -2
  29. package/SCSS-Themes/dropdowns/multi-select/highcontrast.scss +3 -2
  30. package/SCSS-Themes/dropdowns/multi-select/material-dark.scss +3 -2
  31. package/SCSS-Themes/dropdowns/multi-select/material.scss +3 -2
  32. package/SCSS-Themes/dropdowns/multi-select/tailwind-dark.scss +3 -2
  33. package/SCSS-Themes/dropdowns/multi-select/tailwind.scss +3 -2
  34. package/SCSS-Themes/fabric-dark.scss +86 -46
  35. package/SCSS-Themes/fabric.scss +86 -46
  36. package/SCSS-Themes/fluent-dark.scss +87 -47
  37. package/SCSS-Themes/fluent.scss +87 -47
  38. package/SCSS-Themes/grids/grid/bootstrap-dark.scss +12 -0
  39. package/SCSS-Themes/grids/grid/bootstrap.scss +12 -0
  40. package/SCSS-Themes/grids/grid/bootstrap4.scss +12 -0
  41. package/SCSS-Themes/grids/grid/bootstrap5-dark.scss +12 -0
  42. package/SCSS-Themes/grids/grid/bootstrap5.scss +12 -0
  43. package/SCSS-Themes/grids/grid/fabric-dark.scss +12 -0
  44. package/SCSS-Themes/grids/grid/fabric.scss +12 -0
  45. package/SCSS-Themes/grids/grid/fluent-dark.scss +12 -0
  46. package/SCSS-Themes/grids/grid/fluent.scss +12 -0
  47. package/SCSS-Themes/grids/grid/highcontrast.scss +12 -0
  48. package/SCSS-Themes/grids/grid/material-dark.scss +12 -0
  49. package/SCSS-Themes/grids/grid/material.scss +12 -0
  50. package/SCSS-Themes/grids/grid/tailwind-dark.scss +12 -0
  51. package/SCSS-Themes/grids/grid/tailwind.scss +12 -0
  52. package/SCSS-Themes/highcontrast.scss +86 -46
  53. package/SCSS-Themes/image-editor/image-editor/bootstrap-dark.scss +6 -0
  54. package/SCSS-Themes/image-editor/image-editor/bootstrap.scss +6 -0
  55. package/SCSS-Themes/image-editor/image-editor/bootstrap4.scss +6 -0
  56. package/SCSS-Themes/image-editor/image-editor/bootstrap5-dark.scss +6 -0
  57. package/SCSS-Themes/image-editor/image-editor/bootstrap5.scss +6 -0
  58. package/SCSS-Themes/image-editor/image-editor/fabric-dark.scss +6 -0
  59. package/SCSS-Themes/image-editor/image-editor/fabric.scss +6 -0
  60. package/SCSS-Themes/image-editor/image-editor/fluent-dark.scss +6 -0
  61. package/SCSS-Themes/image-editor/image-editor/fluent.scss +6 -0
  62. package/SCSS-Themes/image-editor/image-editor/highcontrast.scss +6 -0
  63. package/SCSS-Themes/image-editor/image-editor/material-dark.scss +6 -0
  64. package/SCSS-Themes/image-editor/image-editor/material.scss +6 -0
  65. package/SCSS-Themes/image-editor/image-editor/tailwind-dark.scss +6 -0
  66. package/SCSS-Themes/image-editor/image-editor/tailwind.scss +6 -0
  67. package/SCSS-Themes/inputs/color-picker/bootstrap-dark.scss +14 -0
  68. package/SCSS-Themes/inputs/color-picker/bootstrap.scss +14 -0
  69. package/SCSS-Themes/inputs/color-picker/bootstrap4.scss +14 -0
  70. package/SCSS-Themes/inputs/color-picker/bootstrap5-dark.scss +14 -0
  71. package/SCSS-Themes/inputs/color-picker/bootstrap5.scss +14 -0
  72. package/SCSS-Themes/inputs/color-picker/fabric-dark.scss +14 -0
  73. package/SCSS-Themes/inputs/color-picker/fabric.scss +14 -0
  74. package/SCSS-Themes/inputs/color-picker/fluent-dark.scss +14 -0
  75. package/SCSS-Themes/inputs/color-picker/fluent.scss +14 -0
  76. package/SCSS-Themes/inputs/color-picker/highcontrast.scss +14 -0
  77. package/SCSS-Themes/inputs/color-picker/material-dark.scss +14 -0
  78. package/SCSS-Themes/inputs/color-picker/material.scss +14 -0
  79. package/SCSS-Themes/inputs/color-picker/tailwind-dark.scss +14 -0
  80. package/SCSS-Themes/inputs/color-picker/tailwind.scss +14 -0
  81. package/SCSS-Themes/material-dark.scss +86 -46
  82. package/SCSS-Themes/material.scss +86 -46
  83. package/SCSS-Themes/navigations/context-menu/bootstrap-dark.scss +16 -12
  84. package/SCSS-Themes/navigations/context-menu/bootstrap.scss +16 -12
  85. package/SCSS-Themes/navigations/context-menu/bootstrap4.scss +16 -12
  86. package/SCSS-Themes/navigations/context-menu/bootstrap5-dark.scss +16 -12
  87. package/SCSS-Themes/navigations/context-menu/bootstrap5.scss +16 -12
  88. package/SCSS-Themes/navigations/context-menu/fabric-dark.scss +16 -12
  89. package/SCSS-Themes/navigations/context-menu/fabric.scss +16 -12
  90. package/SCSS-Themes/navigations/context-menu/fluent-dark.scss +16 -12
  91. package/SCSS-Themes/navigations/context-menu/fluent.scss +16 -12
  92. package/SCSS-Themes/navigations/context-menu/highcontrast.scss +16 -12
  93. package/SCSS-Themes/navigations/context-menu/material-dark.scss +16 -12
  94. package/SCSS-Themes/navigations/context-menu/material.scss +16 -12
  95. package/SCSS-Themes/navigations/context-menu/tailwind-dark.scss +16 -12
  96. package/SCSS-Themes/navigations/context-menu/tailwind.scss +16 -12
  97. package/SCSS-Themes/navigations/treeview/bootstrap4.scss +1 -1
  98. package/SCSS-Themes/navigations/treeview/bootstrap5-dark.scss +1 -1
  99. package/SCSS-Themes/navigations/treeview/bootstrap5.scss +1 -1
  100. package/SCSS-Themes/pivotview/pivotview/bootstrap-dark.scss +23 -27
  101. package/SCSS-Themes/pivotview/pivotview/bootstrap.scss +23 -27
  102. package/SCSS-Themes/pivotview/pivotview/bootstrap4.scss +23 -27
  103. package/SCSS-Themes/pivotview/pivotview/bootstrap5-dark.scss +23 -27
  104. package/SCSS-Themes/pivotview/pivotview/bootstrap5.scss +23 -27
  105. package/SCSS-Themes/pivotview/pivotview/fabric-dark.scss +23 -27
  106. package/SCSS-Themes/pivotview/pivotview/fabric.scss +23 -27
  107. package/SCSS-Themes/pivotview/pivotview/fluent-dark.scss +23 -27
  108. package/SCSS-Themes/pivotview/pivotview/fluent.scss +23 -27
  109. package/SCSS-Themes/pivotview/pivotview/highcontrast.scss +23 -27
  110. package/SCSS-Themes/pivotview/pivotview/material-dark.scss +23 -27
  111. package/SCSS-Themes/pivotview/pivotview/material.scss +23 -27
  112. package/SCSS-Themes/pivotview/pivotview/tailwind-dark.scss +23 -27
  113. package/SCSS-Themes/pivotview/pivotview/tailwind.scss +23 -27
  114. package/SCSS-Themes/popups/dialog/fluent-dark.scss +1 -1
  115. package/SCSS-Themes/popups/dialog/fluent.scss +1 -1
  116. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap-dark.scss +4 -4
  117. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap.scss +4 -4
  118. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap4.scss +4 -4
  119. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap5-dark.scss +4 -4
  120. package/SCSS-Themes/richtexteditor/rich-text-editor/bootstrap5.scss +4 -4
  121. package/SCSS-Themes/richtexteditor/rich-text-editor/fabric-dark.scss +4 -4
  122. package/SCSS-Themes/richtexteditor/rich-text-editor/fabric.scss +4 -4
  123. package/SCSS-Themes/richtexteditor/rich-text-editor/fluent-dark.scss +4 -4
  124. package/SCSS-Themes/richtexteditor/rich-text-editor/fluent.scss +4 -4
  125. package/SCSS-Themes/richtexteditor/rich-text-editor/highcontrast.scss +4 -4
  126. package/SCSS-Themes/richtexteditor/rich-text-editor/material-dark.scss +4 -4
  127. package/SCSS-Themes/richtexteditor/rich-text-editor/material.scss +4 -4
  128. package/SCSS-Themes/richtexteditor/rich-text-editor/tailwind-dark.scss +4 -4
  129. package/SCSS-Themes/richtexteditor/rich-text-editor/tailwind.scss +4 -4
  130. package/SCSS-Themes/schedule/schedule/bootstrap-dark.scss +1 -1
  131. package/SCSS-Themes/schedule/schedule/bootstrap.scss +1 -1
  132. package/SCSS-Themes/schedule/schedule/bootstrap4.scss +1 -1
  133. package/SCSS-Themes/schedule/schedule/bootstrap5-dark.scss +1 -1
  134. package/SCSS-Themes/schedule/schedule/bootstrap5.scss +1 -1
  135. package/SCSS-Themes/schedule/schedule/fabric-dark.scss +1 -1
  136. package/SCSS-Themes/schedule/schedule/fabric.scss +1 -1
  137. package/SCSS-Themes/schedule/schedule/fluent-dark.scss +1 -1
  138. package/SCSS-Themes/schedule/schedule/fluent.scss +1 -1
  139. package/SCSS-Themes/schedule/schedule/highcontrast.scss +1 -1
  140. package/SCSS-Themes/schedule/schedule/material-dark.scss +1 -1
  141. package/SCSS-Themes/schedule/schedule/material.scss +1 -1
  142. package/SCSS-Themes/schedule/schedule/tailwind-dark.scss +1 -1
  143. package/SCSS-Themes/schedule/schedule/tailwind.scss +1 -1
  144. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap-dark.scss +3 -0
  145. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap.scss +3 -0
  146. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap4.scss +3 -0
  147. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5-dark.scss +3 -0
  148. package/SCSS-Themes/splitbuttons/drop-down-button/bootstrap5.scss +3 -0
  149. package/SCSS-Themes/splitbuttons/drop-down-button/fabric-dark.scss +3 -0
  150. package/SCSS-Themes/splitbuttons/drop-down-button/fabric.scss +3 -0
  151. package/SCSS-Themes/splitbuttons/drop-down-button/fluent-dark.scss +3 -0
  152. package/SCSS-Themes/splitbuttons/drop-down-button/fluent.scss +3 -0
  153. package/SCSS-Themes/splitbuttons/drop-down-button/highcontrast.scss +3 -0
  154. package/SCSS-Themes/splitbuttons/drop-down-button/material-dark.scss +3 -0
  155. package/SCSS-Themes/splitbuttons/drop-down-button/material.scss +3 -0
  156. package/SCSS-Themes/splitbuttons/drop-down-button/tailwind-dark.scss +3 -0
  157. package/SCSS-Themes/splitbuttons/drop-down-button/tailwind.scss +3 -0
  158. package/SCSS-Themes/tailwind-dark.scss +86 -46
  159. package/SCSS-Themes/tailwind.scss +86 -46
  160. package/package.json +1 -1
@@ -27320,6 +27320,10 @@ $cbox-icon-color: $icon-color !default;
27320
27320
  }
27321
27321
  }
27322
27322
 
27323
+ .e-checkbox-wrapper[readonly] {
27324
+ pointer-events: none;
27325
+ }
27326
+
27323
27327
  .e-small .e-checkbox-wrapper,
27324
27328
  .e-small.e-checkbox-wrapper,
27325
27329
  .e-small .e-css.e-checkbox-wrapper,
@@ -29592,6 +29596,9 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
29592
29596
 
29593
29597
  .e-caret {
29594
29598
  font-size: $drop-down-btn-caret-icon-font-size;
29599
+ @if $skin-name == 'FluentUI' or $skin-name == 'highcontrast' {
29600
+ margin-top: 0;
29601
+ }
29595
29602
  }
29596
29603
 
29597
29604
  &.e-vertical {
@@ -34582,12 +34589,26 @@ $cpicker-split-btn-border: 1px solid $border !default;
34582
34589
  & .e-slider-track {
34583
34590
  background: linear-gradient(to left, $cpicker-gradient-0 0, $cpicker-gradient-16 16%, $cpicker-gradient-33 33%, $cpicker-gradient-50 50%, $cpicker-gradient-67 67%, $cpicker-gradient-84 84%, $cpicker-gradient-100 100%);
34584
34591
  }
34592
+
34593
+ & .e-handle {
34594
+ @if $skin-name == 'FluentUI' {
34595
+ top: $cpicker-slider-handle-top !important; /* stylelint-disable-line declaration-no-important */
34596
+ }
34597
+ }
34585
34598
  }
34586
34599
 
34587
34600
  & .e-preview-container {
34588
34601
  margin-left: 0;
34589
34602
  margin-right: $cpicker-preview-margin-left;
34590
34603
  }
34604
+
34605
+ & .e-opacity-slider {
34606
+ & .e-handle-first {
34607
+ @if $skin-name == 'FluentUI' {
34608
+ top: $cpicker-slider-handle-top !important; /* stylelint-disable-line declaration-no-important */
34609
+ }
34610
+ }
34611
+ }
34591
34612
  }
34592
34613
 
34593
34614
  & .e-selected-value {
@@ -35589,22 +35610,26 @@ $cmenu-hover-icon-color: $icon-color !default;
35589
35610
 
35590
35611
 
35591
35612
  @mixin focused-icon-color {
35592
- & .e-caret {
35593
- color: $cmenu-caret-color;
35594
- }
35595
-
35596
- & .e-menu-icon {
35597
- color: $cmenu-icon-color;
35613
+ @if $skin-name != 'bootstrap5' {
35614
+ & .e-caret {
35615
+ color: $cmenu-caret-color;
35616
+ }
35617
+
35618
+ & .e-menu-icon {
35619
+ color: $cmenu-icon-color;
35620
+ }
35598
35621
  }
35599
35622
  }
35600
35623
 
35601
35624
  @mixin selected-icon-color {
35602
- & .e-caret {
35603
- color: $cmenu-caret-hover-color;
35604
- }
35605
-
35606
- & .e-menu-icon {
35607
- color: $cmenu-hover-icon-color;
35625
+ @if $skin-name != 'bootstrap5' {
35626
+ & .e-caret {
35627
+ color: $cmenu-caret-hover-color;
35628
+ }
35629
+
35630
+ & .e-menu-icon {
35631
+ color: $cmenu-hover-icon-color;
35632
+ }
35608
35633
  }
35609
35634
  }
35610
35635
 
@@ -43070,7 +43095,7 @@ $dialog-close-button-width: 32px !default;
43070
43095
  $dialog-header-content-padding: 16px 24px 20px !default;
43071
43096
  $dialog-content-padding: 24px 24px 12px 24px !default;
43072
43097
  $dialog-content-margin-bottom: 12px !default;
43073
- $dialog-footer-content-padding: 0 24px 24px !default;
43098
+ $dialog-footer-content-padding: 24px !default;
43074
43099
  $dialog-footer-content-padding-bottom: 9px !default;
43075
43100
  $dialog-footer-content-border-top: 0 solid $border-light !default;
43076
43101
  $dialog-alert-footer-content-border-top: 0 solid $border-light !default;
@@ -57298,6 +57323,7 @@ $ddl-sel-chip-close-mobile-left: 12px !default;
57298
57323
  $ddl-chip-sel-mobile-close-height: 40px !default;
57299
57324
  $ddl-chip-sel-mobile-close-margin: 0 0 0 0 !default;
57300
57325
  $ddl-input-text-indent: 8px !default;
57326
+ $ddl-input-placeholder-padding: 0 0 0 8px !default;
57301
57327
  $ddl-rtl-chip-sel-close-left: -12px !default;
57302
57328
  $ddl-popup-active-focus-border-width: 0 !default;
57303
57329
  $ddl-popup-active-focus-shadow-item: none !default;
@@ -57880,8 +57906,8 @@ $ddl-small-clear-icon-width: 12px !default;
57880
57906
  height: $ddl-input-height;
57881
57907
  min-height: $ddl-input-height;
57882
57908
  outline: none;
57883
- padding: 0;
57884
- text-indent: $ddl-input-text-indent;
57909
+ padding: $ddl-input-placeholder-padding;
57910
+ text-indent: 0;
57885
57911
  }
57886
57912
 
57887
57913
  .e-multiselect.e-filled .e-multi-select-wrapper input[type = 'text'] {
@@ -75728,9 +75754,16 @@ $grid-dropitems-count-margin-left: -8px !default;
75728
75754
  margin-top: $grid-reorder-arrow-top-margin;
75729
75755
  }
75730
75756
 
75757
+ .e-gridheader .e-headercontent .e-reorderuparrow-virtual {
75758
+ margin-top: $grid-reorder-virtualarrow-top-margin;
75759
+ }
75760
+
75731
75761
  .e-gridheader .e-headercontent .e-reorderdownarrow {
75732
75762
  margin-top: $grid-reorder-downarrow-top-margin;
75733
75763
  }
75764
+ .e-gridheader .e-headercontent .e-reorderdownarrow-virtual {
75765
+ margin-top: $grid-reorder-virtualdownarrow-top-margin;
75766
+ }
75734
75767
 
75735
75768
  .e-masked-cell.e-rowcell .e-virtualcell {
75736
75769
  background-color: $grid-maskedcell-virtual-background-color;
@@ -75781,6 +75814,11 @@ $grid-dropitems-count-margin-left: -8px !default;
75781
75814
  .e-cc-contentdiv .e-choosercheck {
75782
75815
  white-space: $grid-filter-checkbox-white-space;
75783
75816
  }
75817
+
75818
+ .e-filterdiv .e-multiselect.e-input-group:not(.e-rtl),
75819
+ .e-fltrtempdiv .e-multiselect.e-input-group:not(.e-rtl){
75820
+ text-align: left;
75821
+ }
75784
75822
  }
75785
75823
  }
75786
75824
  }
@@ -82562,7 +82600,7 @@ $rte-drop-text-mobile-width: 242px !default;
82562
82600
  font-size: $rte-toolbar-big-icon-size;
82563
82601
  }
82564
82602
 
82565
- .e-toolbar-item .e-font-color .e-selected-color.e-icons::before,
82603
+ .e-toolbar-item .e-rte-font-color .e-selected-color.e-icons::before,
82566
82604
  .e-toolbar-item .e-background-color .e-selected-color.e-icons::before {
82567
82605
  top: -20px;
82568
82606
  }
@@ -82806,13 +82844,13 @@ $rte-drop-text-mobile-width: 242px !default;
82806
82844
  padding-right: $rte-drop-btn-action-padding-right;
82807
82845
  }
82808
82846
 
82809
- .e-font-color .e-selected-color.e-icons::before {
82847
+ .e-rte-font-color .e-selected-color.e-icons::before {
82810
82848
  font-size: 12px;
82811
82849
  position: relative;
82812
82850
  top: -18px;
82813
82851
  }
82814
82852
 
82815
- .e-font-color.e-icons::before {
82853
+ .e-rte-font-color.e-icons::before {
82816
82854
  font-size: 13px;
82817
82855
  }
82818
82856
 
@@ -85095,7 +85133,7 @@ $rte-drop-text-mobile-width: 242px !default;
85095
85133
  content: '\e76f';
85096
85134
  }
85097
85135
 
85098
- .e-font-color::before {
85136
+ .e-rte-font-color::before {
85099
85137
  content: '\e79f';
85100
85138
  }
85101
85139
 
@@ -102554,20 +102592,6 @@ $pivotpager-single-size-title-padding: 8px !default;
102554
102592
 
102555
102593
  .e-toolbar-items {
102556
102594
  background: $pivotgrid-grp-bg-color;
102557
-
102558
- .e-toolbar-item {
102559
- .e-tbar-btn.e-btn.e-control {
102560
- @if ($skin-name =='fabric') or ($skin-name =='fabric-dark') or ($skin-name =='material') or ($skin-name =='highcontrast') or ($skin-name =='highcontrast-light') or ($skin-name =='bootstrap4') {
102561
- background: $pivotgrid-grp-bg-color;
102562
-
102563
- &:hover {
102564
- @if ($skin-name =='material') or ($skin-name =='material-dark') or ($skin-name =='fabric-dark') or ($skin-name =='bootstrap4') {
102565
- background: $pivotgrid-grp-bg-hover-color;
102566
- }
102567
- }
102568
- }
102569
- }
102570
- }
102571
102595
  }
102572
102596
 
102573
102597
  .e-toolbar-item .e-tbar-btn.e-btn {
@@ -102660,20 +102684,28 @@ $pivotpager-single-size-title-padding: 8px !default;
102660
102684
  @if ($pivotgrid-skin == 'bootstrap4') {
102661
102685
  background-color: $gray-600;
102662
102686
  border-radius: $pivotgrid-default-border-radius;
102663
- }
102687
+ }
102664
102688
 
102665
- .e-menu-icon,
102666
- .e-icons{
102667
- @if ($pivotgrid-skin == 'bootstrap4') {
102668
- color: $white;
102689
+ .e-menu-icon,
102690
+ .e-icons{
102691
+ @if ($pivotgrid-skin == 'bootstrap4') {
102692
+ color: $white;
102693
+ }
102694
+
102695
+ @if ($pivotgrid-skin == 'FluentUI') {
102696
+ color: $pivotgrid-active-color;
102697
+ }
102669
102698
  }
102699
+ }
102670
102700
 
102671
- @if ($pivotgrid-skin == 'FluentUI') {
102672
- color: $pivotgrid-active-color;
102701
+ ul.e-menu {
102702
+ @if ($pivotgrid-skin == 'fabric') or ($pivotgrid-skin == 'fabric-dark') or
102703
+ ($pivotgrid-skin == 'highcontrast') or ($pivotgrid-skin == 'highcontrast-light') {
102704
+ padding-right: 0 !important;
102705
+ padding-left: 0 !important;
102673
102706
  }
102674
102707
  }
102675
102708
  }
102676
- }
102677
102709
 
102678
102710
  .e-tab .e-tab-header .e-toolbar-item.e-active {
102679
102711
  margin-left: 18px !important;
@@ -103166,15 +103198,17 @@ $pivotpager-single-size-title-padding: 8px !default;
103166
103198
  }
103167
103199
 
103168
103200
  .e-toolbar .e-tbar-btn {
103169
- @if ($skin-name == 'tailwind') {
103170
- background-color: transparent;
103171
- }
103201
+ background-color: transparent;
103202
+
103203
+ @if ($skin-name =='highcontrast') or ($skin-name =='highcontrast-light') {
103204
+ border: none !important;
103205
+ }
103172
103206
 
103173
103207
  &:hover {
103174
103208
  @if ($skin-name == 'tailwind') {
103175
103209
  background-color: $pivot-toolbar-icon-hover-color;
103176
- }
103177
- }
103210
+ }
103211
+ }
103178
103212
  }
103179
103213
 
103180
103214
 
@@ -107406,7 +107440,7 @@ $schedule-tree-content-color: $content-text-color-alt2;
107406
107440
  vertical-align: top;
107407
107441
 
107408
107442
  &.e-translate {
107409
- transition: transform .3s ease 0s;
107443
+ transition: transform .1s ease 0s;
107410
107444
  }
107411
107445
  }
107412
107446
 
@@ -112262,6 +112296,12 @@ $image-editor-contextual-toolbar: $content-bg-color-alt2 !default;
112262
112296
  border-top: $image-editor-border;
112263
112297
  }
112264
112298
 
112299
+ & .e-canvas-wrapper {
112300
+ & .e-textarea {
112301
+ line-height: initial !important; /* stylelint-disable-line declaration-no-important */
112302
+ }
112303
+ }
112304
+
112265
112305
  & .e-bottom-toolbar {
112266
112306
  border-top: $image-editor-border;
112267
112307
  }
@@ -27321,6 +27321,10 @@ $cbox-icon-color: $icon-color !default;
27321
27321
  }
27322
27322
  }
27323
27323
 
27324
+ .e-checkbox-wrapper[readonly] {
27325
+ pointer-events: none;
27326
+ }
27327
+
27324
27328
  .e-small .e-checkbox-wrapper,
27325
27329
  .e-small.e-checkbox-wrapper,
27326
27330
  .e-small .e-css.e-checkbox-wrapper,
@@ -29593,6 +29597,9 @@ $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
29593
29597
 
29594
29598
  .e-caret {
29595
29599
  font-size: $drop-down-btn-caret-icon-font-size;
29600
+ @if $skin-name == 'FluentUI' or $skin-name == 'highcontrast' {
29601
+ margin-top: 0;
29602
+ }
29596
29603
  }
29597
29604
 
29598
29605
  &.e-vertical {
@@ -34583,12 +34590,26 @@ $cpicker-split-btn-border: 1px solid $border !default;
34583
34590
  & .e-slider-track {
34584
34591
  background: linear-gradient(to left, $cpicker-gradient-0 0, $cpicker-gradient-16 16%, $cpicker-gradient-33 33%, $cpicker-gradient-50 50%, $cpicker-gradient-67 67%, $cpicker-gradient-84 84%, $cpicker-gradient-100 100%);
34585
34592
  }
34593
+
34594
+ & .e-handle {
34595
+ @if $skin-name == 'FluentUI' {
34596
+ top: $cpicker-slider-handle-top !important; /* stylelint-disable-line declaration-no-important */
34597
+ }
34598
+ }
34586
34599
  }
34587
34600
 
34588
34601
  & .e-preview-container {
34589
34602
  margin-left: 0;
34590
34603
  margin-right: $cpicker-preview-margin-left;
34591
34604
  }
34605
+
34606
+ & .e-opacity-slider {
34607
+ & .e-handle-first {
34608
+ @if $skin-name == 'FluentUI' {
34609
+ top: $cpicker-slider-handle-top !important; /* stylelint-disable-line declaration-no-important */
34610
+ }
34611
+ }
34612
+ }
34592
34613
  }
34593
34614
 
34594
34615
  & .e-selected-value {
@@ -35590,22 +35611,26 @@ $cmenu-hover-icon-color: $icon-color !default;
35590
35611
 
35591
35612
 
35592
35613
  @mixin focused-icon-color {
35593
- & .e-caret {
35594
- color: $cmenu-caret-color;
35595
- }
35596
-
35597
- & .e-menu-icon {
35598
- color: $cmenu-icon-color;
35614
+ @if $skin-name != 'bootstrap5' {
35615
+ & .e-caret {
35616
+ color: $cmenu-caret-color;
35617
+ }
35618
+
35619
+ & .e-menu-icon {
35620
+ color: $cmenu-icon-color;
35621
+ }
35599
35622
  }
35600
35623
  }
35601
35624
 
35602
35625
  @mixin selected-icon-color {
35603
- & .e-caret {
35604
- color: $cmenu-caret-hover-color;
35605
- }
35606
-
35607
- & .e-menu-icon {
35608
- color: $cmenu-hover-icon-color;
35626
+ @if $skin-name != 'bootstrap5' {
35627
+ & .e-caret {
35628
+ color: $cmenu-caret-hover-color;
35629
+ }
35630
+
35631
+ & .e-menu-icon {
35632
+ color: $cmenu-hover-icon-color;
35633
+ }
35609
35634
  }
35610
35635
  }
35611
35636
 
@@ -43071,7 +43096,7 @@ $dialog-close-button-width: 32px !default;
43071
43096
  $dialog-header-content-padding: 16px 24px 20px !default;
43072
43097
  $dialog-content-padding: 24px 24px 12px 24px !default;
43073
43098
  $dialog-content-margin-bottom: 12px !default;
43074
- $dialog-footer-content-padding: 0 24px 24px !default;
43099
+ $dialog-footer-content-padding: 24px !default;
43075
43100
  $dialog-footer-content-padding-bottom: 9px !default;
43076
43101
  $dialog-footer-content-border-top: 0 solid $border-light !default;
43077
43102
  $dialog-alert-footer-content-border-top: 0 solid $border-light !default;
@@ -57299,6 +57324,7 @@ $ddl-sel-chip-close-mobile-left: 12px !default;
57299
57324
  $ddl-chip-sel-mobile-close-height: 40px !default;
57300
57325
  $ddl-chip-sel-mobile-close-margin: 0 0 0 0 !default;
57301
57326
  $ddl-input-text-indent: 8px !default;
57327
+ $ddl-input-placeholder-padding: 0 0 0 8px !default;
57302
57328
  $ddl-rtl-chip-sel-close-left: -12px !default;
57303
57329
  $ddl-popup-active-focus-border-width: 0 !default;
57304
57330
  $ddl-popup-active-focus-shadow-item: none !default;
@@ -57881,8 +57907,8 @@ $ddl-small-clear-icon-width: 12px !default;
57881
57907
  height: $ddl-input-height;
57882
57908
  min-height: $ddl-input-height;
57883
57909
  outline: none;
57884
- padding: 0;
57885
- text-indent: $ddl-input-text-indent;
57910
+ padding: $ddl-input-placeholder-padding;
57911
+ text-indent: 0;
57886
57912
  }
57887
57913
 
57888
57914
  .e-multiselect.e-filled .e-multi-select-wrapper input[type = 'text'] {
@@ -75729,9 +75755,16 @@ $grid-dropitems-count-margin-left: -8px !default;
75729
75755
  margin-top: $grid-reorder-arrow-top-margin;
75730
75756
  }
75731
75757
 
75758
+ .e-gridheader .e-headercontent .e-reorderuparrow-virtual {
75759
+ margin-top: $grid-reorder-virtualarrow-top-margin;
75760
+ }
75761
+
75732
75762
  .e-gridheader .e-headercontent .e-reorderdownarrow {
75733
75763
  margin-top: $grid-reorder-downarrow-top-margin;
75734
75764
  }
75765
+ .e-gridheader .e-headercontent .e-reorderdownarrow-virtual {
75766
+ margin-top: $grid-reorder-virtualdownarrow-top-margin;
75767
+ }
75735
75768
 
75736
75769
  .e-masked-cell.e-rowcell .e-virtualcell {
75737
75770
  background-color: $grid-maskedcell-virtual-background-color;
@@ -75782,6 +75815,11 @@ $grid-dropitems-count-margin-left: -8px !default;
75782
75815
  .e-cc-contentdiv .e-choosercheck {
75783
75816
  white-space: $grid-filter-checkbox-white-space;
75784
75817
  }
75818
+
75819
+ .e-filterdiv .e-multiselect.e-input-group:not(.e-rtl),
75820
+ .e-fltrtempdiv .e-multiselect.e-input-group:not(.e-rtl){
75821
+ text-align: left;
75822
+ }
75785
75823
  }
75786
75824
  }
75787
75825
  }
@@ -82563,7 +82601,7 @@ $rte-drop-text-mobile-width: 242px !default;
82563
82601
  font-size: $rte-toolbar-big-icon-size;
82564
82602
  }
82565
82603
 
82566
- .e-toolbar-item .e-font-color .e-selected-color.e-icons::before,
82604
+ .e-toolbar-item .e-rte-font-color .e-selected-color.e-icons::before,
82567
82605
  .e-toolbar-item .e-background-color .e-selected-color.e-icons::before {
82568
82606
  top: -20px;
82569
82607
  }
@@ -82807,13 +82845,13 @@ $rte-drop-text-mobile-width: 242px !default;
82807
82845
  padding-right: $rte-drop-btn-action-padding-right;
82808
82846
  }
82809
82847
 
82810
- .e-font-color .e-selected-color.e-icons::before {
82848
+ .e-rte-font-color .e-selected-color.e-icons::before {
82811
82849
  font-size: 12px;
82812
82850
  position: relative;
82813
82851
  top: -18px;
82814
82852
  }
82815
82853
 
82816
- .e-font-color.e-icons::before {
82854
+ .e-rte-font-color.e-icons::before {
82817
82855
  font-size: 13px;
82818
82856
  }
82819
82857
 
@@ -85096,7 +85134,7 @@ $rte-drop-text-mobile-width: 242px !default;
85096
85134
  content: '\e76f';
85097
85135
  }
85098
85136
 
85099
- .e-font-color::before {
85137
+ .e-rte-font-color::before {
85100
85138
  content: '\e79f';
85101
85139
  }
85102
85140
 
@@ -102555,20 +102593,6 @@ $pivotpager-single-size-title-padding: 8px !default;
102555
102593
 
102556
102594
  .e-toolbar-items {
102557
102595
  background: $pivotgrid-grp-bg-color;
102558
-
102559
- .e-toolbar-item {
102560
- .e-tbar-btn.e-btn.e-control {
102561
- @if ($skin-name =='fabric') or ($skin-name =='fabric-dark') or ($skin-name =='material') or ($skin-name =='highcontrast') or ($skin-name =='highcontrast-light') or ($skin-name =='bootstrap4') {
102562
- background: $pivotgrid-grp-bg-color;
102563
-
102564
- &:hover {
102565
- @if ($skin-name =='material') or ($skin-name =='material-dark') or ($skin-name =='fabric-dark') or ($skin-name =='bootstrap4') {
102566
- background: $pivotgrid-grp-bg-hover-color;
102567
- }
102568
- }
102569
- }
102570
- }
102571
- }
102572
102596
  }
102573
102597
 
102574
102598
  .e-toolbar-item .e-tbar-btn.e-btn {
@@ -102661,20 +102685,28 @@ $pivotpager-single-size-title-padding: 8px !default;
102661
102685
  @if ($pivotgrid-skin == 'bootstrap4') {
102662
102686
  background-color: $gray-600;
102663
102687
  border-radius: $pivotgrid-default-border-radius;
102664
- }
102688
+ }
102665
102689
 
102666
- .e-menu-icon,
102667
- .e-icons{
102668
- @if ($pivotgrid-skin == 'bootstrap4') {
102669
- color: $white;
102690
+ .e-menu-icon,
102691
+ .e-icons{
102692
+ @if ($pivotgrid-skin == 'bootstrap4') {
102693
+ color: $white;
102694
+ }
102695
+
102696
+ @if ($pivotgrid-skin == 'FluentUI') {
102697
+ color: $pivotgrid-active-color;
102698
+ }
102670
102699
  }
102700
+ }
102671
102701
 
102672
- @if ($pivotgrid-skin == 'FluentUI') {
102673
- color: $pivotgrid-active-color;
102702
+ ul.e-menu {
102703
+ @if ($pivotgrid-skin == 'fabric') or ($pivotgrid-skin == 'fabric-dark') or
102704
+ ($pivotgrid-skin == 'highcontrast') or ($pivotgrid-skin == 'highcontrast-light') {
102705
+ padding-right: 0 !important;
102706
+ padding-left: 0 !important;
102674
102707
  }
102675
102708
  }
102676
102709
  }
102677
- }
102678
102710
 
102679
102711
  .e-tab .e-tab-header .e-toolbar-item.e-active {
102680
102712
  margin-left: 18px !important;
@@ -103167,15 +103199,17 @@ $pivotpager-single-size-title-padding: 8px !default;
103167
103199
  }
103168
103200
 
103169
103201
  .e-toolbar .e-tbar-btn {
103170
- @if ($skin-name == 'tailwind') {
103171
- background-color: transparent;
103172
- }
103202
+ background-color: transparent;
103203
+
103204
+ @if ($skin-name =='highcontrast') or ($skin-name =='highcontrast-light') {
103205
+ border: none !important;
103206
+ }
103173
103207
 
103174
103208
  &:hover {
103175
103209
  @if ($skin-name == 'tailwind') {
103176
103210
  background-color: $pivot-toolbar-icon-hover-color;
103177
- }
103178
- }
103211
+ }
103212
+ }
103179
103213
  }
103180
103214
 
103181
103215
 
@@ -107407,7 +107441,7 @@ $schedule-tree-content-color: $content-text-color-alt2;
107407
107441
  vertical-align: top;
107408
107442
 
107409
107443
  &.e-translate {
107410
- transition: transform .3s ease 0s;
107444
+ transition: transform .1s ease 0s;
107411
107445
  }
107412
107446
  }
107413
107447
 
@@ -112263,6 +112297,12 @@ $image-editor-contextual-toolbar: $content-bg-color-alt2 !default;
112263
112297
  border-top: $image-editor-border;
112264
112298
  }
112265
112299
 
112300
+ & .e-canvas-wrapper {
112301
+ & .e-textarea {
112302
+ line-height: initial !important; /* stylelint-disable-line declaration-no-important */
112303
+ }
112304
+ }
112305
+
112266
112306
  & .e-bottom-toolbar {
112267
112307
  border-top: $image-editor-border;
112268
112308
  }
@@ -4284,9 +4284,16 @@ $grid-dropitems-count-margin-left: -8px !default;
4284
4284
  margin-top: $grid-reorder-arrow-top-margin;
4285
4285
  }
4286
4286
 
4287
+ .e-gridheader .e-headercontent .e-reorderuparrow-virtual {
4288
+ margin-top: $grid-reorder-virtualarrow-top-margin;
4289
+ }
4290
+
4287
4291
  .e-gridheader .e-headercontent .e-reorderdownarrow {
4288
4292
  margin-top: $grid-reorder-downarrow-top-margin;
4289
4293
  }
4294
+ .e-gridheader .e-headercontent .e-reorderdownarrow-virtual {
4295
+ margin-top: $grid-reorder-virtualdownarrow-top-margin;
4296
+ }
4290
4297
 
4291
4298
  .e-masked-cell.e-rowcell .e-virtualcell {
4292
4299
  background-color: $grid-maskedcell-virtual-background-color;
@@ -4337,6 +4344,11 @@ $grid-dropitems-count-margin-left: -8px !default;
4337
4344
  .e-cc-contentdiv .e-choosercheck {
4338
4345
  white-space: $grid-filter-checkbox-white-space;
4339
4346
  }
4347
+
4348
+ .e-filterdiv .e-multiselect.e-input-group:not(.e-rtl),
4349
+ .e-fltrtempdiv .e-multiselect.e-input-group:not(.e-rtl){
4350
+ text-align: left;
4351
+ }
4340
4352
  }
4341
4353
  }
4342
4354
  }
@@ -4286,9 +4286,16 @@ $grid-dropitems-count-margin-left: -8px !default;
4286
4286
  margin-top: $grid-reorder-arrow-top-margin;
4287
4287
  }
4288
4288
 
4289
+ .e-gridheader .e-headercontent .e-reorderuparrow-virtual {
4290
+ margin-top: $grid-reorder-virtualarrow-top-margin;
4291
+ }
4292
+
4289
4293
  .e-gridheader .e-headercontent .e-reorderdownarrow {
4290
4294
  margin-top: $grid-reorder-downarrow-top-margin;
4291
4295
  }
4296
+ .e-gridheader .e-headercontent .e-reorderdownarrow-virtual {
4297
+ margin-top: $grid-reorder-virtualdownarrow-top-margin;
4298
+ }
4292
4299
 
4293
4300
  .e-masked-cell.e-rowcell .e-virtualcell {
4294
4301
  background-color: $grid-maskedcell-virtual-background-color;
@@ -4339,6 +4346,11 @@ $grid-dropitems-count-margin-left: -8px !default;
4339
4346
  .e-cc-contentdiv .e-choosercheck {
4340
4347
  white-space: $grid-filter-checkbox-white-space;
4341
4348
  }
4349
+
4350
+ .e-filterdiv .e-multiselect.e-input-group:not(.e-rtl),
4351
+ .e-fltrtempdiv .e-multiselect.e-input-group:not(.e-rtl){
4352
+ text-align: left;
4353
+ }
4342
4354
  }
4343
4355
  }
4344
4356
  }
@@ -4290,9 +4290,16 @@ $grid-dropitems-count-margin-left: -8px !default;
4290
4290
  margin-top: $grid-reorder-arrow-top-margin;
4291
4291
  }
4292
4292
 
4293
+ .e-gridheader .e-headercontent .e-reorderuparrow-virtual {
4294
+ margin-top: $grid-reorder-virtualarrow-top-margin;
4295
+ }
4296
+
4293
4297
  .e-gridheader .e-headercontent .e-reorderdownarrow {
4294
4298
  margin-top: $grid-reorder-downarrow-top-margin;
4295
4299
  }
4300
+ .e-gridheader .e-headercontent .e-reorderdownarrow-virtual {
4301
+ margin-top: $grid-reorder-virtualdownarrow-top-margin;
4302
+ }
4296
4303
 
4297
4304
  .e-masked-cell.e-rowcell .e-virtualcell {
4298
4305
  background-color: $grid-maskedcell-virtual-background-color;
@@ -4343,6 +4350,11 @@ $grid-dropitems-count-margin-left: -8px !default;
4343
4350
  .e-cc-contentdiv .e-choosercheck {
4344
4351
  white-space: $grid-filter-checkbox-white-space;
4345
4352
  }
4353
+
4354
+ .e-filterdiv .e-multiselect.e-input-group:not(.e-rtl),
4355
+ .e-fltrtempdiv .e-multiselect.e-input-group:not(.e-rtl){
4356
+ text-align: left;
4357
+ }
4346
4358
  }
4347
4359
  }
4348
4360
  }
@@ -4284,9 +4284,16 @@ $grid-dropitems-count-margin-left: -4px !default;
4284
4284
  margin-top: $grid-reorder-arrow-top-margin;
4285
4285
  }
4286
4286
 
4287
+ .e-gridheader .e-headercontent .e-reorderuparrow-virtual {
4288
+ margin-top: $grid-reorder-virtualarrow-top-margin;
4289
+ }
4290
+
4287
4291
  .e-gridheader .e-headercontent .e-reorderdownarrow {
4288
4292
  margin-top: $grid-reorder-downarrow-top-margin;
4289
4293
  }
4294
+ .e-gridheader .e-headercontent .e-reorderdownarrow-virtual {
4295
+ margin-top: $grid-reorder-virtualdownarrow-top-margin;
4296
+ }
4290
4297
 
4291
4298
  .e-masked-cell.e-rowcell .e-virtualcell {
4292
4299
  background-color: $grid-maskedcell-virtual-background-color;
@@ -4337,6 +4344,11 @@ $grid-dropitems-count-margin-left: -4px !default;
4337
4344
  .e-cc-contentdiv .e-choosercheck {
4338
4345
  white-space: $grid-filter-checkbox-white-space;
4339
4346
  }
4347
+
4348
+ .e-filterdiv .e-multiselect.e-input-group:not(.e-rtl),
4349
+ .e-fltrtempdiv .e-multiselect.e-input-group:not(.e-rtl){
4350
+ text-align: left;
4351
+ }
4340
4352
  }
4341
4353
  }
4342
4354
  }