@syncfusion/ej2-ribbon 21.2.3 → 22.1.39

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 (102) hide show
  1. package/.eslintrc.json +1 -0
  2. package/CHANGELOG.md +8 -0
  3. package/dist/ej2-ribbon.umd.min.js +2 -2
  4. package/dist/ej2-ribbon.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-ribbon.es2015.js +1254 -165
  6. package/dist/es6/ej2-ribbon.es2015.js.map +1 -1
  7. package/dist/es6/ej2-ribbon.es5.js +1275 -180
  8. package/dist/es6/ej2-ribbon.es5.js.map +1 -1
  9. package/dist/global/ej2-ribbon.min.js +2 -2
  10. package/dist/global/ej2-ribbon.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +16 -13
  13. package/src/ribbon/base/interface.d.ts +6 -6
  14. package/src/ribbon/base/interface.js +6 -6
  15. package/src/ribbon/base/ribbon-model.d.ts +2 -2
  16. package/src/ribbon/base/ribbon.d.ts +43 -1
  17. package/src/ribbon/base/ribbon.js +1074 -163
  18. package/src/ribbon/base/utils.d.ts +2 -2
  19. package/src/ribbon/base/utils.js +16 -10
  20. package/src/ribbon/items/ribbon-button.js +1 -0
  21. package/src/ribbon/items/ribbon-checkbox.js +1 -0
  22. package/src/ribbon/items/ribbon-colorpicker.js +1 -0
  23. package/src/ribbon/items/ribbon-combobox.js +1 -0
  24. package/src/ribbon/items/ribbon-dropdown.d.ts +7 -1
  25. package/src/ribbon/items/ribbon-dropdown.js +152 -1
  26. package/src/ribbon/items/ribbon-splitbutton.js +24 -0
  27. package/src/ribbon/models/ribbon-combobox-settings-model.d.ts +10 -5
  28. package/src/ribbon/models/ribbon-combobox-settings.d.ts +10 -5
  29. package/src/ribbon/models/ribbon-file-menu-settings-model.d.ts +3 -1
  30. package/src/ribbon/models/ribbon-file-menu-settings.d.ts +3 -1
  31. package/src/ribbon/models/ribbon-item-model.d.ts +1 -1
  32. package/src/ribbon/models/ribbon-item.d.ts +1 -1
  33. package/styles/bootstrap-dark.css +27 -0
  34. package/styles/bootstrap.css +27 -0
  35. package/styles/bootstrap4.css +27 -0
  36. package/styles/bootstrap5-dark.css +27 -0
  37. package/styles/bootstrap5.css +27 -0
  38. package/styles/fabric-dark.css +27 -0
  39. package/styles/fabric.css +27 -0
  40. package/styles/fluent-dark.css +27 -0
  41. package/styles/fluent.css +27 -0
  42. package/styles/highcontrast-light.css +27 -0
  43. package/styles/highcontrast.css +31 -4
  44. package/styles/material-dark.css +27 -0
  45. package/styles/material.css +27 -0
  46. package/styles/material3-dark.css +1672 -0
  47. package/styles/material3-dark.scss +3 -0
  48. package/styles/material3.css +1728 -0
  49. package/styles/material3.scss +3 -0
  50. package/styles/ribbon/_bootstrap-dark-definition.scss +4 -0
  51. package/styles/ribbon/_bootstrap-definition.scss +4 -0
  52. package/styles/ribbon/_bootstrap4-definition.scss +4 -0
  53. package/styles/ribbon/_bootstrap5-definition.scss +4 -0
  54. package/styles/ribbon/_fabric-dark-definition.scss +4 -0
  55. package/styles/ribbon/_fabric-definition.scss +4 -0
  56. package/styles/ribbon/_fluent-definition.scss +4 -0
  57. package/styles/ribbon/_fusionnew-definition.scss +4 -0
  58. package/styles/ribbon/_highcontrast-definition.scss +6 -2
  59. package/styles/ribbon/_highcontrast-light-definition.scss +4 -0
  60. package/styles/ribbon/_layout.scss +28 -0
  61. package/styles/ribbon/_material-dark-definition.scss +4 -0
  62. package/styles/ribbon/_material-definition.scss +4 -0
  63. package/styles/ribbon/_material3-dark-definition.scss +1 -0
  64. package/styles/ribbon/_material3-definition.scss +210 -0
  65. package/styles/ribbon/_tailwind-definition.scss +4 -0
  66. package/styles/ribbon/bootstrap-dark.css +27 -0
  67. package/styles/ribbon/bootstrap-dark.scss +1 -0
  68. package/styles/ribbon/bootstrap.css +27 -0
  69. package/styles/ribbon/bootstrap.scss +1 -0
  70. package/styles/ribbon/bootstrap4.css +27 -0
  71. package/styles/ribbon/bootstrap4.scss +1 -0
  72. package/styles/ribbon/bootstrap5-dark.css +27 -0
  73. package/styles/ribbon/bootstrap5-dark.scss +1 -0
  74. package/styles/ribbon/bootstrap5.css +27 -0
  75. package/styles/ribbon/bootstrap5.scss +1 -0
  76. package/styles/ribbon/fabric-dark.css +27 -0
  77. package/styles/ribbon/fabric-dark.scss +1 -0
  78. package/styles/ribbon/fabric.css +27 -0
  79. package/styles/ribbon/fabric.scss +1 -0
  80. package/styles/ribbon/fluent-dark.css +27 -0
  81. package/styles/ribbon/fluent-dark.scss +1 -0
  82. package/styles/ribbon/fluent.css +27 -0
  83. package/styles/ribbon/fluent.scss +1 -0
  84. package/styles/ribbon/highcontrast-light.css +27 -0
  85. package/styles/ribbon/highcontrast-light.scss +1 -0
  86. package/styles/ribbon/highcontrast.css +31 -4
  87. package/styles/ribbon/highcontrast.scss +1 -0
  88. package/styles/ribbon/icons/_material3-dark.scss +1 -0
  89. package/styles/ribbon/material-dark.css +27 -0
  90. package/styles/ribbon/material-dark.scss +1 -0
  91. package/styles/ribbon/material.css +27 -0
  92. package/styles/ribbon/material.scss +1 -0
  93. package/styles/ribbon/material3-dark.css +1672 -0
  94. package/styles/ribbon/material3-dark.scss +19 -0
  95. package/styles/ribbon/material3.css +1728 -0
  96. package/styles/ribbon/material3.scss +19 -0
  97. package/styles/ribbon/tailwind-dark.css +27 -0
  98. package/styles/ribbon/tailwind-dark.scss +1 -0
  99. package/styles/ribbon/tailwind.css +27 -0
  100. package/styles/ribbon/tailwind.scss +1 -0
  101. package/styles/tailwind-dark.css +27 -0
  102. package/styles/tailwind.css +27 -0
