@syncfusion/ej2-angular-ribbon 22.1.34 → 22.1.39-ngcc

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 (136) hide show
  1. package/@syncfusion/ej2-angular-ribbon.es5.js +566 -0
  2. package/@syncfusion/ej2-angular-ribbon.es5.js.map +1 -0
  3. package/@syncfusion/ej2-angular-ribbon.js +526 -0
  4. package/@syncfusion/ej2-angular-ribbon.js.map +1 -0
  5. package/CHANGELOG.md +28 -0
  6. package/dist/ej2-angular-ribbon.umd.js +710 -0
  7. package/dist/ej2-angular-ribbon.umd.js.map +1 -0
  8. package/dist/ej2-angular-ribbon.umd.min.js +11 -0
  9. package/dist/ej2-angular-ribbon.umd.min.js.map +1 -0
  10. package/ej2-angular-ribbon.d.ts +5 -0
  11. package/ej2-angular-ribbon.metadata.json +1 -0
  12. package/license +10 -0
  13. package/package.json +14 -28
  14. package/postinstall/tagchange.js +18 -0
  15. package/schematics/collection.json +10 -0
  16. package/schematics/ng-add/index.d.ts +3 -0
  17. package/schematics/ng-add/index.js +9 -0
  18. package/schematics/ng-add/index.ts +10 -0
  19. package/schematics/ng-add/schema.d.ts +13 -0
  20. package/schematics/ng-add/schema.js +2 -0
  21. package/schematics/ng-add/schema.json +34 -0
  22. package/schematics/ng-add/schema.ts +30 -0
  23. package/schematics/tsconfig.json +25 -0
  24. package/schematics/utils/lib-details.d.ts +4 -0
  25. package/schematics/utils/lib-details.js +6 -0
  26. package/schematics/utils/lib-details.ts +4 -0
  27. package/src/ribbon/collections.directive.d.ts +0 -5
  28. package/src/ribbon/groups.directive.d.ts +0 -5
  29. package/src/ribbon/items.directive.d.ts +0 -5
  30. package/src/ribbon/ribbon-all.module.d.ts +0 -6
  31. package/src/ribbon/ribbon.component.d.ts +0 -3
  32. package/src/ribbon/ribbon.module.d.ts +0 -10
  33. package/src/ribbon/tabs.directive.d.ts +0 -5
  34. package/styles/bootstrap-dark.css +79 -13
  35. package/styles/bootstrap.css +79 -13
  36. package/styles/bootstrap4.css +79 -13
  37. package/styles/bootstrap5-dark.css +79 -13
  38. package/styles/bootstrap5.css +79 -13
  39. package/styles/fabric-dark.css +79 -13
  40. package/styles/fabric.css +79 -13
  41. package/styles/fluent-dark.css +79 -13
  42. package/styles/fluent.css +79 -13
  43. package/styles/highcontrast-light.css +79 -13
  44. package/styles/highcontrast.css +83 -17
  45. package/styles/material-dark.css +79 -13
  46. package/styles/material.css +79 -13
  47. package/styles/material3-dark.css +1672 -0
  48. package/styles/material3-dark.scss +2 -0
  49. package/styles/material3.css +1728 -0
  50. package/styles/material3.scss +2 -0
  51. package/styles/ribbon/bootstrap-dark.css +79 -13
  52. package/styles/ribbon/bootstrap-dark.scss +1 -17
  53. package/styles/ribbon/bootstrap.css +79 -13
  54. package/styles/ribbon/bootstrap.scss +1 -17
  55. package/styles/ribbon/bootstrap4.css +79 -13
  56. package/styles/ribbon/bootstrap4.scss +1 -17
  57. package/styles/ribbon/bootstrap5-dark.css +79 -13
  58. package/styles/ribbon/bootstrap5-dark.scss +1 -17
  59. package/styles/ribbon/bootstrap5.css +79 -13
  60. package/styles/ribbon/bootstrap5.scss +1 -17
  61. package/styles/ribbon/fabric-dark.css +79 -13
  62. package/styles/ribbon/fabric-dark.scss +1 -17
  63. package/styles/ribbon/fabric.css +79 -13
  64. package/styles/ribbon/fabric.scss +1 -17
  65. package/styles/ribbon/fluent-dark.css +79 -13
  66. package/styles/ribbon/fluent-dark.scss +1 -17
  67. package/styles/ribbon/fluent.css +79 -13
  68. package/styles/ribbon/fluent.scss +1 -17
  69. package/styles/ribbon/highcontrast-light.css +79 -13
  70. package/styles/ribbon/highcontrast-light.scss +1 -16
  71. package/styles/ribbon/highcontrast.css +83 -17
  72. package/styles/ribbon/highcontrast.scss +1 -17
  73. package/styles/ribbon/material-dark.css +79 -13
  74. package/styles/ribbon/material-dark.scss +1 -17
  75. package/styles/ribbon/material.css +79 -13
  76. package/styles/ribbon/material.scss +1 -17
  77. package/styles/ribbon/material3-dark.css +1672 -0
  78. package/styles/ribbon/material3-dark.scss +2 -0
  79. package/styles/ribbon/material3.css +1728 -0
  80. package/styles/ribbon/material3.scss +2 -0
  81. package/styles/ribbon/tailwind-dark.css +79 -13
  82. package/styles/ribbon/tailwind-dark.scss +1 -17
  83. package/styles/ribbon/tailwind.css +79 -13
  84. package/styles/ribbon/tailwind.scss +1 -17
  85. package/styles/tailwind-dark.css +79 -13
  86. package/styles/tailwind.css +79 -13
  87. package/esm2020/public_api.mjs +0 -3
  88. package/esm2020/src/index.mjs +0 -9
  89. package/esm2020/src/ribbon/collections.directive.mjs +0 -70
  90. package/esm2020/src/ribbon/groups.directive.mjs +0 -66
  91. package/esm2020/src/ribbon/items.directive.mjs +0 -78
  92. package/esm2020/src/ribbon/ribbon-all.module.mjs +0 -47
  93. package/esm2020/src/ribbon/ribbon.component.mjs +0 -120
  94. package/esm2020/src/ribbon/ribbon.module.mjs +0 -61
  95. package/esm2020/src/ribbon/tabs.directive.mjs +0 -62
  96. package/esm2020/syncfusion-ej2-angular-ribbon.mjs +0 -5
  97. package/fesm2015/syncfusion-ej2-angular-ribbon.mjs +0 -482
  98. package/fesm2015/syncfusion-ej2-angular-ribbon.mjs.map +0 -1
  99. package/fesm2020/syncfusion-ej2-angular-ribbon.mjs +0 -482
  100. package/fesm2020/syncfusion-ej2-angular-ribbon.mjs.map +0 -1
  101. package/styles/ribbon/_all.scss +0 -2
  102. package/styles/ribbon/_bootstrap-dark-definition.scss +0 -206
  103. package/styles/ribbon/_bootstrap-definition.scss +0 -206
  104. package/styles/ribbon/_bootstrap4-definition.scss +0 -206
  105. package/styles/ribbon/_bootstrap5-dark-definition.scss +0 -1
  106. package/styles/ribbon/_bootstrap5-definition.scss +0 -206
  107. package/styles/ribbon/_fabric-dark-definition.scss +0 -206
  108. package/styles/ribbon/_fabric-definition.scss +0 -206
  109. package/styles/ribbon/_fluent-dark-definition.scss +0 -1
  110. package/styles/ribbon/_fluent-definition.scss +0 -206
  111. package/styles/ribbon/_fusionnew-definition.scss +0 -206
  112. package/styles/ribbon/_highcontrast-definition.scss +0 -206
  113. package/styles/ribbon/_highcontrast-light-definition.scss +0 -206
  114. package/styles/ribbon/_layout.scss +0 -1036
  115. package/styles/ribbon/_material-dark-definition.scss +0 -206
  116. package/styles/ribbon/_material-definition.scss +0 -206
  117. package/styles/ribbon/_tailwind-dark-definition.scss +0 -1
  118. package/styles/ribbon/_tailwind-definition.scss +0 -206
  119. package/styles/ribbon/_theme.scss +0 -343
  120. package/styles/ribbon/icons/_bootstrap-dark.scss +0 -9
  121. package/styles/ribbon/icons/_bootstrap.scss +0 -9
  122. package/styles/ribbon/icons/_bootstrap4.scss +0 -9
  123. package/styles/ribbon/icons/_bootstrap5-dark.scss +0 -1
  124. package/styles/ribbon/icons/_bootstrap5.scss +0 -9
  125. package/styles/ribbon/icons/_fabric-dark.scss +0 -9
  126. package/styles/ribbon/icons/_fabric.scss +0 -9
  127. package/styles/ribbon/icons/_fluent-dark.scss +0 -1
  128. package/styles/ribbon/icons/_fluent.scss +0 -9
  129. package/styles/ribbon/icons/_fusionnew.scss +0 -9
  130. package/styles/ribbon/icons/_highcontrast.scss +0 -9
  131. package/styles/ribbon/icons/_material-dark.scss +0 -9
  132. package/styles/ribbon/icons/_material.scss +0 -9
  133. package/styles/ribbon/icons/_material3.scss +0 -9
  134. package/styles/ribbon/icons/_tailwind-dark.scss +0 -9
  135. package/styles/ribbon/icons/_tailwind.scss +0 -9
  136. package/syncfusion-ej2-angular-ribbon.d.ts +0 -5
