@syncfusion/ej2-ribbon 26.2.4 → 26.2.7

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 (59) hide show
  1. package/dist/ej2-ribbon.umd.min.js +1 -1
  2. package/dist/global/ej2-ribbon.min.js +1 -1
  3. package/dist/global/index.d.ts +1 -1
  4. package/hotfix/26.1.35_Vol2.txt +1 -0
  5. package/package.json +12 -12
  6. package/styles/bootstrap-dark.css +50 -4
  7. package/styles/bootstrap.css +50 -4
  8. package/styles/bootstrap4.css +50 -4
  9. package/styles/bootstrap5-dark.css +50 -4
  10. package/styles/bootstrap5.css +50 -4
  11. package/styles/fabric-dark.css +50 -4
  12. package/styles/fabric.css +50 -4
  13. package/styles/fluent-dark.css +50 -4
  14. package/styles/fluent.css +50 -4
  15. package/styles/fluent2.css +60 -14
  16. package/styles/highcontrast-light.css +50 -4
  17. package/styles/highcontrast.css +50 -4
  18. package/styles/material-dark.css +50 -4
  19. package/styles/material.css +50 -4
  20. package/styles/material3-dark.css +50 -4
  21. package/styles/material3.css +50 -4
  22. package/styles/ribbon/_bds-definition.scss +6 -0
  23. package/styles/ribbon/_bootstrap-dark-definition.scss +6 -0
  24. package/styles/ribbon/_bootstrap-definition.scss +6 -0
  25. package/styles/ribbon/_bootstrap4-definition.scss +6 -0
  26. package/styles/ribbon/_bootstrap5-definition.scss +6 -0
  27. package/styles/ribbon/_bootstrap5.3-definition.scss +6 -0
  28. package/styles/ribbon/_fabric-dark-definition.scss +6 -0
  29. package/styles/ribbon/_fabric-definition.scss +6 -0
  30. package/styles/ribbon/_fluent-definition.scss +6 -0
  31. package/styles/ribbon/_fluent2-definition.scss +6 -0
  32. package/styles/ribbon/_fusionnew-definition.scss +6 -0
  33. package/styles/ribbon/_highcontrast-definition.scss +6 -0
  34. package/styles/ribbon/_highcontrast-light-definition.scss +6 -0
  35. package/styles/ribbon/_layout.scss +32 -4
  36. package/styles/ribbon/_material-dark-definition.scss +6 -0
  37. package/styles/ribbon/_material-definition.scss +6 -0
  38. package/styles/ribbon/_material3-definition.scss +6 -0
  39. package/styles/ribbon/_tailwind-definition.scss +6 -0
  40. package/styles/ribbon/bootstrap-dark.css +50 -4
  41. package/styles/ribbon/bootstrap.css +50 -4
  42. package/styles/ribbon/bootstrap4.css +50 -4
  43. package/styles/ribbon/bootstrap5-dark.css +50 -4
  44. package/styles/ribbon/bootstrap5.css +50 -4
  45. package/styles/ribbon/fabric-dark.css +50 -4
  46. package/styles/ribbon/fabric.css +50 -4
  47. package/styles/ribbon/fluent-dark.css +50 -4
  48. package/styles/ribbon/fluent.css +50 -4
  49. package/styles/ribbon/fluent2.css +60 -14
  50. package/styles/ribbon/highcontrast-light.css +50 -4
  51. package/styles/ribbon/highcontrast.css +50 -4
  52. package/styles/ribbon/material-dark.css +50 -4
  53. package/styles/ribbon/material.css +50 -4
  54. package/styles/ribbon/material3-dark.css +50 -4
  55. package/styles/ribbon/material3.css +50 -4
  56. package/styles/ribbon/tailwind-dark.css +50 -4
  57. package/styles/ribbon/tailwind.css +50 -4
  58. package/styles/tailwind-dark.css +50 -4
  59. package/styles/tailwind.css +50 -4