package/styles/bootstrap4.css CHANGED
@@ -193,6 +193,7 @@
193
193
  border-width: unset;
194
194
  font-size: 14px;
195
195
  font-weight: 400;
196
+ box-shadow: none;
196
197
  }
197
198
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
198
199
  border-radius: unset;
@@ -330,6 +331,7 @@
330
331
  border: none;
331
332
  height: 32px;
332
333
  margin: auto;
334
+ box-shadow: none;
333
335
  }
334
336
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
335
337
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -469,6 +471,8 @@
469
471
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
470
472
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
471
473
  min-width: auto;
474
+ min-height: auto;
475
+ border-radius: unset;
472
476
  }
473
477
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
474
478
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -552,6 +556,7 @@
552
556
  font-weight: 400;
553
557
  font-size: 14px;
554
558
  text-transform: none;
559
+ box-shadow: none;
555
560
  }
556
561
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
557
562
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -660,6 +665,7 @@
660
665
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
661
666
  border: 1px solid transparent;
662
667
  border-radius: 4px;
668
+ box-shadow: none;
663
669
  }
664
670
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
665
671
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -784,6 +790,7 @@
784
790
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
785
791
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
786
792
  line-height: 18px;
793
+ overflow: hidden;
787
794
  }
788
795
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
789
796
  width: inherit;
@@ -831,6 +838,17 @@
831
838
  padding-left: 34px !important; /* stylelint-disable-line declaration-no-important */
832
839
  }
833
840
 
