@syncfusion/blazor-themes 26.1.40 → 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 (205) hide show
  1. package/SCSS-Themes/base/fluent2-highcontrast.scss +1 -1
  2. package/SCSS-Themes/bds-dark.scss +159 -53
  3. package/SCSS-Themes/bds.scss +159 -53
  4. package/SCSS-Themes/bootstrap-dark.scss +159 -53
  5. package/SCSS-Themes/bootstrap.scss +166 -60
  6. package/SCSS-Themes/bootstrap4.scss +166 -60
  7. package/SCSS-Themes/bootstrap5-dark.scss +170 -64
  8. package/SCSS-Themes/bootstrap5.scss +170 -64
  9. package/SCSS-Themes/calendars/calendar/bds-dark.scss +5 -0
  10. package/SCSS-Themes/calendars/calendar/bds.scss +5 -0
  11. package/SCSS-Themes/calendars/calendar/bootstrap-dark.scss +5 -0
  12. package/SCSS-Themes/calendars/calendar/bootstrap.scss +5 -0
  13. package/SCSS-Themes/calendars/calendar/bootstrap4.scss +5 -0
  14. package/SCSS-Themes/calendars/calendar/bootstrap5-dark.scss +5 -0
  15. package/SCSS-Themes/calendars/calendar/bootstrap5.scss +5 -0
  16. package/SCSS-Themes/calendars/calendar/fabric-dark.scss +5 -0
  17. package/SCSS-Themes/calendars/calendar/fabric.scss +5 -0
  18. package/SCSS-Themes/calendars/calendar/fluent-dark.scss +5 -0
  19. package/SCSS-Themes/calendars/calendar/fluent.scss +5 -0
  20. package/SCSS-Themes/calendars/calendar/fluent2-dark.scss +5 -0
  21. package/SCSS-Themes/calendars/calendar/fluent2.scss +5 -0
  22. package/SCSS-Themes/calendars/calendar/highcontrast.scss +5 -0
  23. package/SCSS-Themes/calendars/calendar/material-dark.scss +5 -0
  24. package/SCSS-Themes/calendars/calendar/material.scss +5 -0
  25. package/SCSS-Themes/calendars/calendar/material3-dark.scss +5 -0
  26. package/SCSS-Themes/calendars/calendar/material3.scss +5 -0
  27. package/SCSS-Themes/calendars/calendar/tailwind-dark.scss +5 -0
  28. package/SCSS-Themes/calendars/calendar/tailwind.scss +5 -0
  29. package/SCSS-Themes/calendars/daterangepicker/fluent2-dark.scss +3 -3
  30. package/SCSS-Themes/calendars/daterangepicker/fluent2.scss +3 -3
  31. package/SCSS-Themes/documenteditor/document-editor-container/bds-dark.scss +1 -1
  32. package/SCSS-Themes/documenteditor/document-editor-container/bds.scss +1 -1
  33. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap-dark.scss +1 -1
  34. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap.scss +1 -1
  35. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap4.scss +1 -1
  36. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap5-dark.scss +1 -1
  37. package/SCSS-Themes/documenteditor/document-editor-container/bootstrap5.scss +1 -1
  38. package/SCSS-Themes/documenteditor/document-editor-container/fabric-dark.scss +1 -1
  39. package/SCSS-Themes/documenteditor/document-editor-container/fabric.scss +1 -1
  40. package/SCSS-Themes/documenteditor/document-editor-container/fluent-dark.scss +1 -1
  41. package/SCSS-Themes/documenteditor/document-editor-container/fluent.scss +1 -1
  42. package/SCSS-Themes/documenteditor/document-editor-container/fluent2-dark.scss +1 -1
  43. package/SCSS-Themes/documenteditor/document-editor-container/fluent2.scss +1 -1
  44. package/SCSS-Themes/documenteditor/document-editor-container/highcontrast.scss +1 -1
  45. package/SCSS-Themes/documenteditor/document-editor-container/material-dark.scss +1 -1
  46. package/SCSS-Themes/documenteditor/document-editor-container/material.scss +1 -1
  47. package/SCSS-Themes/documenteditor/document-editor-container/material3-dark.scss +1 -1
  48. package/SCSS-Themes/documenteditor/document-editor-container/material3.scss +1 -1
  49. package/SCSS-Themes/documenteditor/document-editor-container/tailwind-dark.scss +1 -1
  50. package/SCSS-Themes/documenteditor/document-editor-container/tailwind.scss +1 -1
  51. package/SCSS-Themes/dropdowns/drop-down-tree/bds-dark.scss +1 -1
  52. package/SCSS-Themes/dropdowns/drop-down-tree/bds.scss +1 -1
  53. package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap-dark.scss +1 -1
  54. package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap.scss +1 -1
  55. package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap4.scss +1 -1
  56. package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap5-dark.scss +1 -1
  57. package/SCSS-Themes/dropdowns/drop-down-tree/bootstrap5.scss +1 -1
  58. package/SCSS-Themes/dropdowns/drop-down-tree/fabric-dark.scss +1 -1
  59. package/SCSS-Themes/dropdowns/drop-down-tree/fabric.scss +1 -1
  60. package/SCSS-Themes/dropdowns/drop-down-tree/fluent-dark.scss +1 -1
  61. package/SCSS-Themes/dropdowns/drop-down-tree/fluent.scss +1 -1
  62. package/SCSS-Themes/dropdowns/drop-down-tree/fluent2-dark.scss +1 -1
  63. package/SCSS-Themes/dropdowns/drop-down-tree/fluent2.scss +1 -1
  64. package/SCSS-Themes/dropdowns/drop-down-tree/highcontrast.scss +1 -1
  65. package/SCSS-Themes/dropdowns/drop-down-tree/material-dark.scss +1 -1
  66. package/SCSS-Themes/dropdowns/drop-down-tree/material.scss +1 -1
  67. package/SCSS-Themes/dropdowns/drop-down-tree/material3-dark.scss +1 -1
  68. package/SCSS-Themes/dropdowns/drop-down-tree/material3.scss +1 -1
  69. package/SCSS-Themes/dropdowns/drop-down-tree/tailwind-dark.scss +1 -1
  70. package/SCSS-Themes/dropdowns/drop-down-tree/tailwind.scss +1 -1
  71. package/SCSS-Themes/dropdowns/multi-select/bds-dark.scss +3 -0
  72. package/SCSS-Themes/dropdowns/multi-select/bds.scss +3 -0
  73. package/SCSS-Themes/dropdowns/multi-select/bootstrap-dark.scss +3 -0
  74. package/SCSS-Themes/dropdowns/multi-select/bootstrap.scss +3 -0
  75. package/SCSS-Themes/dropdowns/multi-select/bootstrap4.scss +3 -0
  76. package/SCSS-Themes/dropdowns/multi-select/bootstrap5-dark.scss +3 -0
  77. package/SCSS-Themes/dropdowns/multi-select/bootstrap5.scss +3 -0
  78. package/SCSS-Themes/dropdowns/multi-select/fabric-dark.scss +3 -0
  79. package/SCSS-Themes/dropdowns/multi-select/fabric.scss +3 -0
  80. package/SCSS-Themes/dropdowns/multi-select/fluent-dark.scss +3 -0
  81. package/SCSS-Themes/dropdowns/multi-select/fluent.scss +3 -0
  82. package/SCSS-Themes/dropdowns/multi-select/fluent2-dark.scss +5 -1
  83. package/SCSS-Themes/dropdowns/multi-select/fluent2.scss +5 -1
  84. package/SCSS-Themes/dropdowns/multi-select/highcontrast.scss +3 -0
  85. package/SCSS-Themes/dropdowns/multi-select/material-dark.scss +3 -0
  86. package/SCSS-Themes/dropdowns/multi-select/material.scss +3 -0
  87. package/SCSS-Themes/dropdowns/multi-select/material3-dark.scss +3 -0
  88. package/SCSS-Themes/dropdowns/multi-select/material3.scss +3 -0
  89. package/SCSS-Themes/dropdowns/multi-select/tailwind-dark.scss +3 -0
  90. package/SCSS-Themes/dropdowns/multi-select/tailwind.scss +3 -0
  91. package/SCSS-Themes/fabric-dark.scss +159 -53
  92. package/SCSS-Themes/fabric.scss +163 -57
  93. package/SCSS-Themes/fluent-dark.scss +167 -61
  94. package/SCSS-Themes/fluent.scss +167 -61
  95. package/SCSS-Themes/fluent2-dark.scss +181 -74
  96. package/SCSS-Themes/fluent2-highcontrast.scss +1 -1
  97. package/SCSS-Themes/fluent2.scss +181 -74
  98. package/SCSS-Themes/grids/grid/bds-dark.scss +23 -7
  99. package/SCSS-Themes/grids/grid/bds.scss +23 -7
  100. package/SCSS-Themes/grids/grid/bootstrap-dark.scss +23 -7
  101. package/SCSS-Themes/grids/grid/bootstrap.scss +30 -14
  102. package/SCSS-Themes/grids/grid/bootstrap4.scss +30 -14
  103. package/SCSS-Themes/grids/grid/bootstrap5-dark.scss +33 -17
  104. package/SCSS-Themes/grids/grid/bootstrap5.scss +33 -17
  105. package/SCSS-Themes/grids/grid/fabric-dark.scss +23 -7
  106. package/SCSS-Themes/grids/grid/fabric.scss +27 -11
  107. package/SCSS-Themes/grids/grid/fluent-dark.scss +30 -14
  108. package/SCSS-Themes/grids/grid/fluent.scss +30 -14
  109. package/SCSS-Themes/grids/grid/fluent2-dark.scss +36 -20
  110. package/SCSS-Themes/grids/grid/fluent2.scss +36 -20
  111. package/SCSS-Themes/grids/grid/highcontrast.scss +30 -14
  112. package/SCSS-Themes/grids/grid/material-dark.scss +23 -7
  113. package/SCSS-Themes/grids/grid/material.scss +24 -8
  114. package/SCSS-Themes/grids/grid/material3-dark.scss +29 -13
  115. package/SCSS-Themes/grids/grid/material3.scss +29 -13
  116. package/SCSS-Themes/grids/grid/tailwind-dark.scss +33 -17
  117. package/SCSS-Themes/grids/grid/tailwind.scss +33 -17
  118. package/SCSS-Themes/highcontrast.scss +166 -60
  119. package/SCSS-Themes/inputs/slider/bds-dark.scss +34 -7
  120. package/SCSS-Themes/inputs/slider/bds.scss +34 -7
  121. package/SCSS-Themes/inputs/slider/bootstrap-dark.scss +34 -7
  122. package/SCSS-Themes/inputs/slider/bootstrap.scss +34 -7
  123. package/SCSS-Themes/inputs/slider/bootstrap4.scss +34 -7
  124. package/SCSS-Themes/inputs/slider/bootstrap5-dark.scss +34 -7
  125. package/SCSS-Themes/inputs/slider/bootstrap5.scss +34 -7
  126. package/SCSS-Themes/inputs/slider/fabric-dark.scss +34 -7
  127. package/SCSS-Themes/inputs/slider/fabric.scss +34 -7
  128. package/SCSS-Themes/inputs/slider/fluent-dark.scss +34 -7
  129. package/SCSS-Themes/inputs/slider/fluent.scss +34 -7
  130. package/SCSS-Themes/inputs/slider/fluent2-dark.scss +34 -7
  131. package/SCSS-Themes/inputs/slider/fluent2.scss +34 -7
  132. package/SCSS-Themes/inputs/slider/highcontrast.scss +34 -7
  133. package/SCSS-Themes/inputs/slider/material-dark.scss +44 -16
  134. package/SCSS-Themes/inputs/slider/material.scss +34 -7
  135. package/SCSS-Themes/inputs/slider/material3-dark.scss +34 -7
  136. package/SCSS-Themes/inputs/slider/material3.scss +34 -7
  137. package/SCSS-Themes/inputs/slider/tailwind-dark.scss +34 -7
  138. package/SCSS-Themes/inputs/slider/tailwind.scss +34 -7
  139. package/SCSS-Themes/material-dark.scss +170 -63
  140. package/SCSS-Themes/material.scss +161 -55
  141. package/SCSS-Themes/material3-dark.scss +166 -60
  142. package/SCSS-Themes/material3.scss +166 -60
  143. package/SCSS-Themes/navigations/treeview/bds-dark.scss +2 -1
  144. package/SCSS-Themes/navigations/treeview/bds.scss +2 -1
  145. package/SCSS-Themes/navigations/treeview/bootstrap-dark.scss +2 -1
  146. package/SCSS-Themes/navigations/treeview/bootstrap.scss +2 -1
  147. package/SCSS-Themes/navigations/treeview/bootstrap4.scss +2 -1
  148. package/SCSS-Themes/navigations/treeview/bootstrap5-dark.scss +2 -1
  149. package/SCSS-Themes/navigations/treeview/bootstrap5.scss +2 -1
  150. package/SCSS-Themes/navigations/treeview/fabric-dark.scss +2 -1
  151. package/SCSS-Themes/navigations/treeview/fabric.scss +2 -1
  152. package/SCSS-Themes/navigations/treeview/fluent-dark.scss +2 -1
  153. package/SCSS-Themes/navigations/treeview/fluent.scss +2 -1
  154. package/SCSS-Themes/navigations/treeview/fluent2-dark.scss +2 -1
  155. package/SCSS-Themes/navigations/treeview/fluent2.scss +2 -1
  156. package/SCSS-Themes/navigations/treeview/highcontrast.scss +2 -1
  157. package/SCSS-Themes/navigations/treeview/material-dark.scss +2 -1
  158. package/SCSS-Themes/navigations/treeview/material.scss +2 -1
  159. package/SCSS-Themes/navigations/treeview/material3-dark.scss +2 -1
  160. package/SCSS-Themes/navigations/treeview/material3.scss +2 -1
  161. package/SCSS-Themes/navigations/treeview/tailwind-dark.scss +2 -1
  162. package/SCSS-Themes/navigations/treeview/tailwind.scss +2 -1
  163. package/SCSS-Themes/pdfviewer/pdfviewer/bds-dark.scss +89 -36
  164. package/SCSS-Themes/pdfviewer/pdfviewer/bds.scss +89 -36
  165. package/SCSS-Themes/pdfviewer/pdfviewer/bootstrap-dark.scss +89 -36
  166. package/SCSS-Themes/pdfviewer/pdfviewer/bootstrap.scss +89 -36
  167. package/SCSS-Themes/pdfviewer/pdfviewer/bootstrap4.scss +89 -36
  168. package/SCSS-Themes/pdfviewer/pdfviewer/bootstrap5-dark.scss +90 -37
  169. package/SCSS-Themes/pdfviewer/pdfviewer/bootstrap5.scss +90 -37
  170. package/SCSS-Themes/pdfviewer/pdfviewer/fabric-dark.scss +89 -36
  171. package/SCSS-Themes/pdfviewer/pdfviewer/fabric.scss +89 -36
  172. package/SCSS-Themes/pdfviewer/pdfviewer/fluent-dark.scss +90 -37
  173. package/SCSS-Themes/pdfviewer/pdfviewer/fluent.scss +90 -37
  174. package/SCSS-Themes/pdfviewer/pdfviewer/fluent2-dark.scss +93 -40
  175. package/SCSS-Themes/pdfviewer/pdfviewer/fluent2.scss +93 -40
  176. package/SCSS-Themes/pdfviewer/pdfviewer/highcontrast.scss +89 -36
  177. package/SCSS-Themes/pdfviewer/pdfviewer/material-dark.scss +90 -37
  178. package/SCSS-Themes/pdfviewer/pdfviewer/material.scss +90 -37
  179. package/SCSS-Themes/pdfviewer/pdfviewer/material3-dark.scss +90 -37
  180. package/SCSS-Themes/pdfviewer/pdfviewer/material3.scss +90 -37
  181. package/SCSS-Themes/pdfviewer/pdfviewer/tailwind-dark.scss +90 -37
  182. package/SCSS-Themes/pdfviewer/pdfviewer/tailwind.scss +90 -37
  183. package/SCSS-Themes/ribbon/ribbon/bds-dark.scss +1 -0
  184. package/SCSS-Themes/ribbon/ribbon/bds.scss +1 -0
  185. package/SCSS-Themes/ribbon/ribbon/bootstrap-dark.scss +1 -0
  186. package/SCSS-Themes/ribbon/ribbon/bootstrap.scss +1 -0
  187. package/SCSS-Themes/ribbon/ribbon/bootstrap4.scss +1 -0
  188. package/SCSS-Themes/ribbon/ribbon/bootstrap5-dark.scss +1 -0
  189. package/SCSS-Themes/ribbon/ribbon/bootstrap5.scss +1 -0
  190. package/SCSS-Themes/ribbon/ribbon/fabric-dark.scss +1 -0
  191. package/SCSS-Themes/ribbon/ribbon/fabric.scss +1 -0
  192. package/SCSS-Themes/ribbon/ribbon/fluent-dark.scss +1 -0
  193. package/SCSS-Themes/ribbon/ribbon/fluent.scss +1 -0
  194. package/SCSS-Themes/ribbon/ribbon/fluent2-dark.scss +1 -0
  195. package/SCSS-Themes/ribbon/ribbon/fluent2.scss +1 -0
  196. package/SCSS-Themes/ribbon/ribbon/highcontrast.scss +1 -0
  197. package/SCSS-Themes/ribbon/ribbon/material-dark.scss +1 -0
  198. package/SCSS-Themes/ribbon/ribbon/material.scss +1 -0
  199. package/SCSS-Themes/ribbon/ribbon/material3-dark.scss +1 -0
  200. package/SCSS-Themes/ribbon/ribbon/material3.scss +1 -0
  201. package/SCSS-Themes/ribbon/ribbon/tailwind-dark.scss +1 -0
  202. package/SCSS-Themes/ribbon/ribbon/tailwind.scss +1 -0
  203. package/SCSS-Themes/tailwind-dark.scss +170 -64
  204. package/SCSS-Themes/tailwind.scss +170 -64
  205. package/package.json +1 -1