package/styles/ribbon/fluent-dark.css CHANGED
@@ -849,6 +849,11 @@
849
849
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
850
850
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
851
851
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret) {
852
+ min-height: 24px;
853
+ min-width: 24px;
854
+ background-repeat: no-repeat;
855
+ background-size: contain;
856
+ background-position: center;
852
857
  font-size: 24px;
853
858
  font-weight: 400;
854
859
  padding: 8px 6px 4px;
@@ -989,6 +994,15 @@
989
994
  line-height: 16px;
990
995
  margin: 5px;
991
996
  }
997
+ .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret), .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
998
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
999
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret) {
1000
+ min-height: 16px;
1001
+ min-width: 16px;
1002
+ background-repeat: no-repeat;
1003
+ background-size: contain;
1004
+ background-position: center;
1005
+ }
992
1006
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-colorpicker-wrapper .e-split-btn-wrapper, .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-colorpicker-wrapper .e-split-btn-wrapper,
993
1007
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-colorpicker-wrapper .e-split-btn-wrapper,
994
1008
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-colorpicker-wrapper .e-split-btn-wrapper {
@@ -1139,6 +1153,10 @@
1139
1153
  width: 100%;
1140
1154
  height: 32px;
1141
1155
  }
1156
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret) {
1157
+ min-width: 14px;
1158
+ min-height: 14px;
1159
+ }
1142
1160
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1143
1161
  margin: 0;
1144
1162
  }
@@ -1170,7 +1188,7 @@
1170
1188
  margin-left: 34px;
1171
1189
  }
1172
1190
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1173
- padding: 9px 8px 9px 12px;
1191
+ margin: 9px 8px 9px 12px;
1174
1192
  }
1175
1193
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1176
1194
  padding-left: 34px;
@@ -1194,7 +1212,7 @@
1194
1212
  margin-right: 34px;
1195
1213
  }
1196
1214
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1197
- padding: 9px 12px 9px 8px;
1215
+ margin: 9px 12px 9px 8px;
1198
1216
  }
1199
1217
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1200
1218
  padding-right: 34px;
@@ -1695,6 +1713,11 @@
1695
1713
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1696
1714
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1697
1715
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret) {
1716
+ min-height: 32px;
1717
+ min-width: 32px;
1718
+ background-repeat: no-repeat;
1719
+ background-size: contain;
1720
+ background-position: center;
1698
1721
  font-size: 32px;
1699
1722
  padding: 8px 3px;
1700
1723
  }
@@ -1769,6 +1792,24 @@
1769
1792
  line-height: 20px;
1770
1793
  margin: 7px;
1771
1794
  }
1795
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret), .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1796
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1797
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1798
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1799
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1800
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1801
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1802
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1803
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1804
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1805
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1806
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1807
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1808
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1809
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret) {
1810
+ min-width: 20px;
1811
+ min-height: 20px;
1812
+ }
1772
1813
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-split-colorpicker.e-split-btn, .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
1773
1814
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-split-colorpicker.e-split-btn,
1774
1815
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
@@ -1874,6 +1915,11 @@
1874
1915
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon {
1875
1916
  font-size: 20px;
1876
1917
  }
1918
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon:not(.e-caret),
1919
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon:not(.e-caret) {
1920
+ min-width: 20px;
1921
+ min-height: 20px;
1922
+ }
1877
1923
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon.e-icon-left,
1878
1924
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon.e-icon-left {
1879
1925
  margin: 0;
@@ -1913,7 +1959,7 @@
1913
1959
  }
1914
1960
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left,
1915
1961
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1916
- padding: 11px 12px 11px 16px;
1962
+ margin: 11px 12px 11px 16px;
1917
1963
  }
1918
1964
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1919
1965
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
@@ -1942,7 +1988,7 @@
1942
1988
  }
1943
1989
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left,
1944
1990
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1945
- padding: 11px 16px 11px 12px;
1991
+ margin: 11px 16px 11px 12px;
1946
1992
  }