841
+ .e-ribbon-control.e-dropdown-popup ul .e-item {
842
+ font-size: 14px;
843
+ height: 26px;
844
+ -ms-flex-align: center;
845
+ align-items: center;
846
+ }
847
+ .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
848
+ font-size: 16px;
849
+ line-height: 16px;
850
+ }
851
+
834
852
  .e-ribbon-tooltip .e-tip-content {
835
853
  padding: 4px;
836
854
  }
@@ -1207,6 +1225,15 @@
1207
1225
  padding: 9px;
1208
1226
  }
1209
1227
 
1228
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1229
+ font-size: 14px;
1230
+ height: 32px;
1231
+ }
1232
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1233
+ font-size: 20px;
1234
+ line-height: 20px;
1235
+ }
1236
+
1210
1237
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1211
1238
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1212
1239
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-blankicon,
package/styles/bootstrap5-dark.css CHANGED
@@ -222,6 +222,7 @@
222
222
  border-width: unset;
223
223
  font-size: 14px;
224
224
  font-weight: 400;
225
+ box-shadow: none;
225
226
  }
226
227
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
227
228
  border-radius: unset;
@@ -359,6 +360,7 @@
359
360
  border: none;
360
361
  height: 26px;
361
362
  margin: auto;
363
+ box-shadow: none;
362
364
  }
363
365
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
364
366
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -498,6 +500,8 @@
498
500
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
499
501
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
500
502
  min-width: auto;
503
+ min-height: auto;
504
+ border-radius: unset;
501
505
  }
502
506
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
503
507
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -581,6 +585,7 @@
581
585
  font-weight: 400;
582
586
  font-size: 12px;
583
587
  text-transform: none;
588
+ box-shadow: none;
584
589
  }
585
590
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
586
591
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -689,6 +694,7 @@
689
694
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
690
695
  border: 1px solid transparent;
691
696
  border-radius: 4px;
697
+ box-shadow: none;
692
698
  }
693
699
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
694
700
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -813,6 +819,7 @@
813
819
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
814
820
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
815
821
  line-height: 18px;
822
+ overflow: hidden;
816
823
  }
817
824
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
818
825
  width: inherit;
@@ -860,6 +867,17 @@
860
867
  padding-left: 38px !important; /* stylelint-disable-line declaration-no-important */
861
868
  }
862
869
 
870
+ .e-ribbon-control.e-dropdown-popup ul .e-item {
871
+ font-size: 12px;
872
+ height: 24px;
873
+ -ms-flex-align: center;
874
+ align-items: center;
875
+ }
876
+ .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
877
+ font-size: 16px;
878
+ line-height: 16px;
879
+ }
880
+
863
881
  .e-ribbon-tooltip .e-tip-content {
864
882
  padding: 4px;
865
883
  }
@@ -1236,6 +1254,15 @@
1236
1254
  padding: 7px;
1237
1255
  }
1238
1256
 
1257
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1258
+ font-size: 14px;
1259
+ height: 32px;
1260
+ }
1261
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1262
+ font-size: 20px;
1263
+ line-height: 20px;
1264
+ }
1265
+
1239
1266
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1240
1267
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1241
1268
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-blankicon,
package/styles/bootstrap5.css CHANGED
@@ -222,6 +222,7 @@
222
222
  border-width: unset;
223
223
  font-size: 14px;
224
224
  font-weight: 400;
225
+ box-shadow: none;
225
226
  }
226
227
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
227
228
  border-radius: unset;
@@ -359,6 +360,7 @@
359
360
  border: none;
360
361
  height: 26px;
361
362
  margin: auto;
363
+ box-shadow: none;
362
364
  }
363
365
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
364
366
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -498,6 +500,8 @@
498
500
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
499
501
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
500
502
  min-width: auto;
503
+ min-height: auto;
504
+ border-radius: unset;
501
505
  }
502
506
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
503
507
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -581,6 +585,7 @@
581
585
  font-weight: 400;
582
586
  font-size: 12px;
583
587
  text-transform: none;
588
+ box-shadow: none;
584
589
  }
585
590
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
586
591
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -689,6 +694,7 @@
689
694
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
690
695
  border: 1px solid transparent;
691
696
  border-radius: 4px;
697
+ box-shadow: none;
692
698
  }
693
699
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
694
700
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -813,6 +819,7 @@
813
819
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
814
820
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
815
821
  line-height: 18px;