package/styles/fabric.css CHANGED
@@ -104,9 +104,6 @@
104
104
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll-content > .e-item:not(.e-active) {
105
105
  display: none;
106
106
  }
107
- .e-ribbon.e-rbn .e-ribbon-tab .e-item {
108
- width: fit-content;
109
- }
110
107
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu {
111
108
  position: absolute;
112
109
  line-height: 22px;
@@ -115,6 +112,7 @@
115
112
  border-width: 0 0 1px 0;
116
113
  font-size: 14px;
117
114
  font-weight: 400;
115
+ box-shadow: none;
118
116
  }
119
117
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
120
118
  border-radius: unset;
@@ -190,6 +188,9 @@
190
188
  height: auto;
191
189
  min-height: auto;
192
190
  }
191
+ .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
192
+ box-shadow: none;
193
+ }
193
194
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
194
195
  padding: 0;
195
196
  }
@@ -199,9 +200,10 @@
199
200
  min-width: auto;
200
201
  width: auto;
201
202
  border-style: solid;
203
+ transform: none;
202
204
  border-width: 1px;
203
205
  border-radius: unset;
204
- z-index: 2;
206
+ z-index: 3;
205
207
  }
206
208
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav.e-overlay {
207
209
  display: none;
@@ -209,6 +211,7 @@
209
211
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
210
212
  font-size: 16px;
211
213
  height: auto;
214
+ transform: none;
212
215
  line-height: 16px;
213
216
  padding: 0 4px;
214
217
  width: auto;
@@ -247,6 +250,7 @@
247
250
  border: none;
248
251
  height: 32px;
249
252
  margin: auto;
253
+ box-shadow: none;
250
254
  }