1947
1993
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1948
1994
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
package/styles/ribbon/fluent.css CHANGED
@@ -849,6 +849,11 @@
849
849
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
850
850
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
851
851
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret) {
852
+ min-height: 24px;
853
+ min-width: 24px;
854
+ background-repeat: no-repeat;
855
+ background-size: contain;
856
+ background-position: center;
852
857
  font-size: 24px;
853
858
  font-weight: 400;
854
859
  padding: 8px 6px 4px;
@@ -989,6 +994,15 @@
989
994
  line-height: 16px;
990
995
  margin: 5px;
991
996
  }
997
+ .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret), .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
998
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
999
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret) {
1000
+ min-height: 16px;
1001
+ min-width: 16px;
1002
+ background-repeat: no-repeat;
1003
+ background-size: contain;
1004
+ background-position: center;
1005
+ }
992
1006
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-colorpicker-wrapper .e-split-btn-wrapper, .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-colorpicker-wrapper .e-split-btn-wrapper,
993
1007
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-colorpicker-wrapper .e-split-btn-wrapper,
994
1008
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-colorpicker-wrapper .e-split-btn-wrapper {
@@ -1139,6 +1153,10 @@
1139
1153
  width: 100%;
1140
1154
  height: 32px;
1141
1155
  }
1156
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret) {
1157
+ min-width: 14px;
1158
+ min-height: 14px;
1159
+ }
1142
1160
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1143
1161
  margin: 0;
1144
1162
  }
@@ -1170,7 +1188,7 @@
1170
1188
  margin-left: 34px;
1171
1189
  }
1172
1190
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1173
- padding: 9px 8px 9px 12px;
1191
+ margin: 9px 8px 9px 12px;
1174
1192
  }
1175
1193
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1176
1194
  padding-left: 34px;
@@ -1194,7 +1212,7 @@
1194
1212
  margin-right: 34px;
1195
1213
  }
1196
1214
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1197
- padding: 9px 12px 9px 8px;
1215
+ margin: 9px 12px 9px 8px;
1198
1216
  }
1199
1217
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1200
1218
  padding-right: 34px;
@@ -1695,6 +1713,11 @@
1695
1713
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1696
1714
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1697
1715
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret) {
1716
+ min-height: 32px;
1717
+ min-width: 32px;
1718
+ background-repeat: no-repeat;
1719
+ background-size: contain;
1720
+ background-position: center;
1698
1721
  font-size: 32px;
1699
1722
  padding: 8px 3px;
1700
1723
  }
@@ -1769,6 +1792,24 @@
1769
1792
  line-height: 20px;
1770
1793
  margin: 7px;
1771
1794
  }
1795
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret), .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1796
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1797
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1798
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1799
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1800
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1801
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1802
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1803
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1804
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1805
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1806
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1807
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1808
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1809
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret) {
1810
+ min-width: 20px;
1811
+ min-height: 20px;
1812
+ }
1772
1813
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-split-colorpicker.e-split-btn, .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
1773
1814
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-split-colorpicker.e-split-btn,
1774
1815
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
@@ -1874,6 +1915,11 @@
1874
1915
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon {
1875
1916
  font-size: 20px;
1876
1917
  }
1918
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon:not(.e-caret),
1919
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon:not(.e-caret) {
1920
+ min-width: 20px;
1921
+ min-height: 20px;
1922
+ }
1877
1923
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon.e-icon-left,
1878
1924
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon.e-icon-left {
1879
1925
  margin: 0;
@@ -1913,7 +1959,7 @@
1913
1959
  }
1914
1960
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left,
1915
1961
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1916
- padding: 11px 12px 11px 16px;
1962
+ margin: 11px 12px 11px 16px;
1917
1963
  }
1918
1964
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1919
1965
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
@@ -1942,7 +1988,7 @@
1942
1988
  }
1943
1989
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left,
1944
1990
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1945
- padding: 11px 16px 11px 12px;
1991
+ margin: 11px 16px 11px 12px;
1946
1992
  }
1947
1993
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1948
1994
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
package/styles/ribbon/fluent2.css CHANGED
@@ -47,7 +47,7 @@
47
47
  --color-sf-flyout-bg-color-pressed: #e0e0e0;