822
+ overflow: hidden;
816
823
  }
817
824
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
818
825
  width: inherit;
@@ -860,6 +867,17 @@
860
867
  padding-left: 38px !important; /* stylelint-disable-line declaration-no-important */
861
868
  }
862
869
 
870
+ .e-ribbon-control.e-dropdown-popup ul .e-item {
871
+ font-size: 12px;
872
+ height: 24px;
873
+ -ms-flex-align: center;
874
+ align-items: center;
875
+ }
876
+ .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
877
+ font-size: 16px;
878
+ line-height: 16px;
879
+ }
880
+
863
881
  .e-ribbon-tooltip .e-tip-content {
864
882
  padding: 4px;
865
883
  }
@@ -1236,6 +1254,15 @@
1236
1254
  padding: 7px;
1237
1255
  }
1238
1256
 
1257
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1258
+ font-size: 14px;
1259
+ height: 32px;
1260
+ }
1261
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1262
+ font-size: 20px;
1263
+ line-height: 20px;
1264
+ }
1265
+
1239
1266
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1240
1267
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1241
1268
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-blankicon,
package/styles/fabric-dark.css CHANGED
@@ -114,6 +114,7 @@
114
114
  border-width: unset;
115
115
  font-size: 14px;
116
116
  font-weight: 400;
117
+ box-shadow: none;
117
118
  }
118
119
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
119
120
  border-radius: unset;
@@ -251,6 +252,7 @@
251
252
  border: none;
252
253
  height: 32px;
253
254
  margin: auto;
255
+ box-shadow: none;
254
256
  }
255
257
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
256
258
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -390,6 +392,8 @@
390
392
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
391
393
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
392
394
  min-width: auto;
395
+ min-height: auto;
396
+ border-radius: unset;
393
397
  }
394
398
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
395
399
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -473,6 +477,7 @@
473
477
  font-weight: 400;
474
478
  font-size: 12px;
475
479
  text-transform: none;
480
+ box-shadow: none;
476
481
  }
477
482
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
478
483
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -581,6 +586,7 @@
581
586
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
582
587
  border: 1px solid transparent;
583
588
  border-radius: unset;
589
+ box-shadow: none;
584
590
  }
585
591
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
586
592
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -705,6 +711,7 @@
705
711
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
706
712
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
707
713
  line-height: 22px;
714
+ overflow: hidden;
708
715
  }
709
716
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
710
717
  width: inherit;
@@ -752,6 +759,17 @@
752
759
  padding-left: 30px !important; /* stylelint-disable-line declaration-no-important */
753
760
  }
754
761
 
762
+ .e-ribbon-control.e-dropdown-popup ul .e-item {
763
+ font-size: 16px;
764
+ height: 36px;
765
+ -ms-flex-align: center;
766
+ align-items: center;
767
+ }
768
+ .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
769
+ font-size: 16px;
770
+ line-height: 16px;
771
+ }
772
+
755
773
  .e-ribbon-tooltip .e-tip-content {
756
774
  padding: 4px;
757
775
  }
@@ -1128,6 +1146,15 @@
1128
1146
  padding: 10px;
1129
1147
  }
1130
1148
 
1149
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1150
+ font-size: 16px;
1151
+ height: 45px;
1152
+ }
1153
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1154
+ font-size: 20px;
1155
+ line-height: 20px;
1156
+ }
1157
+
1131
1158
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1132
1159
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1133
1160
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-blankicon,
package/styles/fabric.css CHANGED
@@ -112,6 +112,7 @@
112
112
  border-width: 0 0 1px 0;
113
113
  font-size: 14px;
114
114
  font-weight: 400;
115
+ box-shadow: none;
115
116
  }
116
117
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
117
118
  border-radius: unset;
@@ -249,6 +250,7 @@
249
250
  border: none;
250
251
  height: 32px;
251
252
  margin: auto;
253
+ box-shadow: none;
252
254
  }
253
255
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
254
256
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -388,6 +390,8 @@
388
390
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
389
391
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
390
392
  min-width: auto;
393
+ min-height: auto;
394
+ border-radius: unset;
391
395
  }
392
396
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
393
397
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -471,6 +475,7 @@
471
475
  font-weight: 400;
472
476
  font-size: 14px;
