@syncfusion/ej2-vue-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 (48) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/ej2-vue-ribbon.umd.min.js +2 -2
  3. package/dist/ej2-vue-ribbon.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-vue-ribbon.es2015.js +13 -1
  5. package/dist/es6/ej2-vue-ribbon.es2015.js.map +1 -1
  6. package/dist/es6/ej2-vue-ribbon.es5.js +13 -1
  7. package/dist/es6/ej2-vue-ribbon.es5.js.map +1 -1
  8. package/dist/global/ej2-vue-ribbon.min.js +2 -2
  9. package/package.json +8 -8
  10. package/src/ribbon/ribbon.component.js +13 -1
  11. package/styles/bootstrap-dark.css +27 -0
  12. package/styles/bootstrap.css +27 -0
  13. package/styles/bootstrap4.css +27 -0
  14. package/styles/bootstrap5-dark.css +27 -0
  15. package/styles/bootstrap5.css +27 -0
  16. package/styles/fabric-dark.css +27 -0
  17. package/styles/fabric.css +27 -0
  18. package/styles/fluent-dark.css +27 -0
  19. package/styles/fluent.css +27 -0
  20. package/styles/highcontrast-light.css +27 -0
  21. package/styles/highcontrast.css +31 -4
  22. package/styles/material-dark.css +27 -0
  23. package/styles/material.css +27 -0
  24. package/styles/material3-dark.css +1672 -0
  25. package/styles/material3-dark.scss +2 -0
  26. package/styles/material3.css +1728 -0
  27. package/styles/material3.scss +2 -0
  28. package/styles/ribbon/bootstrap-dark.css +27 -0
  29. package/styles/ribbon/bootstrap.css +27 -0
  30. package/styles/ribbon/bootstrap4.css +27 -0
  31. package/styles/ribbon/bootstrap5-dark.css +27 -0
  32. package/styles/ribbon/bootstrap5.css +27 -0
  33. package/styles/ribbon/fabric-dark.css +27 -0
  34. package/styles/ribbon/fabric.css +27 -0
  35. package/styles/ribbon/fluent-dark.css +27 -0
  36. package/styles/ribbon/fluent.css +27 -0
  37. package/styles/ribbon/highcontrast-light.css +27 -0
  38. package/styles/ribbon/highcontrast.css +31 -4
  39. package/styles/ribbon/material-dark.css +27 -0
  40. package/styles/ribbon/material.css +27 -0
  41. package/styles/ribbon/material3-dark.css +1672 -0
  42. package/styles/ribbon/material3-dark.scss +2 -0
  43. package/styles/ribbon/material3.css +1728 -0
  44. package/styles/ribbon/material3.scss +2 -0
  45. package/styles/ribbon/tailwind-dark.css +27 -0
  46. package/styles/ribbon/tailwind.css +27 -0
  47. package/styles/tailwind-dark.css +27 -0
  48. package/styles/tailwind.css +27 -0
package/styles/material3.scss ADDED
@@ -0,0 +1,2 @@
1
+
2
+ @import 'ribbon/material3.scss';
package/styles/ribbon/bootstrap-dark.css CHANGED
@@ -138,6 +138,7 @@
138
138
  border-width: unset;
139
139
  font-size: 14px;
140
140
  font-weight: 400;
141
+ box-shadow: none;
141
142
  }
142
143
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
143
144
  border-radius: unset;
@@ -275,6 +276,7 @@
275
276
  border: none;
276
277
  height: 32px;
277
278
  margin: auto;
279
+ box-shadow: none;
278
280
  }
279
281
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
280
282
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -414,6 +416,8 @@
414
416
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
415
417
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
416
418
  min-width: auto;
419
+ min-height: auto;
420
+ border-radius: unset;
417
421
  }
418
422
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
419
423
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -497,6 +501,7 @@
497
501
  font-weight: 400;
498
502
  font-size: 12px;
499
503
  text-transform: none;
504
+ box-shadow: none;
500
505
  }