48
48
  --color-sf-flyout-bg-color-selected: #ebebeb;
49
49
  --color-sf-flyout-bg-color-focus: #f5f5f5;
50
- --color-sf-overlay-bg-color: #000;
50
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
51
51
  --color-sf-table-bg-color-hover: #f5f5f5;
52
52
  --color-sf-table-bg-color-pressed: #e0e0e0;
53
53
  --color-sf-table-bg-color-selected: #ebf3fc;
@@ -369,7 +369,7 @@
369
369
  --color-sf-flyout-bg-color-pressed: var(--color-sf-black);
370
370
  --color-sf-flyout-bg-color-selected: #383838;
371
371
  --color-sf-flyout-bg-color-focus: var(--color-sf-flyout-bg-color-hover);
372
- --color-sf-overlay-bg-color: rgba($black, .4);
372
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
373
373
  --color-sf-table-bg-color-hover: #383838;
374
374
  --color-sf-table-bg-color-pressed: #2e2e2e;
375
375
  --color-sf-table-bg-color-selected: #082338;
@@ -711,9 +711,9 @@
711
711
  --color-sf-flyout-bg-color-pressed: var(--color-sf-content-bg-color-hover);
712
712
  --color-sf-flyout-bg-color-selected: var(--color-sf-content-bg-color-hover);
713
713
  --color-sf-flyout-bg-color-focus: var(--color-sf-content-bg-color-hover);
714
- --color-sf-overlay-bg-color: rgba($black, .4);
715
- --color-sf-table-bg-color-hover: var(--color-sf-black);
716
- --color-sf-table-bg-color-pressed: var(--color-sf-black);
714
+ --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
715
+ --color-sf-table-bg-color-hover: #1a3bff;
716
+ --color-sf-table-bg-color-pressed: #1a3bff;
717
717
  --color-sf-table-bg-color-selected: #1a3bff;
718
718
  --color-sf-content-text-color: #fff;
719
719
  --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
@@ -732,12 +732,12 @@
732
732
  --color-sf-flyout-text-color-selected: var(--color-sf-content-text-color-hover);
733
733
  --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color-hover);
734
734
  --color-sf-flyout-text-color-disabled: var(--color-sf-content-text-color-disabled);
735
- --color-sf-table-text-color-hover: var(--color-sf-content-text-color-hover);
736
- --color-sf-table-text-color-pressed: var(--color-sf-content-text-color-hover);
737
- --color-sf-table-text-color-selected: var(--color-sf-content-text-color-hover);
735
+ --color-sf-table-text-color-hover: #000;
736
+ --color-sf-table-text-color-pressed: #000;
737
+ --color-sf-table-text-color-selected: #000;
738
738
  --color-sf-icon-color: #fff;
739
- --color-sf-icon-color-hover: var(--color-sf-content-text-color-hover);
740
- --color-sf-icon-color-pressed: var(--color-sf-content-text-color-hover);
739
+ --color-sf-icon-color-hover: #000;
740
+ --color-sf-icon-color-pressed: #000;
741
741
  --color-sf-icon-color-disabled: var(--color-sf-content-text-color-disabled);
742
742
  --color-sf-border-light: #fff;
743
743
  --color-sf-border: var(--color-sf-border-light);
@@ -1922,6 +1922,11 @@
1922
1922
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1923
1923
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1924
1924
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret) {
1925
+ min-height: 24px;
1926
+ min-width: 24px;
1927
+ background-repeat: no-repeat;
1928
+ background-size: contain;
1929
+ background-position: center;
1925
1930
  font-size: 24px;
1926
1931
  font-weight: 400;
1927
1932
  padding: 8px 0 4px;
@@ -2062,6 +2067,15 @@
2062
2067
  line-height: 16px;
2063
2068
  margin: 8px;
2064
2069
  }