473
477
  text-transform: none;
478
+ box-shadow: none;
474
479
  }
475
480
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
476
481
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -579,6 +584,7 @@
579
584
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
580
585
  border: 1px solid transparent;
581
586
  border-radius: unset;
587
+ box-shadow: none;
582
588
  }
583
589
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
584
590
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -703,6 +709,7 @@
703
709
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
704
710
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
705
711
  line-height: 22px;
712
+ overflow: hidden;
706
713
  }
707
714
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
708
715
  width: inherit;
@@ -750,6 +757,17 @@
750
757
  padding-left: 30px !important; /* stylelint-disable-line declaration-no-important */
751
758
  }
752
759
 
760
+ .e-ribbon-control.e-dropdown-popup ul .e-item {
761
+ font-size: 16px;
762
+ height: 36px;
763
+ -ms-flex-align: center;
764
+ align-items: center;
765
+ }
766
+ .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
767
+ font-size: 16px;
768
+ line-height: 16px;
769
+ }
770
+
753
771
  .e-ribbon-tooltip .e-tip-content {
754
772
  padding: 4px;
755
773
  }
@@ -1126,6 +1144,15 @@
1126
1144
  padding: 10px;
1127
1145
  }
1128
1146
 
1147
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1148
+ font-size: 16px;
1149
+ height: 45px;
1150
+ }
1151
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1152
+ font-size: 20px;
1153
+ line-height: 20px;
1154
+ }
1155
+
1129
1156
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1130
1157
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1131
1158
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-blankicon,
package/styles/fluent-dark.css CHANGED
@@ -198,6 +198,7 @@
198
198
  border-width: unset;
199
199
  font-size: 14px;
200
200
  font-weight: 400;
201
+ box-shadow: none;
201
202
  }
202
203
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
203
204
  border-radius: unset;
@@ -335,6 +336,7 @@
335
336
  border: none;
336
337
  height: 26px;
337
338
  margin: auto;
339
+ box-shadow: none;
338
340
  }
339
341
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
340
342
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -474,6 +476,8 @@
474
476
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
475
477
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
476
478
  min-width: auto;
479
+ min-height: auto;
480
+ border-radius: unset;
477
481
  }
478
482
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
479
483
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -557,6 +561,7 @@
557
561
  font-weight: 400;
558
562
  font-size: 12px;
559
563
  text-transform: none;
564
+ box-shadow: none;
560
565
  }
561
566
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
562
567
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -665,6 +670,7 @@
665
670
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
666
671
  border: 1px solid transparent;
667
672
  border-radius: 2px;
673
+ box-shadow: none;
668
674
  }
669
675
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
670
676
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -789,6 +795,7 @@
789
795
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
790
796
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
791
797
  line-height: 18px;
798
+ overflow: hidden;
792
799
  }
793
800
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
794
801
  width: inherit;
@@ -836,6 +843,17 @@
836
843
  padding-left: 26px !important; /* stylelint-disable-line declaration-no-important */
837
844
  }
838
845
 
846
+ .e-ribbon-control.e-dropdown-popup ul .e-item {
847
+ font-size: 12px;
848
+ height: 24px;
849
+ -ms-flex-align: center;
850
+ align-items: center;
851
+ }
852
+ .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
853
+ font-size: 16px;
854
+ line-height: 16px;
855
+ }
856
+
839
857
  .e-ribbon-tooltip .e-tip-content {
840
858
  padding: 4px;
841
859
  }
@@ -1212,6 +1230,15 @@
1212
1230
  padding: 7px;
1213
1231
  }
1214
1232
 
1233
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1234
+ font-size: 14px;
1235
+ height: 32px;
1236
+ }
1237
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1238
+ font-size: 20px;
1239
+ line-height: 20px;
1240
+ }
1241
+
1215
1242
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1216
1243
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1217
1244
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-blankicon,
package/styles/fluent.css CHANGED
@@ -198,6 +198,7 @@
198
198
  border-width: unset;
199
199
  font-size: 14px;
200
200
  font-weight: 400;
201
+ box-shadow: none;
201
202
  }
202
203
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
203
204
  border-radius: unset;
@@ -335,6 +336,7 @@
335
336
  border: none;
336
337
  height: 26px;
337
338
  margin: auto;
