@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
@@ -31922,7 +31922,13 @@ $slider-limit-bar-color: rgba($bg-base-0, .25) !default;
31922
31922
  &.e-scale {
31923
31923
  &.e-h-scale {
31924
31924
  .e-tick {
31925
- @if ($skin-name != 'material' and $skin-name != 'material-dark') {
31925
+ @if ($skin-name != 'material' and $skin-name == 'material-dark') {
31926
+ @include alignment($tick-after-height, $tick-after-top, 'horizontal');
31927
+ @if ($skin-name == 'material-dark') {
31928
+ background-position: bottom;
31929
+ }
31930
+ }
31931
+ @else if ($skin-name != 'material' and $skin-name != 'material-dark') {
31926
31932
  @include alignment($tick-after-height, $tick-after-top, 'horizontal');
31927
31933
  }
31928
31934
  @else {
@@ -31932,7 +31938,10 @@ $slider-limit-bar-color: rgba($bg-base-0, .25) !default;
31932
31938
  }
31933
31939
 
31934
31940
  .e-large {
31935
- @if ($skin-name != 'material' and $skin-name != 'material-dark') {
31941
+ @if ($skin-name != 'material' and $skin-name == 'material-dark') {
31942
+ @include alignment($largetick-before-height, $largetick-before-top, 'horizontal');
31943
+ }
31944
+ @else if ($skin-name != 'material' and $skin-name != 'material-dark') {
31936
31945
  @include alignment($largetick-before-height, $largetick-before-top, 'horizontal');
31937
31946
  }
31938
31947
  }
@@ -31962,7 +31971,13 @@ $slider-limit-bar-color: rgba($bg-base-0, .25) !default;
31962
31971
  &.e-scale {
31963
31972
  &.e-h-scale {
31964
31973
  .e-tick {
31965
- @if ($skin-name != 'material' and $skin-name != 'material-dark') {
31974
+ @if ($skin-name != 'material' and $skin-name == 'material-dark') {
31975
+ @include alignment($tick-before-height, $tick-before-top, 'horizontal');
31976
+ @if ($skin-name == 'material-dark') {
31977
+ background-position-x: center;
31978
+ }
31979
+ }
31980
+ @else if ($skin-name != 'material' and $skin-name != 'material-dark') {
31966
31981
  @include alignment($tick-before-height, $tick-before-top, 'horizontal');
31967
31982
  }
31968
31983
  @else {
@@ -31972,7 +31987,10 @@ $slider-limit-bar-color: rgba($bg-base-0, .25) !default;
31972
31987
  }
31973
31988
 
31974
31989
  .e-large {
31975
- @if ($skin-name != 'material' and $skin-name != 'material-dark') {
31990
+ @if ($skin-name != 'material' and $skin-name == 'material-dark') {
31991
+ @include alignment($largetick-after-height, $largetick-after-top, 'horizontal');
31992
+ }
31993
+ @else if ($skin-name != 'material' and $skin-name != 'material-dark') {
31976
31994
  @include alignment($largetick-after-height, $largetick-after-top, 'horizontal');
31977
31995
  }
31978
31996
  }
@@ -32048,7 +32066,12 @@ $slider-limit-bar-color: rgba($bg-base-0, .25) !default;
32048
32066
  }
32049
32067
  @if ($skin-name == 'material' or $skin-name == 'material-dark') {
32050
32068
  background-position: center;
32051
- height: 99%;
32069
+ @if ($skin-name == 'material-dark') {
32070
+ height: 12px;
32071
+ }
32072
+ @else {
32073
+ height: 99%;
32074
+ }
32052
32075
  }
32053
32076
  }
32054
32077
 
@@ -32074,6 +32097,10 @@ $slider-limit-bar-color: rgba($bg-base-0, .25) !default;
32074
32097
  @else if ($skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light') {
32075
32098
  @include alignment(calc(100% + 3px), -9px, 'horizontal');
32076
32099
  }
32100
+ @else if ($skin-name == 'material-dark') {
32101
+ height: 20px;
32102
+ top: 4px;
32103
+ }
32077
32104
  }
32078
32105
  }
32079
32106
 
@@ -32173,7 +32200,7 @@ $slider-limit-bar-color: rgba($bg-base-0, .25) !default;
32173
32200
  background-position: center center;
32174
32201
  }
32175
32202
 
32176
- @if ($skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3') {
32203
+ @if ($skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3' or $skin-name == 'material-dark') {
32177
32204
  &.e-large {
32178
32205
  @if ($skin-name != 'bootstrap4') {
32179
32206
  background-image: $slider-scale-tick-image-dark;
@@ -32263,7 +32290,7 @@ $slider-limit-bar-color: rgba($bg-base-0, .25) !default;
32263
32290
  .e-tick {
32264
32291
  display: inline-block;
32265
32292
  @if ($skin-name == 'material' or $skin-name == 'material-dark') {
32266
- background-repeat: no-repeat;
32293
+ background-repeat: repeat-y;
32267
32294
  }
32268
32295
 
32269
32296
  @if ($skin-name != 'material' and $skin-name != 'material-dark') {
@@ -54524,7 +54551,8 @@ $ripple-width: 32px !default;
54524
54551
 
54525
54552
  .e-list-item {
54526
54553
 
54527
- div.e-icons::before {
54554
+ div.e-icons.e-icon-expandable::before,
54555
+ div.e-icons.e-icon-collapsible::before {
54528
54556
  content: '\e22e';
54529
54557
  }
54530
54558
  }
@@ -68614,7 +68642,7 @@ $de-prop-btn-icon-clr: #ccc;
68614
68642
  }
68615
68643
  }
68616
68644
  }
68617
- .e-listview .e-list-icon {
68645
+ .e-de-listview.e-de-listview-icon.e-icons.e-list-icon {
68618
68646
  height: 24px;
68619
68647
  width: 16px;
68620
68648
  margin-right: $e-de-ctnr-break-listview-margin-right;
@@ -74374,7 +74402,7 @@ $grid-filtercell-both-border-width: 1px 0 0 1px !default;
74374
74402
  $grid-indentcell-border-width: 0 1px 0 0 !default;
74375
74403
  $grid-headercelldiv-line-height: 29px !default;
74376
74404
  $grid-bigger-headercelldiv-line-height: $grid-headercelldiv-line-height !default;
74377
- $grid-rtl-headercelldiv-padding: 0 .6em 0 1.8em !default;
74405
+ $grid-rtl-headercelldiv-padding: 0 .6em 0 .9em !default;
74378
74406
  $grid-rtl-headercelldiv-chkbox-padding: 0 0 0 0 !default;
74379
74407
  $grid-bigger-rtl-headercelldiv-chkbox-padding: 0 0 0 .2em !default;
74380
74408
  $grid-td-checkbox-margin-top: 5px !default;
@@ -74475,7 +74503,7 @@ $grid-headercell-line-height: 36px !default;
74475
74503
  $grid-header-padding: 8px !default;
74476
74504
  $grid-header-first-last-cell-padding: 10px !default;
74477
74505
  $grid-headercelldiv-margin: 0 !default;
74478
- $grid-headercell-div-padding: 0 !default;
74506
+ $grid-headercell-div-padding: 0 .5em 0 0 !default;
74479
74507
  $grid-headecell-span-height: 26px !default;
74480
74508
  $grid-headercelldiv-right-align-padding: 0 0 0 10px !default;
74481
74509
  $grid-headercelldiv-padding: 0 10px 0 0 !default;
@@ -74591,12 +74619,12 @@ $grid-bigger-columnchooser-content-padding: 25px 25px 5px 12px !default;
74591
74619
  $grid-bigger-columnchooser-content-margin: 30px 0 20px !default;
74592
74620
  $grid-bigger-cc-checkbox-padding-left: 13px !default;
74593
74621
  $grid-bigger-searchdiv-padding-left: 7px !default;
74594
- $grid-fltr-rtl-sortnumber-margin: 8px 0 0 8px !default;
74622
+ $grid-fltr-rtl-sortnumber-margin: 8px 0 0 18px !default;
74595
74623
  $grid-rtl-sortnumber-margin: $grid-fltr-rtl-sortnumber-margin !default;
74596
- $grid-rtl-bigger-sortnumber-margin: 7px 0 0 3px !default;
74624
+ $grid-rtl-bigger-sortnumber-margin: 7px 0 0 13px !default;
74597
74625
  $grid-rtl-bigger-sortnumber-withfilter-margin: $grid-rtl-bigger-sortnumber-margin !default;
74598
- $grid-rtl-bigger-rightalign-sortnumber-margin: 7px 0 0 5px !default;
74599
- $grid-fltr-rtl-sortnumber-rightalign-margin: 7px 0 0 12px !default;
74626
+ $grid-rtl-bigger-rightalign-sortnumber-margin: 7px 0 0 13px !default;
74627
+ $grid-fltr-rtl-sortnumber-rightalign-margin: 7px 0 0 20px !default;
74600
74628
  $grid-rtl-sortnumber-rightalign-margin: $grid-fltr-rtl-sortnumber-rightalign-margin !default;
74601
74629
  $grid-rtl-headercell-border-width: 0 !default;
74602
74630
  $grid-rtl-th-firstcell-border-left: 0 !default;
@@ -74887,7 +74915,7 @@ $grid-responsive-apply-btn-top: 3px !default;
74887
74915
  $grid-responsive-column-menu-icon-margin-top: 4px !default;
74888
74916
  $grid-rtl-headercelldiv-left-align-margin: 10px !default;
74889
74917
  $grid-rtl-filtermenudiv-left-align-margin: -5px !default;
74890
- $grid-rtl-sort-num-left-align-margin: 7px -2px 0 0 !default;
74918
+ $grid-rtl-sort-num-left-align-margin: 7px -2px 0 2px !default;
74891
74919
  $grid-frozen-mac-scrollbar-background: rgba(0, 0, 0, .5) !default;
74892
74920
  $grid-rowcell-color: rgba($grid-content-font-color, $grid-conent-font-opacity) !default;
74893
74921
  $grid-reorderarrow-margin-top: -5px !default;
@@ -75462,7 +75490,7 @@ $grid-checkmark-color: $selection-font !default;
75462
75490
  .e-headercell.e-fltr-icon .e-headercelldiv .e-sortnumber {
75463
75491
  margin: $grid-rtl-bigger-sortnumber-withfilter-margin;
75464
75492
  @if $grid-skin == 'tailwind' {
75465
- margin-left: 0;
75493
+ margin-left: 4px;
75466
75494
  }
75467
75495
  }
75468
75496
 
@@ -76802,7 +76830,17 @@ $grid-checkmark-color: $selection-font !default;
76802
76830
  text-transform: $grid-header-text-transform;
76803
76831
  user-select: none;
76804
76832
  }
76805
-
76833
+
76834
+ .e-rightalign:not(.e-fltr-icon) .e-headercelldiv {
76835
+ padding: 0 .4em ;
76836
+ @if $grid-skin == 'fabric' {
76837
+ padding: 0 1px 0;
76838
+ }
76839
+ @if $grid-skin == 'highcontrast' {
76840
+ padding: 0;
76841
+ }
76842
+ }
76843
+
76806
76844
  .e-headercelldiv.e-headerchkcelldiv {
76807
76845
  overflow: visible;
76808
76846
  }
@@ -77304,6 +77342,9 @@ $grid-checkmark-color: $selection-font !default;
77304
77342
  right: 2px;
77305
77343
  }
77306
77344
  }
77345
+ &.e-rtl .e-sortfilter .e-rightalign .e-headercelldiv {
77346
+ padding: $grid-headercelldiv-right-align-padding;
77347
+ }
77307
77348
 
77308
77349
  .e-sortfilterdiv {
77309
77350
  float: right;
@@ -77350,7 +77391,7 @@ $grid-checkmark-color: $selection-font !default;
77350
77391
  }
77351
77392
 
77352
77393
  &.e-rtl .e-gridheader .e-sortfilter {
77353
- .e-centeralign.e-headercell[aria-sort="none"],
77394
+ .e-centeralign.e-headercell[aria-sort="none"]:not(.e-centeralign),
77354
77395
  .e-centeralign.e-headercell:not([aria-sort]) {
77355
77396
  .e-headercelldiv,
77356
77397
  .e-stackedheadercelldiv {
@@ -78703,6 +78744,9 @@ $grid-checkmark-color: $selection-font !default;
78703
78744
  .e-headercelldiv.e-headerchkcelldiv {
78704
78745
  padding: $grid-rtl-headercelldiv-padding;
78705
78746
  text-align: right;
78747
+ @if $grid-skin == 'highcontrast' {
78748
+ margin: -7px 0;
78749
+ }
78706
78750
 
78707
78751
  & .e-sortnumber {
78708
78752
  @include grid-flot-margin(left, $grid-fltr-rtl-sortnumber-margin);
@@ -78714,6 +78758,9 @@ $grid-checkmark-color: $selection-font !default;
78714
78758
  .e-headercelldiv.e-headerchkcelldiv {
78715
78759
  padding: $grid-rtl-headercelldiv-padding;
78716
78760
  text-align: right;
78761
+ @if $grid-skin == 'highcontrast' {
78762
+ margin: -7px 0;
78763
+ }
78717
78764
 
78718
78765
  & .e-sortnumber {
78719
78766
  @include grid-flot-margin(left, $grid-rtl-sortnumber-margin);
@@ -78734,9 +78781,6 @@ $grid-checkmark-color: $selection-font !default;
78734
78781
 
78735
78782
  & .e-sortnumber {
78736
78783
  margin: $grid-rtl-sort-num-left-align-margin;
78737
- @if $grid-skin == 'bootstrap4' {
78738
- margin: 4px -2px 0 0;
78739
- }
78740
78784
  }
78741
78785
  }
78742
78786
 
@@ -78755,7 +78799,7 @@ $grid-checkmark-color: $selection-font !default;
78755
78799
  }
78756
78800
 
78757
78801
  & .e-headercelldiv {
78758
- padding: 0 25px 0 .7em;
78802
+ padding: 0 1.6em 0 1.2em;
78759
78803
 
78760
78804
  & .e-sortnumber {
78761
78805
  @include grid-flot-margin(right, $grid-bigger-sort-right-margin);
@@ -99091,7 +99135,9 @@ $lg-desktop: 1399.98;
99091
99135
  .e-pv-formdesigner-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-pv-tbar-btn.e-btn {
99092
99136
  height: $pv-toolbar-btn-height;
99093
99137
  min-width: $pv-toolbar-btn-width;
99094
- width: $pv-toolbar-btn-width;
99138
+ @if ($skin-name != 'fluent2') {
99139
+ width: $pv-toolbar-btn-width;
99140
+ }
99095
99141
  @if $skin-name == 'FluentUI' {
99096
99142
  line-height: $pv-toolbar-btn-height;
99097
99143
  min-width: 40px;
@@ -100009,7 +100055,8 @@ $lg-desktop: 1399.98;
100009
100055
  padding: $pv-thumbnail-view-button-selection-padding;
100010
100056
  }
100011
100057
 
100012
- .e-pv-tbar-btn.e-pv-thumbnail-view-button.e-btn:focus
100058
+ .e-pv-tbar-btn.e-pv-thumbnail-view-button.e-btn:focus,
100059
+ .e-pv-tbar-btn.e-pv-organize-view-button.e-btn:focus
100013
100060
  {
100014
100061
  background: $pv-thumbnail-view-button-selection-background;
100015
100062
  border: $pv-thumbnail-view-button-selection-border;
@@ -100372,7 +100419,9 @@ $lg-desktop: 1399.98;
100372
100419
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-menu-icon,
100373
100420
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-menu-icon,
100374
100421
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-caret,
100375
- .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-caret {
100422
+ .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-caret,
100423
+ .e-pv-annotation-comment-panel-container .e-pv-tbar-btn,
100424
+ .e-pv-comment-panel-title-container .e-pv-annotation-tools-close-icon.e-pv-icon {
100376
100425
  color: $pv-icon-color;
100377
100426
  @if ($skin-name == 'bootstrap5' or $skin-name == 'bootstrap5-dark') {
100378
100427
  box-shadow: none;
@@ -100436,13 +100485,18 @@ $lg-desktop: 1399.98;
100436
100485
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-menu-icon:focus,
100437
100486
  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl.e-valid-input:not(.e-input-focus):hover,
100438
100487
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-caret:focus,
100439
- .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-valid-input:not(.e-input-focus):hover {
100488
+ .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-valid-input:not(.e-input-focus):hover,
100489
+ .e-pv-annotation-comment-panel-container .e-pv-tbar-btn:hover,
100490
+ .e-pv-annotation-comment-panel-container .e-pv-tbar-btn:focus {
100440
100491
  @if $skin-name == 'bootstrap4' {
100441
100492
  color: $pv-icon-color-hover;
100442
100493
  }
100443
100494
  @if $skin-name == 'bootstrap5' {
100444
100495
  color: $white;
100445
100496
  }
100497
+ @if $skin-name == 'fluent2' {
100498
+ color: var(--color-sf-toolbar-icon-color);
100499
+ }
100446
100500
  @if $skin-name == 'FluentUI' {
100447
100501
  color: $pv-item-selection-color;
100448
100502
  }
@@ -100454,7 +100508,7 @@ $lg-desktop: 1399.98;
100454
100508
  @if $skin-name == 'bootstrap4' {
100455
100509
  color: $pv-icon-color-hover;
100456
100510
  }
100457
- @if $skin-name == 'bootstrap5' {
100511
+ @if ($skin-name == 'bootstrap5') {
100458
100512
  color: $pv-icon-color;
100459
100513
  }
100460
100514
  @if $skin-name == 'FluentUI' {
@@ -100462,12 +100516,23 @@ $lg-desktop: 1399.98;
100462
100516
  }
100463
100517
  }
100464
100518
 
100519
+ .e-pv-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus-visible,
100520
+ .e-pv-annotation-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus-visible,
100521
+ .e-pv-formdesigner-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus-visible {
100522
+ @if ($skin-name == 'fluent2') {
100523
+ color: $pv-icon-color;
100524
+ }
100525
+ }
100526
+
100465
100527
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item:hover .e-menu-icon,
100466
100528
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused:hover .e-menu-icon,
100467
100529
  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused:hover .e-caret {
100468
100530
  @if $skin-name == 'bootstrap4' {
100469
100531
  color: $pv-icon-color-hover;
100470
100532
  }
100533
+ @if $skin-name == 'fluent2' {
100534
+ color: var(--color-sf-toolbar-icon-color);
100535
+ }
100471
100536
  }
100472
100537
 
100473
100538
  .e-pv-toolbar .e-toolbar-item.e-overlay .e-pv-tbar-btn.e-pv-tbar-btn .e-pv-icon,
@@ -100819,10 +100884,13 @@ $lg-desktop: 1399.98;
100819
100884
  border-bottom: 2px solid;
100820
100885
  margin-top: 0;
100821
100886
  padding-top: 5px;
100822
- @if ($skin-name=='bootstrap5'or $theme-name=='fluent2') {
100887
+ @if ($skin-name=='bootstrap5') {
100823
100888
  margin-top: -4px;
100824
100889
  padding-top: 0;
100825
100890
  }
100891
+ @if ($theme-name=='fluent2') {
100892
+ padding-top: 0;
100893
+ }
100826
100894
  @if $skin-name == 'FluentUI' {
100827
100895
  line-height: 11px;
100828
100896
  }
@@ -100834,7 +100902,12 @@ $lg-desktop: 1399.98;
100834
100902
  line-height: 1.71em;
100835
100903
  }
100836
100904
  border-bottom: 2px solid;
100837
- margin-top: 0;
100905
+ @if ($skin-name == 'fluent2') {
100906
+ margin-top: 5px;
100907
+ }
100908
+ @else {
100909
+ margin-top: 0;
100910
+ }
100838
100911
  padding-top: 1px;
100839
100912
  vertical-align: initial;
100840
100913
  @if $skin-name == 'FluentUI' {
@@ -100846,9 +100919,12 @@ $lg-desktop: 1399.98;
100846
100919
  .e-pv-properties-color-container-style-prop .e-btn-icon.e-pv-annotation-thickness-icon.e-pv-icon {
100847
100920
  margin-top: 0;
100848
100921
  padding-top: 7px;
100849
- @if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $theme-name == 'fluent2' {
100922
+ @if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' {
100850
100923
  padding-top: 0;
100851
100924
  }
100925
+ @if ( or $theme-name == 'fluent2'){
100926
+ padding-top: 5px;
100927
+ }
100852
100928
  vertical-align: initial;
100853
100929
  }
100854
100930
 
@@ -100860,6 +100936,13 @@ $lg-desktop: 1399.98;
100860
100936
  vertical-align: initial;
100861
100937
  }
100862
100938
 
100939
+ .e-pv-annotation-thickness-popup-container-mobile,
100940
+ .e-pv-annotation-opacity-popup-container-mobile {
100941
+ @if $skin-name != 'Material3' {
100942
+ background-color: $pv-annotation-opacity-popup-background-color;
100943
+ }
100944
+ }
100945
+
100863
100946
  .e-pv-annotation-opacity-popup-container,
100864
100947
  .e-pv-annotation-thickness-popup-container {
100865
100948
  @if $skin-name != 'Material3' {
@@ -101218,13 +101301,6 @@ $lg-desktop: 1399.98;
101218
101301
  }
101219
101302
  }
101220
101303
 
101221
- .e-template.e-toolbar-item:not(.e-pv-shape-template-container) .e-pv-annotation-shapes-container,
101222
- .e-template.e-toolbar-item:not(.e-pv-calibrate-template-container) .e-pv-annotation-calibrate-container {
101223
- @if ($theme-name == 'fluent2') {
101224
- line-height: 28px;
101225
- }
101226
- }
101227
-
101228
101304
  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-menu-icon .e-caret,
101229
101305
  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item.e-focused .e-menu-icon .e-caret {
101230
101306
  @if ($skin-name == 'bootstrap5') {
@@ -101307,7 +101383,6 @@ $lg-desktop: 1399.98;
101307
101383
  line-height: $pv-prop-color-picker-line-height;
101308
101384
  @if ($skin-name == 'bootstrap5') {
101309
101385
  background: $transparent;
101310
- border: 1px solid $border-light;
101311
101386
  border-radius: 4px;
101312
101387
  box-sizing: border-box;
101313
101388
  color: $content-text-color;
@@ -101322,6 +101397,13 @@ $lg-desktop: 1399.98;
101322
101397
  }
101323
101398
  }
101324
101399
 
101400
+ .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn:disabled,
101401
+ .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn:disabled{
101402
+ @if ($skin-name == 'bootstrap5') {
101403
+ color: $pv-icon-color;
101404
+ }
101405
+ }
101406
+
101325
101407
  .e-bigger .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn,
101326
101408
  .e-bigger .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn {
101327
101409
  @if $skin-name == 'FluentUI' {
@@ -101853,7 +101935,7 @@ $lg-desktop: 1399.98;
101853
101935
  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item,
101854
101936
  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item .e-pv-stamp-icon,
101855
101937
  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item .e-caret {
101856
- @if $skin-name != 'Material3' {
101938
+ @if ($skin-name != 'Material3' and $skin-name != 'fluent2') {
101857
101939
  line-height: $pv-annot-toolbar-dropdown-btn-line-height;
101858
101940
  }
101859
101941
  }
@@ -101957,14 +102039,6 @@ $lg-desktop: 1399.98;
101957
102039
  padding-top: $pv-dialog-pop-close-icon-padding-top-mobile;
101958
102040
  }
101959
102041
 
101960
- .e-pv-properties-form-field-window .e-dlg-header-content .e-btn.e-dlg-closeicon-btn,
101961
- .e-pv-signature-window .e-dlg-header-content .e-btn.e-dlg-closeicon-btn {
101962
- @if $theme-name == 'fluent2' {
101963
- padding-left: 24px !important;/* stylelint-disable-line declaration-no-important */
101964
- padding-top: 24px !important;/* stylelint-disable-line declaration-no-important */
101965
- }
101966
- }
101967
-
101968
102042
  .e-pv-organize-window .e-dlg-header-content .e-btn.e-dlg-closeicon-btn{
101969
102043
  @if $theme-name == 'fluent2' {
101970
102044
  padding: 8px !important;/* stylelint-disable-line declaration-no-important */
@@ -102307,6 +102381,8 @@ $lg-desktop: 1399.98;
102307
102381
  padding-right: 7px;
102308
102382
  @if $skin-name == 'Material3' {
102309
102383
  font-size: $text-xs;
102384
+ padding-left: 12px;
102385
+ padding-right: 12px;
102310
102386
  }
102311
102387
  }
102312
102388
 
@@ -102449,7 +102525,7 @@ $lg-desktop: 1399.98;
102449
102525
  .e-pv-comments-panel-text {
102450
102526
  font-size: 15px;
102451
102527
  padding-left: 85px;
102452
- color: rgba(var(--color-sf-on-surface-variant));
102528
+ color: var(--color-sf-content-text-color-alt1);
102453
102529
  }
102454
102530
 
102455
102531
  .e-pv-comments-content-container {
@@ -102637,8 +102713,34 @@ $lg-desktop: 1399.98;
102637
102713
  }
102638
102714
  }
102639
102715
 
102716
+ .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-caret {
102717
+ @if ($skin-name == 'fluent2') {
102718
+ margin-top: -4px;
102719
+ }
102720
+ }
102721
+
102722
+ .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-pv-stamp-icon,
102723
+ .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-caret {
102724
+ @if ($skin-name == 'fluent2') {
102725
+ margin-top: -5px;
102726
+ }
102727
+ }
102728
+
102729
+ .e-pv-annotation-shapes-container.e-btn.e-icon-btn,
102730
+ .e-pv-annotation-calibrate-container.e-btn.e-icon-btn,
102731
+ .e-pv-annotation-handwritten-container.e-btn.e-icon-btn {
102732
+ @if ($skin-name == 'fluent2') {
102733
+ padding-top: 8px;
102734
+ }
102735
+ }
102736
+
102640
102737
  .e-menu-icon.e-pv-stamp-icon.e-pv-icon {
102641
- margin-top: $pv-stamp-icon-margin-top;
102738
+ @if ($skin-name == 'fluent2') {
102739
+ margin-top: -4px;
102740
+ }
102741
+ @else {
102742
+ margin-top: $pv-stamp-icon-margin-top;
102743
+ }
102642
102744
  @if $theme-name != 'fluent2'{
102643
102745
  padding-left: 7px;
102644
102746
  }
@@ -102962,7 +103064,9 @@ $lg-desktop: 1399.98;
102962
103064
  @if $skin-name == 'bootstrap5' {
102963
103065
  color: $pv-icon-color;
102964
103066
  height: 32px;
102965
- line-height: 32px;
103067
+ @if ($theme-name != 'fluent2') {
103068
+ line-height: 32px;
103069
+ }
102966
103070
  }
102967
103071
  @else {
102968
103072
  color: $pv-icon-color;
@@ -103019,13 +103123,6 @@ $lg-desktop: 1399.98;
103019
103123
  border-color: $pv-annotation-dropdown-border-color;
103020
103124
  }
103021
103125
 
103022
- .e-bigger .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-pv-stamp-icon,
103023
- .e-bigger .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-caret {
103024
- @if $theme-name == 'fluent2' {
103025
- margin-top: -10px;
103026
- }
103027
- }
103028
-
103029
103126
  .e-pv-custom-annotation-stamp-container.e-menu-container .e-ul .e-menu-item.e-selected,
103030
103127
  .e-pv-custom-annotation-stamp-container.e-menu-container.e-menu-container .e-ul .e-menu-item.e-focused {
103031
103128
  @if $skin-name == 'bootstrap4' {
@@ -103594,6 +103691,7 @@ $lg-desktop: 1399.98;
103594
103691
 
103595
103692
  .e-pv-properties-form-field-group-btn-div {
103596
103693
  display: grid;
103694
+ align-content: space-between;
103597
103695
  }
103598
103696
 
103599
103697
  .e-pv-properties-form-field-option-dropdown-list-div {
@@ -103952,7 +104050,6 @@ $lg-desktop: 1399.98;
103952
104050
  }
103953
104051
  @if $theme-name == 'fluent2'{
103954
104052
  font-family: $font-family;
103955
- margin-left: 7px;
103956
104053
  }
103957
104054
  }
103958
104055
 
@@ -124924,6 +125021,7 @@ $ribbon-items-focus-box-shadow: none !default;
124924
125021
 
124925
125022
  .e-disabled {
124926
125023
  opacity: $ribbon-disabled-opacity;
125024
+ pointer-events: none;
124927
125025
  }
124928
125026
 
124929
125027
  .e-input-group {
@@ -1007,7 +1007,13 @@ $slider-button-vup-bg-image: none !default;
1007
1007
  &.e-scale {
1008
1008
  &.e-h-scale {
1009
1009
  .e-tick {
1010
- @if ($skin-name != 'material' and $skin-name != 'material-dark') {
1010
+ @if ($skin-name != 'material' and $skin-name == 'material-dark') {
1011
+ @include alignment($tick-after-height, $tick-after-top, 'horizontal');
1012
+ @if ($skin-name == 'material-dark') {
1013
+ background-position: bottom;
1014
+ }
1015
+ }
1016
+ @else if ($skin-name != 'material' and $skin-name != 'material-dark') {
1011
1017
  @include alignment($tick-after-height, $tick-after-top, 'horizontal');
1012
1018
  }
1013
1019
  @else {
@@ -1017,7 +1023,10 @@ $slider-button-vup-bg-image: none !default;
1017
1023
  }
1018
1024
 
1019
1025
  .e-large {
1020
- @if ($skin-name != 'material' and $skin-name != 'material-dark') {
1026
+ @if ($skin-name != 'material' and $skin-name == 'material-dark') {
1027
+ @include alignment($largetick-before-height, $largetick-before-top, 'horizontal');
1028
+ }
1029
+ @else if ($skin-name != 'material' and $skin-name != 'material-dark') {
1021
1030
  @include alignment($largetick-before-height, $largetick-before-top, 'horizontal');
1022
1031
  }
1023
1032
  }
@@ -1047,7 +1056,13 @@ $slider-button-vup-bg-image: none !default;
1047
1056
  &.e-scale {
1048
1057
  &.e-h-scale {
1049
1058
  .e-tick {
1050
- @if ($skin-name != 'material' and $skin-name != 'material-dark') {
1059
+ @if ($skin-name != 'material' and $skin-name == 'material-dark') {
1060
+ @include alignment($tick-before-height, $tick-before-top, 'horizontal');
1061
+ @if ($skin-name == 'material-dark') {
1062
+ background-position-x: center;
1063
+ }
1064
+ }
1065
+ @else if ($skin-name != 'material' and $skin-name != 'material-dark') {
1051
1066
  @include alignment($tick-before-height, $tick-before-top, 'horizontal');
1052
1067
  }
1053
1068
  @else {
@@ -1057,7 +1072,10 @@ $slider-button-vup-bg-image: none !default;
1057
1072
  }
1058
1073
 
1059
1074
  .e-large {
1060
- @if ($skin-name != 'material' and $skin-name != 'material-dark') {
1075
+ @if ($skin-name != 'material' and $skin-name == 'material-dark') {
1076
+ @include alignment($largetick-after-height, $largetick-after-top, 'horizontal');
1077
+ }
1078
+ @else if ($skin-name != 'material' and $skin-name != 'material-dark') {
1061
1079
  @include alignment($largetick-after-height, $largetick-after-top, 'horizontal');
1062
1080
  }
1063
1081
  }
@@ -1133,7 +1151,12 @@ $slider-button-vup-bg-image: none !default;
1133
1151
  }
1134
1152
  @if ($skin-name == 'material' or $skin-name == 'material-dark') {
1135
1153
  background-position: center;
1136
- height: 99%;
1154
+ @if ($skin-name == 'material-dark') {
1155
+ height: 12px;
1156
+ }
1157
+ @else {
1158
+ height: 99%;
1159
+ }
1137
1160
  }
1138
1161
  }
1139
1162
 
@@ -1159,6 +1182,10 @@ $slider-button-vup-bg-image: none !default;
1159
1182
  @else if ($skin-name == 'fabric' or $skin-name == 'fabric-dark' or $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light') {
1160
1183
  @include alignment(calc(100% + 3px), -9px, 'horizontal');
1161
1184
  }
1185
+ @else if ($skin-name == 'material-dark') {
1186
+ height: 20px;
1187
+ top: 4px;
1188
+ }
1162
1189
  }
1163
1190
  }
1164
1191
 
@@ -1258,7 +1285,7 @@ $slider-button-vup-bg-image: none !default;
1258
1285
  background-position: center center;
1259
1286
  }
1260
1287
 
1261
- @if ($skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3') {
1288
+ @if ($skin-name == 'bootstrap4' or $skin-name == 'tailwind' or $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' or $skin-name == 'Material3' or $skin-name == 'material-dark') {
1262
1289
  &.e-large {
1263
1290
  @if ($skin-name != 'bootstrap4') {
1264
1291
  background-image: $slider-scale-tick-image-dark;
@@ -1348,7 +1375,7 @@ $slider-button-vup-bg-image: none !default;
1348
1375
  .e-tick {
1349
1376
  display: inline-block;
1350
1377
  @if ($skin-name == 'material' or $skin-name == 'material-dark') {
1351
- background-repeat: no-repeat;
1378
+ background-repeat: repeat-y;
1352
1379
  }
1353
1380
 
1354
1381
  @if ($skin-name != 'material' and $skin-name != 'material-dark') {