251
255
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
252
256
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -277,6 +281,9 @@
277
281
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
278
282
  overflow-y: hidden;
279
283
  }
284
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
285
+ margin-bottom: 0;
286
+ }
280
287
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
281
288
  padding-top: 4px;
282
289
  height: auto;
@@ -326,6 +333,9 @@
326
333
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
327
334
  left: var(--fileMenuWidth);
328
335
  }
336
+ .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
337
+ padding-right: 30px;
338
+ }
329
339
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
330
340
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
331
341
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -337,6 +347,9 @@
337
347
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
338
348
  right: var(--fileMenuWidth);
339
349
  }
350
+ .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
351
+ padding-left: 30px;
352
+ }
340
353
 
341
354
  .e-ribbon.e-rbn,
342
355
  .e-ribbon-group-overflow-ddb {
@@ -377,6 +390,8 @@
377
390
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
378
391
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
379
392
  min-width: auto;
393
+ min-height: auto;
394
+ border-radius: unset;
380
395
  }
381
396
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
382
397
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -460,6 +475,7 @@
460
475
  font-weight: 400;
461
476
  font-size: 14px;
462
477
  text-transform: none;
478
+ box-shadow: none;
463
479
  }
464
480
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
465
481
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -558,6 +574,7 @@
558
574
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
559
575
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
560
576
  border: 1px solid transparent;
577
+ border-radius: unset;
561
578
  }
562
579
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
563
580
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -567,6 +584,7 @@
567
584
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
568
585
  border: 1px solid transparent;
569
586
  border-radius: unset;
587
+ box-shadow: none;
570
588
  }
571
589
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
572
590
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -676,7 +694,8 @@
676
694
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
677
695
  display: none;
678
696
  }