@@ -350,7 +350,7 @@ $pv-corrupted-pop-content-margin-right: 53px !default;
350
350
  $pv-corrupted-pop-header-rtl-text-align: right !default;
351
351
  $pv-toolbar-btn-width-mobile: 36px !default;
352
352
  $pv-toolbar-btn-height-mobile: 30px !default;
353
- $pv-annotation-opacity-popup-background-color: $white !default;
353
+ $pv-annotation-opacity-popup-background-color: $content-bg-color-alt1 !default;
354
354
  $pv-annotation-opacity-popup-color: $content-text-color !default;
355
355
  $pv-annotation-opacity-popup-padding: 16px !default;
356
356
  $pv-annotation-opacity-popup-min-height: 48px !default;
@@ -1314,7 +1314,9 @@ $lg-desktop: 1399.98;
1314
1314
  .e-pv-formdesigner-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-pv-tbar-btn.e-btn {
1315
1315
  height: $pv-toolbar-btn-height;
1316
1316
  min-width: $pv-toolbar-btn-width;
1317
- width: $pv-toolbar-btn-width;
1317
+ @if ($skin-name != 'fluent2') {
1318
+ width: $pv-toolbar-btn-width;
1319
+ }
1318
1320
  @if $skin-name == 'FluentUI' {
1319
1321
  line-height: $pv-toolbar-btn-height;
1320
1322
  min-width: 40px;
@@ -2232,7 +2234,8 @@ $lg-desktop: 1399.98;
2232
2234
  padding: $pv-thumbnail-view-button-selection-padding;
2233
2235
  }
2234
2236
 
2235
- .e-pv-tbar-btn.e-pv-thumbnail-view-button.e-btn:focus
2237
+ .e-pv-tbar-btn.e-pv-thumbnail-view-button.e-btn:focus,
2238
+ .e-pv-tbar-btn.e-pv-organize-view-button.e-btn:focus
2236
2239
  {
2237
2240
  background: $pv-thumbnail-view-button-selection-background;
2238
2241
  border: $pv-thumbnail-view-button-selection-border;
@@ -2595,7 +2598,9 @@ $lg-desktop: 1399.98;
2595
2598
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-menu-icon,
2596
2599
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-menu-icon,
2597
2600
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-caret,
2598
- .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-caret {
2601
+ .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-caret,
2602
+ .e-pv-annotation-comment-panel-container .e-pv-tbar-btn,
2603
+ .e-pv-comment-panel-title-container .e-pv-annotation-tools-close-icon.e-pv-icon {
2599
2604
  color: $pv-icon-color;
2600
2605
  @if ($skin-name == 'bootstrap5' or $skin-name == 'bootstrap5-dark') {
2601
2606
  box-shadow: none;
@@ -2659,13 +2664,18 @@ $lg-desktop: 1399.98;
2659
2664
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-menu-icon:focus,
2660
2665
  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl.e-valid-input:not(.e-input-focus):hover,
2661
2666
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-caret:focus,
2662
- .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-valid-input:not(.e-input-focus):hover {
2667
+ .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-valid-input:not(.e-input-focus):hover,
2668
+ .e-pv-annotation-comment-panel-container .e-pv-tbar-btn:hover,
2669
+ .e-pv-annotation-comment-panel-container .e-pv-tbar-btn:focus {
2663
2670
  @if $skin-name == 'bootstrap4' {
2664
2671
  color: $pv-icon-color-hover;
2665
2672
  }
2666
2673
  @if $skin-name == 'bootstrap5' {
2667
2674
  color: $white;
2668
2675
  }
2676
+ @if $skin-name == 'fluent2' {
2677
+ color: var(--color-sf-toolbar-icon-color);
2678
+ }
2669
2679
  @if $skin-name == 'FluentUI' {
2670
2680
  color: $pv-item-selection-color;
2671
2681
  }
@@ -2677,7 +2687,7 @@ $lg-desktop: 1399.98;
2677
2687
  @if $skin-name == 'bootstrap4' {
2678
2688
  color: $pv-icon-color-hover;
2679
2689
  }
2680
- @if $skin-name == 'bootstrap5' {
2690
+ @if ($skin-name == 'bootstrap5') {
2681
2691
  color: $pv-icon-color;
2682
2692
  }
2683
2693
  @if $skin-name == 'FluentUI' {
@@ -2685,12 +2695,23 @@ $lg-desktop: 1399.98;
2685
2695
  }
2686
2696
  }
2687
2697
 
2698
+ .e-pv-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus-visible,
2699
+ .e-pv-annotation-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus-visible,
2700
+ .e-pv-formdesigner-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus-visible {
2701
+ @if ($skin-name == 'fluent2') {
2702
+ color: $pv-icon-color;
2703
+ }
2704
+ }
2705
+
2688
2706
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item:hover .e-menu-icon,
2689
2707
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused:hover .e-menu-icon,
2690
2708
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused:hover .e-caret {
2691
2709
  @if $skin-name == 'bootstrap4' {
2692
2710
  color: $pv-icon-color-hover;
2693
2711
  }
2712
+ @if $skin-name == 'fluent2' {
2713
+ color: var(--color-sf-toolbar-icon-color);
2714
+ }
2694
2715
  }
2695
2716
 
2696
2717
  .e-pv-toolbar .e-toolbar-item.e-overlay .e-pv-tbar-btn.e-pv-tbar-btn .e-pv-icon,
@@ -3042,10 +3063,13 @@ $lg-desktop: 1399.98;
3042
3063
  border-bottom: 2px solid;
3043
3064
  margin-top: 0;
3044
3065
  padding-top: 5px;
3045
- @if ($skin-name=='bootstrap5'or $theme-name=='fluent2') {
3066
+ @if ($skin-name=='bootstrap5') {
3046
3067
  margin-top: -4px;
3047
3068
  padding-top: 0;
3048
3069
  }
3070
+ @if ($theme-name=='fluent2') {
3071
+ padding-top: 0;
3072
+ }
3049
3073
  @if $skin-name == 'FluentUI' {
3050
3074
  line-height: 11px;
3051
3075
  }
@@ -3057,7 +3081,12 @@ $lg-desktop: 1399.98;
3057
3081
  line-height: 1.71em;
3058
3082
  }
3059
3083
  border-bottom: 2px solid;
3060
- margin-top: 0;
3084
+ @if ($skin-name == 'fluent2') {
3085
+ margin-top: 5px;
3086
+ }
3087
+ @else {
3088
+ margin-top: 0;
3089
+ }
3061
3090
  padding-top: 1px;
3062
3091
  vertical-align: initial;
3063
3092
  @if $skin-name == 'FluentUI' {
@@ -3069,9 +3098,12 @@ $lg-desktop: 1399.98;
3069
3098
  .e-pv-properties-color-container-style-prop .e-btn-icon.e-pv-annotation-thickness-icon.e-pv-icon {
3070
3099
  margin-top: 0;
3071
3100
  padding-top: 7px;
3072
- @if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $theme-name == 'fluent2' {
3101
+ @if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' {
3073
3102
  padding-top: 0;
3074
3103
  }
3104
+ @if ( or $theme-name == 'fluent2'){
3105
+ padding-top: 5px;
3106
+ }
3075
3107
  vertical-align: initial;
3076
3108
  }
3077
3109
 
@@ -3083,6 +3115,13 @@ $lg-desktop: 1399.98;
3083
3115
  vertical-align: initial;
3084
3116
  }
3085
3117
 
3118
+ .e-pv-annotation-thickness-popup-container-mobile,
3119
+ .e-pv-annotation-opacity-popup-container-mobile {
3120
+ @if $skin-name != 'Material3' {
3121
+ background-color: $pv-annotation-opacity-popup-background-color;
3122
+ }
3123
+ }
3124
+
3086
3125
  .e-pv-annotation-opacity-popup-container,
3087
3126
  .e-pv-annotation-thickness-popup-container {
3088
3127
  @if $skin-name != 'Material3' {
@@ -3441,13 +3480,6 @@ $lg-desktop: 1399.98;
3441
3480
  }
3442
3481
  }
3443
3482
 
3444
- .e-template.e-toolbar-item:not(.e-pv-shape-template-container) .e-pv-annotation-shapes-container,
3445
- .e-template.e-toolbar-item:not(.e-pv-calibrate-template-container) .e-pv-annotation-calibrate-container {
3446
- @if ($theme-name == 'fluent2') {
3447
- line-height: 28px;
3448
- }
3449
- }
3450
-
3451
3483
  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-menu-icon .e-caret,
3452
3484
  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item.e-focused .e-menu-icon .e-caret {
3453
3485
  @if ($skin-name == 'bootstrap5') {
@@ -3530,7 +3562,6 @@ $lg-desktop: 1399.98;
3530
3562
  line-height: $pv-prop-color-picker-line-height;
3531
3563
  @if ($skin-name == 'bootstrap5') {
3532
3564
  background: $transparent;
3533
- border: 1px solid $border-light;
3534
3565
  border-radius: 4px;
3535
3566
  box-sizing: border-box;
3536
3567
  color: $content-text-color;
@@ -3545,6 +3576,13 @@ $lg-desktop: 1399.98;
3545
3576
  }
3546
3577
  }
3547
3578
 
3579
+ .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn:disabled,
3580
+ .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn:disabled{
3581
+ @if ($skin-name == 'bootstrap5') {
3582
+ color: $pv-icon-color;
3583
+ }
3584
+ }
3585
+
3548
3586
  .e-bigger .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn,
3549
3587
  .e-bigger .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn {
3550
3588
  @if $skin-name == 'FluentUI' {
@@ -4076,7 +4114,7 @@ $lg-desktop: 1399.98;
4076
4114
  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item,
4077
4115
  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item .e-pv-stamp-icon,
4078
4116
  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item .e-caret {
4079
- @if $skin-name != 'Material3' {
4117
+ @if ($skin-name != 'Material3' and $skin-name != 'fluent2') {
4080
4118
  line-height: $pv-annot-toolbar-dropdown-btn-line-height;
4081
4119
  }
4082
4120
  }
@@ -4180,14 +4218,6 @@ $lg-desktop: 1399.98;
4180
4218
  padding-top: $pv-dialog-pop-close-icon-padding-top-mobile;
4181
4219
  }
4182
4220
 
4183
- .e-pv-properties-form-field-window .e-dlg-header-content .e-btn.e-dlg-closeicon-btn,
4184
- .e-pv-signature-window .e-dlg-header-content .e-btn.e-dlg-closeicon-btn {
4185
- @if $theme-name == 'fluent2' {
4186
- padding-left: 24px !important;/* stylelint-disable-line declaration-no-important */
4187
- padding-top: 24px !important;/* stylelint-disable-line declaration-no-important */
4188
- }
4189
- }
4190
-
4191
4221
  .e-pv-organize-window .e-dlg-header-content .e-btn.e-dlg-closeicon-btn{
4192
4222
  @if $theme-name == 'fluent2' {
4193
4223
  padding: 8px !important;/* stylelint-disable-line declaration-no-important */
@@ -4530,6 +4560,8 @@ $lg-desktop: 1399.98;
4530
4560
  padding-right: 7px;
4531
4561
  @if $skin-name == 'Material3' {
4532
4562
  font-size: $text-xs;
4563
+ padding-left: 12px;
4564
+ padding-right: 12px;
4533
4565
  }
4534
4566
  }
4535
4567
 
@@ -4672,7 +4704,7 @@ $lg-desktop: 1399.98;
4672
4704
  .e-pv-comments-panel-text {
4673
4705
  font-size: 15px;
4674
4706
  padding-left: 85px;
4675
- color: rgba(var(--color-sf-on-surface-variant));
4707
+ color: var(--color-sf-content-text-color-alt1);
4676
4708
  }
4677
4709
 
4678
4710
  .e-pv-comments-content-container {
@@ -4860,8 +4892,34 @@ $lg-desktop: 1399.98;
4860
4892
  }
4861
4893
  }
4862
4894
 
4895
+ .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-caret {
4896
+ @if ($skin-name == 'fluent2') {
4897
+ margin-top: -4px;
4898
+ }
4899
+ }
4900
+
4901
+ .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-pv-stamp-icon,
4902
+ .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-caret {
4903
+ @if ($skin-name == 'fluent2') {
4904
+ margin-top: -5px;
4905
+ }
4906
+ }
4907
+
4908
+ .e-pv-annotation-shapes-container.e-btn.e-icon-btn,
4909
+ .e-pv-annotation-calibrate-container.e-btn.e-icon-btn,
4910
+ .e-pv-annotation-handwritten-container.e-btn.e-icon-btn {
4911
+ @if ($skin-name == 'fluent2') {
4912
+ padding-top: 8px;
4913
+ }
4914
+ }
4915
+
4863
4916
  .e-menu-icon.e-pv-stamp-icon.e-pv-icon {
4864
- margin-top: $pv-stamp-icon-margin-top;
4917
+ @if ($skin-name == 'fluent2') {
4918
+ margin-top: -4px;
4919
+ }
4920
+ @else {
4921
+ margin-top: $pv-stamp-icon-margin-top;
4922
+ }
4865
4923
  @if $theme-name != 'fluent2'{
4866
4924
  padding-left: 7px;
4867
4925
  }
@@ -5185,7 +5243,9 @@ $lg-desktop: 1399.98;
5185
5243
  @if $skin-name == 'bootstrap5' {
5186
5244
  color: $pv-icon-color;
5187
5245
  height: 32px;
5188
- line-height: 32px;
5246
+ @if ($theme-name != 'fluent2') {
5247
+ line-height: 32px;
5248
+ }
5189
5249
  }
5190
5250
  @else {
5191
5251
  color: $pv-icon-color;
@@ -5242,13 +5302,6 @@ $lg-desktop: 1399.98;
5242
5302
  border-color: $pv-annotation-dropdown-border-color;
5243
5303
  }
5244
5304
 
5245
- .e-bigger .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-pv-stamp-icon,
5246
- .e-bigger .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-caret {
5247
- @if $theme-name == 'fluent2' {
5248
- margin-top: -10px;
5249
- }
5250
- }
5251
-
5252
5305
  .e-pv-custom-annotation-stamp-container.e-menu-container .e-ul .e-menu-item.e-selected,
5253
5306
  .e-pv-custom-annotation-stamp-container.e-menu-container.e-menu-container .e-ul .e-menu-item.e-focused {
5254
5307
  @if $skin-name == 'bootstrap4' {
@@ -5817,6 +5870,7 @@ $lg-desktop: 1399.98;
5817
5870
 
5818
5871
  .e-pv-properties-form-field-group-btn-div {
5819
5872
  display: grid;
5873
+ align-content: space-between;
5820
5874
  }
5821
5875
 
5822
5876
  .e-pv-properties-form-field-option-dropdown-list-div {
@@ -6175,7 +6229,6 @@ $lg-desktop: 1399.98;
6175
6229
  }
6176
6230
  @if $theme-name == 'fluent2'{
6177
6231
  font-family: $font-family;
6178
- margin-left: 7px;
6179
6232
  }
6180
6233
  }
6181
6234
 
@@ -350,7 +350,7 @@ $pv-corrupted-pop-content-margin-right: 53px !default;
350
350
  $pv-corrupted-pop-header-rtl-text-align: right !default;
351
351
  $pv-toolbar-btn-width-mobile: 36px !default;
352
352
  $pv-toolbar-btn-height-mobile: 30px !default;
353
- $pv-annotation-opacity-popup-background-color: $white !default;
353
+ $pv-annotation-opacity-popup-background-color: $content-bg-color-alt1 !default;
354
354
  $pv-annotation-opacity-popup-color: $content-text-color !default;
355
355
  $pv-annotation-opacity-popup-padding: 16px !default;
356
356
  $pv-annotation-opacity-popup-min-height: 48px !default;
@@ -1314,7 +1314,9 @@ $lg-desktop: 1399.98;
1314
1314
  .e-pv-formdesigner-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-pv-tbar-btn.e-btn {
1315
1315
  height: $pv-toolbar-btn-height;
1316
1316
  min-width: $pv-toolbar-btn-width;
1317
- width: $pv-toolbar-btn-width;
1317
+ @if ($skin-name != 'fluent2') {
1318
+ width: $pv-toolbar-btn-width;
1319
+ }
1318
1320
  @if $skin-name == 'FluentUI' {
1319
1321
  line-height: $pv-toolbar-btn-height;
1320
1322
  min-width: 40px;
@@ -2232,7 +2234,8 @@ $lg-desktop: 1399.98;
2232
2234
  padding: $pv-thumbnail-view-button-selection-padding;
2233
2235
  }
2234
2236
 
2235
- .e-pv-tbar-btn.e-pv-thumbnail-view-button.e-btn:focus
2237
+ .e-pv-tbar-btn.e-pv-thumbnail-view-button.e-btn:focus,
2238
+ .e-pv-tbar-btn.e-pv-organize-view-button.e-btn:focus
2236
2239
  {
2237
2240
  background: $pv-thumbnail-view-button-selection-background;
2238
2241
  border: $pv-thumbnail-view-button-selection-border;
@@ -2595,7 +2598,9 @@ $lg-desktop: 1399.98;
2595
2598
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-menu-icon,
2596
2599
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-menu-icon,
2597
2600
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-caret,
2598
- .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-caret {
2601
+ .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-caret,
2602
+ .e-pv-annotation-comment-panel-container .e-pv-tbar-btn,
2603
+ .e-pv-comment-panel-title-container .e-pv-annotation-tools-close-icon.e-pv-icon {
2599
2604
  color: $pv-icon-color;
2600
2605
  @if ($skin-name == 'bootstrap5' or $skin-name == 'bootstrap5-dark') {
2601
2606
  box-shadow: none;
@@ -2659,13 +2664,18 @@ $lg-desktop: 1399.98;
2659
2664
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-menu-icon:focus,
2660
2665
  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl.e-valid-input:not(.e-input-focus):hover,
2661
2666
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-caret:focus,
2662
- .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-valid-input:not(.e-input-focus):hover {
2667
+ .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-valid-input:not(.e-input-focus):hover,
2668
+ .e-pv-annotation-comment-panel-container .e-pv-tbar-btn:hover,
2669
+ .e-pv-annotation-comment-panel-container .e-pv-tbar-btn:focus {
2663
2670
  @if $skin-name == 'bootstrap4' {
2664
2671
  color: $pv-icon-color-hover;
2665
2672
  }
2666
2673
  @if $skin-name == 'bootstrap5' {
2667
2674
  color: $white;
2668
2675
  }
2676
+ @if $skin-name == 'fluent2' {
2677
+ color: var(--color-sf-toolbar-icon-color);
2678
+ }
2669
2679
  @if $skin-name == 'FluentUI' {
2670
2680
  color: $pv-item-selection-color;
2671
2681
  }
@@ -2677,7 +2687,7 @@ $lg-desktop: 1399.98;
2677
2687
  @if $skin-name == 'bootstrap4' {
2678
2688
  color: $pv-icon-color-hover;
2679
2689
  }
2680
- @if $skin-name == 'bootstrap5' {
2690
+ @if ($skin-name == 'bootstrap5') {
2681
2691
  color: $pv-icon-color;
2682
2692
  }
2683
2693
  @if $skin-name == 'FluentUI' {
@@ -2685,12 +2695,23 @@ $lg-desktop: 1399.98;
2685
2695
  }
2686
2696
  }
2687
2697
 
2698
+ .e-pv-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus-visible,
2699
+ .e-pv-annotation-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus-visible,
2700
+ .e-pv-formdesigner-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus-visible {
2701
+ @if ($skin-name == 'fluent2') {
2702
+ color: $pv-icon-color;
2703
+ }
2704
+ }
2705
+
2688
2706
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item:hover .e-menu-icon,
2689
2707
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused:hover .e-menu-icon,
2690
2708
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused:hover .e-caret {
2691
2709
  @if $skin-name == 'bootstrap4' {
2692
2710
  color: $pv-icon-color-hover;
2693
2711
  }
2712
+ @if $skin-name == 'fluent2' {
2713
+ color: var(--color-sf-toolbar-icon-color);
2714
+ }
2694
2715
  }
2695
2716
 
2696
2717
  .e-pv-toolbar .e-toolbar-item.e-overlay .e-pv-tbar-btn.e-pv-tbar-btn .e-pv-icon,
@@ -3042,10 +3063,13 @@ $lg-desktop: 1399.98;
3042
3063
  border-bottom: 2px solid;
3043
3064
  margin-top: 0;
3044
3065
  padding-top: 5px;
3045
- @if ($skin-name=='bootstrap5'or $theme-name=='fluent2') {
3066
+ @if ($skin-name=='bootstrap5') {
3046
3067
  margin-top: -4px;
3047
3068
  padding-top: 0;
3048
3069
  }
3070
+ @if ($theme-name=='fluent2') {
3071
+ padding-top: 0;
3072
+ }
3049
3073
  @if $skin-name == 'FluentUI' {
3050
3074
  line-height: 11px;
3051
3075
  }
@@ -3057,7 +3081,12 @@ $lg-desktop: 1399.98;
3057
3081
  line-height: 1.71em;
3058
3082
  }
3059
3083
  border-bottom: 2px solid;
3060
- margin-top: 0;
3084
+ @if ($skin-name == 'fluent2') {
3085
+ margin-top: 5px;
3086
+ }
3087
+ @else {
3088
+ margin-top: 0;
3089
+ }
3061
3090
  padding-top: 1px;
3062
3091
  vertical-align: initial;
3063
3092
  @if $skin-name == 'FluentUI' {
@@ -3069,9 +3098,12 @@ $lg-desktop: 1399.98;
3069
3098
  .e-pv-properties-color-container-style-prop .e-btn-icon.e-pv-annotation-thickness-icon.e-pv-icon {
3070
3099
  margin-top: 0;
3071
3100
  padding-top: 7px;
3072
- @if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $theme-name == 'fluent2' {
3101
+ @if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' {
3073
3102
  padding-top: 0;
3074
3103
  }
3104
+ @if ( or $theme-name == 'fluent2'){
3105
+ padding-top: 5px;
3106
+ }
3075
3107
  vertical-align: initial;
3076
3108
  }
3077
3109
 
@@ -3083,6 +3115,13 @@ $lg-desktop: 1399.98;
3083
3115
  vertical-align: initial;
3084
3116
  }
3085
3117
 
3118
+ .e-pv-annotation-thickness-popup-container-mobile,
3119
+ .e-pv-annotation-opacity-popup-container-mobile {
3120
+ @if $skin-name != 'Material3' {
3121
+ background-color: $pv-annotation-opacity-popup-background-color;
3122
+ }
3123
+ }
3124
+
3086
3125
  .e-pv-annotation-opacity-popup-container,
3087
3126
  .e-pv-annotation-thickness-popup-container {
3088
3127
  @if $skin-name != 'Material3' {
@@ -3441,13 +3480,6 @@ $lg-desktop: 1399.98;
3441
3480
  }
3442
3481
  }
3443
3482
 
3444
- .e-template.e-toolbar-item:not(.e-pv-shape-template-container) .e-pv-annotation-shapes-container,
3445
- .e-template.e-toolbar-item:not(.e-pv-calibrate-template-container) .e-pv-annotation-calibrate-container {
3446
- @if ($theme-name == 'fluent2') {
3447
- line-height: 28px;
3448
- }
3449
- }
3450
-
3451
3483
  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-menu-icon .e-caret,
3452
3484
  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item.e-focused .e-menu-icon .e-caret {
3453
3485
  @if ($skin-name == 'bootstrap5') {
@@ -3530,7 +3562,6 @@ $lg-desktop: 1399.98;
3530
3562
  line-height: $pv-prop-color-picker-line-height;
3531
3563
  @if ($skin-name == 'bootstrap5') {
3532
3564
  background: $transparent;
3533
- border: 1px solid $border-light;
3534
3565
  border-radius: 4px;
3535
3566
  box-sizing: border-box;
3536
3567
  color: $content-text-color;
@@ -3545,6 +3576,13 @@ $lg-desktop: 1399.98;
3545
3576
  }
3546
3577
  }
3547
3578
 
3579
+ .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn:disabled,
3580
+ .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn:disabled{
3581
+ @if ($skin-name == 'bootstrap5') {
3582
+ color: $pv-icon-color;
3583
+ }
3584
+ }
3585
+
3548
3586
  .e-bigger .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn,
3549
3587
  .e-bigger .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn {
3550
3588
  @if $skin-name == 'FluentUI' {
@@ -4076,7 +4114,7 @@ $lg-desktop: 1399.98;
4076
4114
  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item,
4077
4115
  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item .e-pv-stamp-icon,
4078
4116
  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item .e-caret {
4079
- @if $skin-name != 'Material3' {
4117
+ @if ($skin-name != 'Material3' and $skin-name != 'fluent2') {
4080
4118
  line-height: $pv-annot-toolbar-dropdown-btn-line-height;
4081
4119
  }
4082
4120
  }
@@ -4180,14 +4218,6 @@ $lg-desktop: 1399.98;
4180
4218
  padding-top: $pv-dialog-pop-close-icon-padding-top-mobile;
4181
4219
  }
4182
4220
 
4183
- .e-pv-properties-form-field-window .e-dlg-header-content .e-btn.e-dlg-closeicon-btn,
4184
- .e-pv-signature-window .e-dlg-header-content .e-btn.e-dlg-closeicon-btn {
4185
- @if $theme-name == 'fluent2' {
4186
- padding-left: 24px !important;/* stylelint-disable-line declaration-no-important */
4187
- padding-top: 24px !important;/* stylelint-disable-line declaration-no-important */
4188
- }
4189
- }
4190
-
4191
4221
  .e-pv-organize-window .e-dlg-header-content .e-btn.e-dlg-closeicon-btn{
4192
4222
  @if $theme-name == 'fluent2' {
4193
4223
  padding: 8px !important;/* stylelint-disable-line declaration-no-important */
@@ -4530,6 +4560,8 @@ $lg-desktop: 1399.98;
4530
4560
  padding-right: 7px;
4531
4561
  @if $skin-name == 'Material3' {
4532
4562
  font-size: $text-xs;
4563
+ padding-left: 12px;
4564
+ padding-right: 12px;
4533
4565
  }
4534
4566
  }
4535
4567
 
@@ -4672,7 +4704,7 @@ $lg-desktop: 1399.98;
4672
4704
  .e-pv-comments-panel-text {
4673
4705
  font-size: 15px;
4674
4706
  padding-left: 85px;
4675
- color: rgba(var(--color-sf-on-surface-variant));
4707
+ color: var(--color-sf-content-text-color-alt1);
4676
4708
  }
4677
4709
 
4678
4710
  .e-pv-comments-content-container {
@@ -4860,8 +4892,34 @@ $lg-desktop: 1399.98;
4860
4892
  }
4861
4893
  }
4862
4894
 
4895
+ .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-caret {
4896
+ @if ($skin-name == 'fluent2') {
4897
+ margin-top: -4px;
4898
+ }
4899
+ }
4900
+
4901
+ .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-pv-stamp-icon,
4902
+ .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-caret {
4903
+ @if ($skin-name == 'fluent2') {
4904
+ margin-top: -5px;
4905
+ }
4906
+ }
4907
+
4908
+ .e-pv-annotation-shapes-container.e-btn.e-icon-btn,
4909
+ .e-pv-annotation-calibrate-container.e-btn.e-icon-btn,
4910
+ .e-pv-annotation-handwritten-container.e-btn.e-icon-btn {
4911
+ @if ($skin-name == 'fluent2') {
4912
+ padding-top: 8px;
4913
+ }
4914
+ }
4915
+
4863
4916
  .e-menu-icon.e-pv-stamp-icon.e-pv-icon {
4864
- margin-top: $pv-stamp-icon-margin-top;
4917
+ @if ($skin-name == 'fluent2') {
4918
+ margin-top: -4px;
4919
+ }
4920
+ @else {
4921
+ margin-top: $pv-stamp-icon-margin-top;
4922
+ }
4865
4923
  @if $theme-name != 'fluent2'{
4866
4924
  padding-left: 7px;
4867
4925
  }
@@ -5185,7 +5243,9 @@ $lg-desktop: 1399.98;
5185
5243
  @if $skin-name == 'bootstrap5' {
5186
5244
  color: $pv-icon-color;
5187
5245
  height: 32px;
5188
- line-height: 32px;
5246
+ @if ($theme-name != 'fluent2') {
5247
+ line-height: 32px;
5248
+ }
5189
5249
  }
5190
5250
  @else {
5191
5251
  color: $pv-icon-color;
@@ -5242,13 +5302,6 @@ $lg-desktop: 1399.98;
5242
5302
  border-color: $pv-annotation-dropdown-border-color;
5243
5303
  }
5244
5304
 
5245
- .e-bigger .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-pv-stamp-icon,
5246
- .e-bigger .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-caret {
5247
- @if $theme-name == 'fluent2' {
5248
- margin-top: -10px;
5249
- }
5250
- }
5251
-
5252
5305
  .e-pv-custom-annotation-stamp-container.e-menu-container .e-ul .e-menu-item.e-selected,
5253
5306
  .e-pv-custom-annotation-stamp-container.e-menu-container.e-menu-container .e-ul .e-menu-item.e-focused {
5254
5307
  @if $skin-name == 'bootstrap4' {
@@ -5817,6 +5870,7 @@ $lg-desktop: 1399.98;
5817
5870
 
5818
5871
  .e-pv-properties-form-field-group-btn-div {
5819
5872
  display: grid;
5873
+ align-content: space-between;
5820
5874
  }
5821
5875
 
5822
5876
  .e-pv-properties-form-field-option-dropdown-list-div {
@@ -6175,7 +6229,6 @@ $lg-desktop: 1399.98;
6175
6229
  }
6176
6230
  @if $theme-name == 'fluent2'{
6177
6231
  font-family: $font-family;
6178
- margin-left: 7px;
6179
6232
  }
6180
6233
  }
6181
6234
 
@@ -939,6 +939,7 @@ $ribbon-items-focus-box-shadow: none !default;
939
939
 
940
940
  .e-disabled {
941
941
  opacity: $ribbon-disabled-opacity;
942
+ pointer-events: none;
942
943
  }
943
944
 
944
945
  .e-input-group {
@@ -939,6 +939,7 @@ $ribbon-items-focus-box-shadow: none !default;
939
939
 
940
940
  .e-disabled {
941
941
  opacity: $ribbon-disabled-opacity;
942
+ pointer-events: none;
942
943
  }
943
944
 
944
945
  .e-input-group {
@@ -939,6 +939,7 @@ $ribbon-items-focus-box-shadow: none !default;
939
939
 
940
940
  .e-disabled {
941
941
  opacity: $ribbon-disabled-opacity;
942
+ pointer-events: none;
942
943
  }
943
944
 
944
945
  .e-input-group {
@@ -939,6 +939,7 @@ $ribbon-items-focus-box-shadow: none !default;
939
939
 
940
940
  .e-disabled {
941
941
  opacity: $ribbon-disabled-opacity;
942
+ pointer-events: none;
942
943
  }
943
944
 
944
945
  .e-input-group {
@@ -939,6 +939,7 @@ $ribbon-items-focus-box-shadow: none !default;
939
939
 
940
940
  .e-disabled {
941
941
  opacity: $ribbon-disabled-opacity;
942
+ pointer-events: none;
942
943
  }
943
944
 
944
945
  .e-input-group {
@@ -939,6 +939,7 @@ $ribbon-items-focus-box-shadow: none !default;
939
939
 
940
940
  .e-disabled {
941
941
  opacity: $ribbon-disabled-opacity;
942
+ pointer-events: none;
942
943
  }
943
944
 
944
945
  .e-input-group {
@@ -939,6 +939,7 @@ $ribbon-items-focus-box-shadow: none !default;
939
939
 
940
940
  .e-disabled {
941
941
  opacity: $ribbon-disabled-opacity;
942
+ pointer-events: none;
942
943
  }
943
944
 
944
945
  .e-input-group {
@@ -939,6 +939,7 @@ $ribbon-items-focus-box-shadow: none !default;
939
939
 
940
940
  .e-disabled {
941
941
  opacity: $ribbon-disabled-opacity;
942
+ pointer-events: none;
942
943
  }
943
944
 
944
945
  .e-input-group {
@@ -939,6 +939,7 @@ $ribbon-items-focus-box-shadow: none !default;
939
939
 
940
940
  .e-disabled {
941
941
  opacity: $ribbon-disabled-opacity;
942
+ pointer-events: none;
942
943
  }
943
944
 
944
945
  .e-input-group {
@@ -939,6 +939,7 @@ $ribbon-items-focus-box-shadow: none !default;
939
939
 
940
940
  .e-disabled {
941
941
  opacity: $ribbon-disabled-opacity;
942
+ pointer-events: none;
942
943
  }
943
944
 
944
945
  .e-input-group {