2070
+ .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret), .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
2071
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
2072
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret) {
2073
+ min-height: 16px;
2074
+ min-width: 16px;
2075
+ background-repeat: no-repeat;
2076
+ background-size: contain;
2077
+ background-position: center;
2078
+ }
2065
2079
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-colorpicker-wrapper .e-split-btn-wrapper, .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-colorpicker-wrapper .e-split-btn-wrapper,
2066
2080
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-colorpicker-wrapper .e-split-btn-wrapper,
2067
2081
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-colorpicker-wrapper .e-split-btn-wrapper {
@@ -2212,6 +2226,10 @@
2212
2226
  width: 100%;
2213
2227
  height: 32px;
2214
2228
  }
2229
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret) {
2230
+ min-width: 16px;
2231
+ min-height: 16px;
2232
+ }
2215
2233
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
2216
2234
  margin: 0;
2217
2235
  }
@@ -2243,7 +2261,7 @@
2243
2261
  margin-left: 37px;
2244
2262
  }
2245
2263
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
2246
- padding: 8px 10px 8px 8px;
2264
+ margin: 8px 10px 8px 8px;
2247
2265
  }
2248
2266
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
2249
2267
  padding-left: 37px;
@@ -2267,7 +2285,7 @@
2267
2285
  margin-right: 37px;
2268
2286
  }
2269
2287
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
2270
- padding: 8px 8px 8px 10px;
2288
+ margin: 8px 8px 8px 10px;
2271
2289
  }
2272
2290
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
2273
2291
  padding-right: 37px;
@@ -2768,6 +2786,11 @@
2768
2786
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
2769
2787
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
2770
2788
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret) {
2789
+ min-height: 32px;
2790
+ min-width: 32px;
2791
+ background-repeat: no-repeat;
2792
+ background-size: contain;
2793
+ background-position: center;
2771
2794
  font-size: 32px;
2772
2795
  padding: 8px 0 4px;
2773
2796
  }
@@ -2842,6 +2865,24 @@
2842
2865
  line-height: 18px;
2843
2866
  margin: 11px;
2844
2867
  }
2868
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret), .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
2869
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
2870
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
2871
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
2872
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
2873
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
2874
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
2875
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
2876
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
2877
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
2878
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
2879
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
2880
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
2881
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
2882
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret) {
2883
+ min-width: 18px;
2884
+ min-height: 18px;
2885
+ }
2845
2886
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-split-colorpicker.e-split-btn, .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
2846
2887
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-split-colorpicker.e-split-btn,
2847
2888
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
@@ -2947,6 +2988,11 @@
2947
2988
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon {
2948
2989
  font-size: 16px;
2949
2990
  }
2991
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon:not(.e-caret),
2992
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon:not(.e-caret) {
2993
+ min-width: 16px;
2994
+ min-height: 16px;
2995
+ }
2950
2996
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon.e-icon-left,
2951
2997
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon.e-icon-left {
2952
2998
  margin: 0;
@@ -2986,7 +3032,7 @@
2986
3032
  }
2987
3033
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left,
2988
3034
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
2989
- padding: 12px 12px 12px 10px;
3035
+ margin: 12px 12px 12px 10px;
2990
3036
  }
2991
3037
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
2992
3038
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
@@ -3015,7 +3061,7 @@
3015
3061
  }
3016
3062
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left,
3017
3063
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
3018
- padding: 12px 10px 12px 12px;
3064
+ margin: 12px 10px 12px 12px;
3019
3065
  }
3020
3066
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
3021
3067
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
package/styles/ribbon/highcontrast-light.css CHANGED
@@ -759,6 +759,11 @@
759
759
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
760
760
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
761
761
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret) {
762
+ min-height: 32px;
763
+ min-width: 32px;
764
+ background-repeat: no-repeat;
765
+ background-size: contain;
766
+ background-position: center;
762
767
  font-size: 32px;
763
768
  font-weight: 400;
764
769
  padding: 12px 10px 4px;
@@ -899,6 +904,15 @@
899
904
  line-height: 16px;
900
905
  margin: 10px;
901
906
  }