679
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
697
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
698
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
680
699
  margin: 7px 8px;
681
700
  }
682
701
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -690,6 +709,7 @@
690
709
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
691
710
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
692
711
  line-height: 22px;
712
+ overflow: hidden;
693
713
  }
694
714
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
695
715
  width: inherit;
@@ -700,22 +720,24 @@
700
720
  -ms-flex-pack: start;
701
721
  justify-content: flex-start;
702
722
  }
703
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-icons.e-caret,
704
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-dropdown-btn .e-icons.e-caret {
705
- transform: rotate(-90deg);
706
- margin-left: auto;
707
- }
708
723
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
709
724
  padding: 6px 8px;
710
725
  font-weight: 600;
711
726
  line-height: 24px;
712
727
  }
713
728
 
729
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
730
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
731
+ transform: rotate(-90deg);
732
+ padding: 8px;
733
+ margin: 0 0 0 auto;
734
+ }
735
+
714
736
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
715
737
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
716
738
  transform: rotate(90deg);
717
- margin-right: auto;
718
- margin-left: unset;
739
+ padding: 8px;
740
+ margin: 0 auto 0 0;
719
741
  }
720
742
 
721
743
  .e-ribbon-menu {
@@ -735,6 +757,17 @@
735
757
  padding-left: 30px !important; /* stylelint-disable-line declaration-no-important */
736
758
  }
737
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
+
738
771
  .e-ribbon-tooltip .e-tip-content {
739
772
  padding: 4px;
740
773
  }
@@ -773,6 +806,10 @@
773
806
  padding-right: 16px;
774
807
  height: 50px;
775
808
  }
809
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-hscroll,
810
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
811
+ min-height: auto;
812
+ }
776
813
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-hor-nav,
777
814
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-hor-nav {
778
815
  height: 50px;
@@ -864,6 +901,12 @@
864
901
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
865
902
  height: auto;
866
903
  }
904
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
905
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
906
+ .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
907
+ .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
908
+ margin-bottom: 0;
909
+ }
867
910
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
868
911
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
869
912
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1078,7 +1121,9 @@
1078
1121
  }
1079
1122
 
1080
1123
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1081
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1124
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1125
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1126
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1082
1127
  margin: 7px 10px;
1083
1128
  }
1084
1129
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1086,6 +1131,27 @@
1086
1131
  margin: 10px;
1087
1132
  padding: 0;
1088
1133
  }
1134
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1135
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1136
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1137
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1138
+ padding: 10px;
1139
+ }
1140
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1141
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1142
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1143
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1144
+ padding: 10px;
1145
+ }
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
+ }
1089
1155
 
1090
1156
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1091
1157
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
@@ -190,9 +190,6 @@
190
190
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll-content > .e-item:not(.e-active) {
191
191
  display: none;
192
192
  }
193
- .e-ribbon.e-rbn .e-ribbon-tab .e-item {
194
- width: fit-content;
195
- }
196
193
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu {
197
194
  position: absolute;
198
195
  line-height: 22px;
@@ -201,6 +198,7 @@
201
198
  border-width: unset;
202
199
  font-size: 14px;
203
200
  font-weight: 400;
201
+ box-shadow: none;
204
202
  }
205
203
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
206
204
  border-radius: unset;
@@ -276,6 +274,9 @@
276
274
  height: auto;
277
275
  min-height: auto;
278
276
  }
277
+ .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
278
+ box-shadow: none;
279
+ }
279
280
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
280
281
  padding: 0;
281
282
  }
@@ -285,9 +286,10 @@
285
286
  min-width: auto;
286
287
  width: auto;
287
288
  border-style: solid;
289
+ transform: none;
288
290
  border-width: 1px;
289
291
  border-radius: 2px;
290
- z-index: 2;
292
+ z-index: 3;
291
293
  }
292
294
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav.e-overlay {
293
295
  display: none;
@@ -295,6 +297,7 @@
295
297
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
296
298
  font-size: 14px;
297
299
  height: auto;
300
+ transform: none;
298
301
  line-height: 14px;
299
302
  padding: 0 5px;
300
303
  width: auto;
@@ -333,6 +336,7 @@
333
336
  border: none;
334
337
  height: 26px;
335
338
  margin: auto;
339
+ box-shadow: none;
336
340
  }
337
341
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
338
342
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -363,6 +367,9 @@
363
367
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
364
368
  overflow-y: hidden;