339
+ box-shadow: none;
338
340
  }
339
341
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
340
342
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -474,6 +476,8 @@
474
476
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
475
477
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
476
478
  min-width: auto;
479
+ min-height: auto;
480
+ border-radius: unset;
477
481
  }
478
482
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
479
483
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -557,6 +561,7 @@
557
561
  font-weight: 400;
558
562
  font-size: 12px;
559
563
  text-transform: none;
564
+ box-shadow: none;
560
565
  }
561
566
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
562
567
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -665,6 +670,7 @@
665
670
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
666
671
  border: 1px solid transparent;
667
672
  border-radius: 2px;
673
+ box-shadow: none;
668
674
  }
669
675
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
670
676
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -789,6 +795,7 @@
789
795
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
790
796
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
791
797
  line-height: 18px;
798
+ overflow: hidden;
792
799
  }
793
800
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
794
801
  width: inherit;
@@ -836,6 +843,17 @@
836
843
  padding-left: 26px !important; /* stylelint-disable-line declaration-no-important */
837
844
  }
838
845
 
846
+ .e-ribbon-control.e-dropdown-popup ul .e-item {
847
+ font-size: 12px;
848
+ height: 24px;
849
+ -ms-flex-align: center;
850
+ align-items: center;
851
+ }
852
+ .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
853
+ font-size: 16px;
854
+ line-height: 16px;
855
+ }
856
+
839
857
  .e-ribbon-tooltip .e-tip-content {
840
858
  padding: 4px;
841
859
  }
@@ -1212,6 +1230,15 @@
1212
1230
  padding: 7px;
1213
1231
  }
1214
1232
 
1233
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1234
+ font-size: 14px;
1235
+ height: 32px;
1236
+ }
1237
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1238
+ font-size: 20px;
1239
+ line-height: 20px;
1240
+ }
1241
+
1215
1242
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1216
1243
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1217
1244
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-blankicon,
package/styles/highcontrast-light.css CHANGED
@@ -121,6 +121,7 @@
121
121
  border-width: 0 0 1px 0;
122
122
  font-size: 14px;
123
123
  font-weight: 400;
124
+ box-shadow: none;
124
125
  }
125
126
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
126
127
  border-radius: unset;
@@ -258,6 +259,7 @@
258
259
  border: 2px solid;
259
260
  height: 40px;
260
261
  margin: auto;
262
+ box-shadow: none;
261
263
  }
262
264
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
263
265
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -397,6 +399,8 @@
397
399
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
398
400
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
399
401
  min-width: auto;
402
+ min-height: auto;
403
+ border-radius: unset;
400
404
  }
401
405
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
402
406
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -480,6 +484,7 @@
480
484
  font-weight: 400;
481
485
  font-size: 14px;
482
486
  text-transform: none;
487
+ box-shadow: none;
483
488
  }
484
489
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
485
490
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -588,6 +593,7 @@
588
593
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
589
594
  border: 1px solid transparent;
590
595
  border-radius: unset;
596
+ box-shadow: none;
591
597
  }
592
598
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
593
599
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -712,6 +718,7 @@
712
718
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
713
719
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
714
720
  line-height: 22px;
721
+ overflow: hidden;
715
722
  }
716
723
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
717
724
  width: inherit;
@@ -759,6 +766,17 @@
759
766
  padding-left: 30px !important; /* stylelint-disable-line declaration-no-important */
760
767
  }
761
768
 
769
+ .e-ribbon-control.e-dropdown-popup ul .e-item {
770
+ font-size: 16px;
771
+ height: 36px;
772
+ -ms-flex-align: center;
773
+ align-items: center;
774
+ }
775
+ .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
776
+ font-size: 16px;
777
+ line-height: 16px;
778
+ }
779
+
762
780
  .e-ribbon-tooltip .e-tip-content {
763
781
  padding: 4px;
764
782
  }
@@ -1135,6 +1153,15 @@
1135
1153
  padding: 10px;
1136
1154
  }
1137
1155
 
1156
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1157
+ font-size: 16px;
1158
+ height: 45px;
1159
+ }
1160
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1161
+ font-size: 20px;
1162
+ line-height: 20px;
1163
+ }
1164
+
1138
1165
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1139
1166
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1140
1167
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-blankicon,