907
+ .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret), .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
908
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
909
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret) {
910
+ min-height: 16px;
911
+ min-width: 16px;
912
+ background-repeat: no-repeat;
913
+ background-size: contain;
914
+ background-position: center;
915
+ }
902
916
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-colorpicker-wrapper .e-split-btn-wrapper, .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-colorpicker-wrapper .e-split-btn-wrapper,
903
917
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-colorpicker-wrapper .e-split-btn-wrapper,
904
918
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-colorpicker-wrapper .e-split-btn-wrapper {
@@ -1049,6 +1063,10 @@
1049
1063
  width: 100%;
1050
1064
  height: 32px;
1051
1065
  }
1066
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret) {
1067
+ min-width: 16px;
1068
+ min-height: 16px;
1069
+ }
1052
1070
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1053
1071
  margin: 0;
1054
1072
  }
@@ -1080,7 +1098,7 @@
1080
1098
  margin-left: 38px;
1081
1099
  }
1082
1100
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1083
- padding: 8px 8px 8px 12px;
1101
+ margin: 8px 8px 8px 12px;
1084
1102
  }
1085
1103
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1086
1104
  padding-left: 38px;
@@ -1104,7 +1122,7 @@
1104
1122
  margin-right: 38px;
1105
1123
  }
1106
1124
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1107
- padding: 8px 12px 8px 8px;
1125
+ margin: 8px 12px 8px 8px;
1108
1126
  }
1109
1127
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1110
1128
  padding-right: 38px;
@@ -1605,6 +1623,11 @@
1605
1623
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1606
1624
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1607
1625
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret) {
1626
+ min-height: 36px;
1627
+ min-width: 36px;
1628
+ background-repeat: no-repeat;
1629
+ background-size: contain;
1630
+ background-position: center;
1608
1631
  font-size: 36px;
1609
1632
  padding: 12px 8px 0;
1610
1633
  }
@@ -1679,6 +1702,24 @@
1679
1702
  line-height: 20px;
1680
1703
  margin: 10px;
1681
1704
  }
1705
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret), .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1706
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1707
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1708
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1709
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1710
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1711
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1712
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1713
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1714
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1715
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1716
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1717
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1718
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1719
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret) {
1720
+ min-width: 20px;
1721
+ min-height: 20px;
1722
+ }
1682
1723
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-split-colorpicker.e-split-btn, .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
1683
1724
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-split-colorpicker.e-split-btn,
1684
1725
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
@@ -1784,6 +1825,11 @@
1784
1825
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon {
1785
1826
  font-size: 18px;
1786
1827
  }
1828
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon:not(.e-caret),
1829
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon:not(.e-caret) {
1830
+ min-width: 18px;
1831
+ min-height: 18px;
1832
+ }
1787
1833
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon.e-icon-left,
1788
1834
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon.e-icon-left {
1789
1835
  margin: 0;
@@ -1823,7 +1869,7 @@
1823
1869
  }
1824
1870
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left,
1825
1871
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1826
- padding: 10px 12px 10px 16px;
1872
+ margin: 10px 12px 10px 16px;
1827
1873
  }
1828
1874
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1829
1875
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
@@ -1852,7 +1898,7 @@
1852
1898
  }
1853
1899
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left,
1854
1900
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1855
- padding: 10px 16px 10px 12px;
1901
+ margin: 10px 16px 10px 12px;
1856
1902
  }
1857
1903
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1858
1904
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
package/styles/ribbon/highcontrast.css CHANGED
@@ -764,6 +764,11 @@
764
764
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
765
765
  .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
766
766
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret) {
767
+ min-height: 32px;
768
+ min-width: 32px;
769
+ background-repeat: no-repeat;
770
+ background-size: contain;
771
+ background-position: center;
767
772
  font-size: 32px;
768
773
  font-weight: 400;
769
774
  padding: 12px 10px 4px;
@@ -904,6 +909,15 @@
904
909
  line-height: 16px;
905
910
  margin: 10px;
906
911
  }