501
506
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
502
507
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -605,6 +610,7 @@
605
610
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
606
611
  border: 1px solid transparent;
607
612
  border-radius: 2px;
613
+ box-shadow: none;
608
614
  }
609
615
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
610
616
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -729,6 +735,7 @@
729
735
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
730
736
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
731
737
  line-height: 22px;
738
+ overflow: hidden;
732
739
  }
733
740
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
734
741
  width: inherit;
@@ -776,6 +783,17 @@
776
783
  padding-left: 37px !important; /* stylelint-disable-line declaration-no-important */
777
784
  }
778
785
 
786
+ .e-ribbon-control.e-dropdown-popup ul .e-item {
787
+ font-size: 14px;
788
+ height: 26px;
789
+ -ms-flex-align: center;
790
+ align-items: center;
791
+ }
792
+ .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
793
+ font-size: 16px;
794
+ line-height: 16px;
795
+ }
796
+
779
797
  .e-ribbon-tooltip .e-tip-content {
780
798
  padding: 4px;
781
799
  }
@@ -1152,6 +1170,15 @@
1152
1170
  padding: 10px;
1153
1171
  }
1154
1172
 
1173
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1174
+ font-size: 14px;
1175
+ height: 32px;
1176
+ }
1177
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1178
+ font-size: 20px;
1179
+ line-height: 20px;
1180
+ }
1181
+
1155
1182
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1156
1183
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1157
1184
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-blankicon,
package/styles/ribbon/bootstrap.css CHANGED
@@ -143,6 +143,7 @@
143
143
  border-width: unset;
144
144
  font-size: 14px;
145
145
  font-weight: 400;
146
+ box-shadow: none;
146
147
  }
147
148
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
148
149
  border-radius: unset;
@@ -280,6 +281,7 @@
280
281
  border: none;
281
282
  height: 32px;
282
283
  margin: auto;
284
+ box-shadow: none;
283
285
  }
284
286
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
285
287
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -419,6 +421,8 @@
419
421
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
420
422
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
421
423
  min-width: auto;
424
+ min-height: auto;
425
+ border-radius: unset;
422
426
  }
423
427
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
424
428
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -502,6 +506,7 @@
502
506
  font-weight: 400;
503
507
  font-size: 12px;
504
508
  text-transform: none;
509
+ box-shadow: none;
505
510
  }
506
511
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
507
512
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -610,6 +615,7 @@
610
615
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
611
616
  border: 1px solid transparent;
612
617
  border-radius: 4px;
618
+ box-shadow: none;
613
619
  }
614
620
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
615
621
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -734,6 +740,7 @@
734
740
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
735
741
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
736
742
  line-height: 22px;
743
+ overflow: hidden;
737
744
  }
738
745
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
739
746
  width: inherit;
@@ -781,6 +788,17 @@
781
788
  padding-left: 34px !important; /* stylelint-disable-line declaration-no-important */
782
789
  }
783
790
 
791
+ .e-ribbon-control.e-dropdown-popup ul .e-item {
792
+ font-size: 14px;
793
+ height: 26px;
794
+ -ms-flex-align: center;
795
+ align-items: center;
796
+ }
797
+ .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
798
+ font-size: 16px;
799
+ line-height: 16px;
800
+ }
801
+
784
802
  .e-ribbon-tooltip .e-tip-content {
785
803
  padding: 4px;
786
804
  }
@@ -1157,6 +1175,15 @@
1157
1175
  padding: 10px;
1158
1176
  }
1159
1177
 
1178
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1179
+ font-size: 14px;
1180
+ height: 32px;
1181
+ }
1182
+ .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1183
+ font-size: 20px;
1184
+ line-height: 20px;
1185
+ }
1186
+
1160
1187
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1161
1188
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1162
1189
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-ul .e-menu-item.e-blankicon,
package/styles/ribbon/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/ribbon/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/ribbon/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/ribbon/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/ribbon/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/ribbon/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,