365
369
  }
370
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
371
+ margin-bottom: 0;
372
+ }
366
373
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
367
374
  padding-top: 1px;
368
375
  height: auto;
@@ -412,6 +419,9 @@
412
419
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
413
420
  left: var(--fileMenuWidth);
414
421
  }
422
+ .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
423
+ padding-right: 30px;
424
+ }
415
425
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
416
426
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
417
427
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -423,6 +433,9 @@
423
433
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
424
434
  right: var(--fileMenuWidth);
425
435
  }
436
+ .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
437
+ padding-left: 30px;
438
+ }
426
439
 
427
440
  .e-ribbon.e-rbn,
428
441
  .e-ribbon-group-overflow-ddb {
@@ -463,6 +476,8 @@
463
476
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
464
477
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
465
478
  min-width: auto;
479
+ min-height: auto;
480
+ border-radius: unset;
466
481
  }
467
482
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
468
483
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -546,6 +561,7 @@
546
561
  font-weight: 400;
547
562
  font-size: 12px;
548
563
  text-transform: none;
564
+ box-shadow: none;
549
565
  }
550
566
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
551
567
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -644,6 +660,7 @@
644
660
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
645
661
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
646
662
  border: 1px solid transparent;
663
+ border-radius: 2px;
647
664
  }
648
665
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
649
666
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -653,6 +670,7 @@
653
670
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
654
671
  border: 1px solid transparent;
655
672
  border-radius: 2px;
673
+ box-shadow: none;
656
674
  }
657
675
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
658
676
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -762,7 +780,8 @@
762
780
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
763
781
  display: none;
764
782
  }
765
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
783
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
784
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
766
785
  margin: 3px 5px;
767
786
  }
768
787
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -776,6 +795,7 @@
776
795
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-btn,
777
796
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-btn {
778
797
  line-height: 18px;
798
+ overflow: hidden;
779
799
  }
780
800
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper {
781
801
  width: inherit;
@@ -786,22 +806,24 @@
786
806
  -ms-flex-pack: start;
787
807
  justify-content: flex-start;
788
808
  }
789
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-icons.e-caret,
790
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-dropdown-btn .e-icons.e-caret {
791
- transform: rotate(-90deg);
792
- margin-left: auto;
793
- }
794
809
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
795
810
  padding: 3px 5px;
796
811
  font-weight: 600;
797
812
  line-height: 18px;
798
813
  }
799
814
 
815
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
816
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
817
+ transform: rotate(-90deg);
818
+ padding: 5px;
819
+ margin: 0 0 0 auto;
820
+ }
821
+
800
822
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
801
823
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
802
824
  transform: rotate(90deg);
803
- margin-right: auto;
804
- margin-left: unset;
825
+ padding: 5px;
826
+ margin: 0 auto 0 0;
805
827
  }
806
828
 
807
829
  .e-ribbon-menu {
@@ -821,6 +843,17 @@
821
843
  padding-left: 26px !important; /* stylelint-disable-line declaration-no-important */
822
844
  }
823
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
+
824
857
  .e-ribbon-tooltip .e-tip-content {
825
858
  padding: 4px;
826
859
  }
@@ -859,6 +892,10 @@
859
892
  padding-right: 16px;
860
893
  height: 48px;
861
894
  }
895
+ .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-hscroll,
896
+ .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
897
+ min-height: auto;
898
+ }
862
899
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-hor-nav,
863
900
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-hor-nav {
864
901
  height: 48px;
@@ -950,6 +987,12 @@
950
987
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
951
988
  height: auto;
952
989
  }
990
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
991
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
992
+ .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
993
+ .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
994
+ margin-bottom: 0;
995
+ }
953
996
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
954
997
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
955
998
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1164,7 +1207,9 @@
1164
1207
  }
1165
1208
 
1166
1209
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1167
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1210
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1211
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1212
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1168
1213
  margin: 3px 7px;
1169
1214
  }
1170
1215
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1172,6 +1217,27 @@
1172
1217
  margin: 7px;
1173
1218
  padding: 0;
1174
1219
  }
1220
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1221
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1222
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1223
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1224
+ padding: 7px;
1225
+ }
1226
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1227
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1228
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1229
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1230
+ padding: 7px;
1231
+ }
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
+ }
1175
1241
 
1176
1242
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1177
1243
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,