912
+ .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret), .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
913
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
914
+ .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret) {
915
+ min-height: 16px;
916
+ min-width: 16px;
917
+ background-repeat: no-repeat;
918
+ background-size: contain;
919
+ background-position: center;
920
+ }
907
921
  .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-colorpicker-wrapper .e-split-btn-wrapper, .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-colorpicker-wrapper .e-split-btn-wrapper,
908
922
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-colorpicker-wrapper .e-split-btn-wrapper,
909
923
  .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-colorpicker-wrapper .e-split-btn-wrapper {
@@ -1054,6 +1068,10 @@
1054
1068
  width: 100%;
1055
1069
  height: 32px;
1056
1070
  }
1071
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret) {
1072
+ min-width: 14px;
1073
+ min-height: 14px;
1074
+ }
1057
1075
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1058
1076
  margin: 0;
1059
1077
  }
@@ -1085,7 +1103,7 @@
1085
1103
  margin-left: 34px;
1086
1104
  }
1087
1105
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1088
- padding: 9px 8px 9px 12px;
1106
+ margin: 9px 8px 9px 12px;
1089
1107
  }
1090
1108
  .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1091
1109
  padding-left: 34px;
@@ -1109,7 +1127,7 @@
1109
1127
  margin-right: 34px;
1110
1128
  }
1111
1129
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1112
- padding: 9px 12px 9px 8px;
1130
+ margin: 9px 12px 9px 8px;
1113
1131
  }
1114
1132
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
1115
1133
  padding-right: 34px;
@@ -1610,6 +1628,11 @@
1610
1628
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1611
1629
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret),
1612
1630
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-large-item .e-btn .e-btn-icon:not(.e-caret) {
1631
+ min-height: 36px;
1632
+ min-width: 36px;
1633
+ background-repeat: no-repeat;
1634
+ background-size: contain;
1635
+ background-position: center;
1613
1636
  font-size: 36px;
1614
1637
  padding: 12px 8px 0;
1615
1638
  }
@@ -1684,6 +1707,24 @@
1684
1707
  line-height: 20px;
1685
1708
  margin: 10px;
1686
1709
  }
1710
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret), .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1711
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1712
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1713
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1714
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1715
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1716
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1717
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1718
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1719
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1720
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1721
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1722
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-group-overflow.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret),
1723
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon:not(.e-caret),
1724
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-item.e-ribbon-small-item .e-btn .e-btn-icon:not(.e-caret) {
1725
+ min-width: 20px;
1726
+ min-height: 20px;
1727
+ }
1687
1728
  .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-medium-item .e-split-colorpicker.e-split-btn, .e-bigger.e-ribbon.e-rbn .e-ribbon-group-overflow.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
1688
1729
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-medium-item .e-split-colorpicker.e-split-btn,
1689
1730
  .e-bigger.e-ribbon.e-rbn .e-ribbon-item.e-ribbon-small-item .e-split-colorpicker.e-split-btn,
@@ -1789,6 +1830,11 @@
1789
1830
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon {
1790
1831
  font-size: 18px;
1791
1832
  }
1833
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon:not(.e-caret),
1834
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon:not(.e-caret) {
1835
+ min-width: 18px;
1836
+ min-height: 18px;
1837
+ }
1792
1838
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon.e-icon-left,
1793
1839
  .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-btn .e-btn-icon.e-icon-left {
1794
1840
  margin: 0;
@@ -1828,7 +1874,7 @@
1828
1874
  }
1829
1875
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left,
1830
1876
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1831
- padding: 11px 12px 11px 16px;
1877
+ margin: 11px 12px 11px 16px;
1832
1878
  }
1833
1879
  .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1834
1880
  .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {
@@ -1857,7 +1903,7 @@
1857
1903
  }
1858
1904
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left,
1859
1905
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item .e-btn .e-btn-icon.e-icon-left {
1860
- padding: 11px 16px 11px 12px;
1906
+ margin: 11px 16px 11px 12px;
1861
1907
  }
1862
1908
  .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)),
1863
1909
  .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item:not(:has(.e-colorpicker-wrapper)) .e-btn:not(:has(.e-btn-icon.e-icon-left)) {