@syncfusion/ej2-vue-ribbon 21.1.35 → 21.2.3

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.
@@ -209,9 +209,6 @@
209
209
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll-content > .e-item:not(.e-active) {
210
210
  display: none;
211
211
  }
212
- .e-ribbon.e-rbn .e-ribbon-tab .e-item {
213
- width: fit-content;
214
- }
215
212
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu {
216
213
  position: absolute;
217
214
  line-height: 22px;
@@ -295,6 +292,9 @@
295
292
  height: auto;
296
293
  min-height: auto;
297
294
  }
295
+ .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
296
+ box-shadow: none;
297
+ }
298
298
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
299
299
  padding: 0;
300
300
  }
@@ -304,6 +304,7 @@
304
304
  min-width: auto;
305
305
  width: auto;
306
306
  border-style: solid;
307
+ transform: none;
307
308
  border-width: 1px;
308
309
  border-radius: unset;
309
310
  z-index: 3;
@@ -314,6 +315,7 @@
314
315
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
315
316
  font-size: 16px;
316
317
  height: auto;
318
+ transform: none;
317
319
  line-height: 16px;
318
320
  padding: 0 4px;
319
321
  width: auto;
@@ -382,6 +384,9 @@
382
384
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
383
385
  overflow-y: hidden;
384
386
  }
387
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
388
+ margin-bottom: 0;
389
+ }
385
390
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
386
391
  padding-top: 2px;
387
392
  height: auto;
@@ -431,6 +436,9 @@
431
436
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
432
437
  left: var(--fileMenuWidth);
433
438
  }
439
+ .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
440
+ padding-right: 30px;
441
+ }
434
442
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
435
443
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
436
444
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -442,6 +450,9 @@
442
450
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
443
451
  right: var(--fileMenuWidth);
444
452
  }
453
+ .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
454
+ padding-left: 30px;
455
+ }
445
456
 
446
457
  .e-ribbon.e-rbn,
447
458
  .e-ribbon-group-overflow-ddb {
@@ -663,6 +674,7 @@
663
674
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
664
675
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
665
676
  border: 1px solid transparent;
677
+ border-radius: unset;
666
678
  }
667
679
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
668
680
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -781,7 +793,8 @@
781
793
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
782
794
  display: none;
783
795
  }
784
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
796
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
797
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
785
798
  margin: 3px 8px;
786
799
  }
787
800
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -805,22 +818,24 @@
805
818
  -ms-flex-pack: start;
806
819
  justify-content: flex-start;
807
820
  }
808
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-icons.e-caret,
809
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-dropdown-btn .e-icons.e-caret {
810
- transform: rotate(-90deg);
811
- margin-left: auto;
812
- }
813
821
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
814
822
  padding: 3px 8px;
815
823
  font-weight: 600;
816
824
  line-height: 18px;
817
825
  }
818
826
 
827
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
828
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
829
+ transform: rotate(-90deg);
830
+ padding: 8px;
831
+ margin: 0 0 0 auto;
832
+ }
833
+
819
834
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
820
835
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
821
836
  transform: rotate(90deg);
822
- margin-right: auto;
823
- margin-left: unset;
837
+ padding: 8px;
838
+ margin: 0 auto 0 0;
824
839
  }
825
840
 
826
841
  .e-ribbon-menu {
@@ -973,6 +988,12 @@
973
988
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
974
989
  height: auto;
975
990
  }
991
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
992
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
993
+ .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
994
+ .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
995
+ margin-bottom: 0;
996
+ }
976
997
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
977
998
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
978
999
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1187,7 +1208,9 @@
1187
1208
  }
1188
1209
 
1189
1210
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1190
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1211
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1212
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1213
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1191
1214
  margin: 3px 8px;
1192
1215
  }
1193
1216
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1195,6 +1218,18 @@
1195
1218
  margin: 8px;
1196
1219
  padding: 0;
1197
1220
  }
1221
+ .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,
1222
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1223
+ .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,
1224
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1225
+ padding: 8px;
1226
+ }
1227
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1228
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1229
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1230
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1231
+ padding: 8px;
1232
+ }
1198
1233
 
1199
1234
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1200
1235
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
@@ -130,9 +130,6 @@
130
130
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll-content > .e-item:not(.e-active) {
131
131
  display: none;
132
132
  }
133
- .e-ribbon.e-rbn .e-ribbon-tab .e-item {
134
- width: fit-content;
135
- }
136
133
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu {
137
134
  position: absolute;
138
135
  line-height: 22px;
@@ -216,6 +213,9 @@
216
213
  height: auto;
217
214
  min-height: auto;
218
215
  }
216
+ .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
217
+ box-shadow: none;
218
+ }
219
219
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
220
220
  padding: 0;
221
221
  }
@@ -225,6 +225,7 @@
225
225
  min-width: auto;
226
226
  width: auto;
227
227
  border-style: solid;
228
+ transform: none;
228
229
  border-width: 1px;
229
230
  border-radius: 2px;
230
231
  z-index: 3;
@@ -235,6 +236,7 @@
235
236
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
236
237
  font-size: 16px;
237
238
  height: auto;
239
+ transform: none;
238
240
  line-height: 16px;
239
241
  padding: 0 4px;
240
242
  width: auto;
@@ -303,6 +305,9 @@
303
305
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
304
306
  overflow-y: hidden;
305
307
  }
308
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
309
+ margin-bottom: 0;
310
+ }
306
311
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
307
312
  padding-top: 2px;
308
313
  height: auto;
@@ -352,6 +357,9 @@
352
357
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
353
358
  left: var(--fileMenuWidth);
354
359
  }
360
+ .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
361
+ padding-right: 30px;
362
+ }
355
363
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
356
364
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
357
365
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -363,6 +371,9 @@
363
371
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
364
372
  right: var(--fileMenuWidth);
365
373
  }
374
+ .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
375
+ padding-left: 30px;
376
+ }
366
377
 
367
378
  .e-ribbon.e-rbn,
368
379
  .e-ribbon-group-overflow-ddb {
@@ -584,6 +595,7 @@
584
595
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
585
596
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
586
597
  border: 1px solid transparent;
598
+ border-radius: 2px;
587
599
  }
588
600
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
589
601
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -702,7 +714,8 @@
702
714
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
703
715
  display: none;
704
716
  }
705
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
717
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
718
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
706
719
  margin: 2px 8px;
707
720
  }
708
721
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -726,22 +739,24 @@
726
739
  -ms-flex-pack: start;
727
740
  justify-content: flex-start;
728
741
  }
729
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-icons.e-caret,
730
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-dropdown-btn .e-icons.e-caret {
731
- transform: rotate(-90deg);
732
- margin-left: auto;
733
- }
734
742
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
735
743
  padding: 2px 8px;
736
744
  font-weight: 400;
737
745
  line-height: 22px;
738
746
  }
739
747
 
748
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
749
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
750
+ transform: rotate(-90deg);
751
+ padding: 8px;
752
+ margin: 0 0 0 auto;
753
+ }
754
+
740
755
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
741
756
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
742
757
  transform: rotate(90deg);
743
- margin-right: auto;
744
- margin-left: unset;
758
+ padding: 8px;
759
+ margin: 0 auto 0 0;
745
760
  }
746
761
 
747
762
  .e-ribbon-menu {
@@ -894,6 +909,12 @@
894
909
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
895
910
  height: auto;
896
911
  }
912
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
913
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
914
+ .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
915
+ .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
916
+ margin-bottom: 0;
917
+ }
897
918
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
898
919
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
899
920
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1108,7 +1129,9 @@
1108
1129
  }
1109
1130
 
1110
1131
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1111
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1132
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1133
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1134
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1112
1135
  margin: 2px 10px;
1113
1136
  }
1114
1137
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1116,6 +1139,18 @@
1116
1139
  margin: 10px;
1117
1140
  padding: 0;
1118
1141
  }
1142
+ .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,
1143
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1144
+ .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,
1145
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1146
+ padding: 10px;
1147
+ }
1148
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1149
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1150
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1151
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1152
+ padding: 10px;
1153
+ }
1119
1154
 
1120
1155
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1121
1156
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
@@ -135,9 +135,6 @@
135
135
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll-content > .e-item:not(.e-active) {
136
136
  display: none;
137
137
  }
138
- .e-ribbon.e-rbn .e-ribbon-tab .e-item {
139
- width: fit-content;
140
- }
141
138
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu {
142
139
  position: absolute;
143
140
  line-height: 22px;
@@ -221,6 +218,9 @@
221
218
  height: auto;
222
219
  min-height: auto;
223
220
  }
221
+ .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
222
+ box-shadow: none;
223
+ }
224
224
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
225
225
  padding: 0;
226
226
  }
@@ -230,6 +230,7 @@
230
230
  min-width: auto;
231
231
  width: auto;
232
232
  border-style: solid;
233
+ transform: none;
233
234
  border-width: 1px;
234
235
  border-radius: 2px;
235
236
  z-index: 3;
@@ -240,6 +241,7 @@
240
241
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
241
242
  font-size: 16px;
242
243
  height: auto;
244
+ transform: none;
243
245
  line-height: 16px;
244
246
  padding: 0 4px;
245
247
  width: auto;
@@ -308,6 +310,9 @@
308
310
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
309
311
  overflow-y: hidden;
310
312
  }
313
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
314
+ margin-bottom: 0;
315
+ }
311
316
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
312
317
  padding-top: 2px;
313
318
  height: auto;
@@ -357,6 +362,9 @@
357
362
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
358
363
  left: var(--fileMenuWidth);
359
364
  }
365
+ .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
366
+ padding-right: 30px;
367
+ }
360
368
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
361
369
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
362
370
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -368,6 +376,9 @@
368
376
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
369
377
  right: var(--fileMenuWidth);
370
378
  }
379
+ .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
380
+ padding-left: 30px;
381
+ }
371
382
 
372
383
  .e-ribbon.e-rbn,
373
384
  .e-ribbon-group-overflow-ddb {
@@ -589,6 +600,7 @@
589
600
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
590
601
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
591
602
  border: 1px solid transparent;
603
+ border-radius: 4px;
592
604
  }
593
605
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
594
606
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -707,7 +719,8 @@
707
719
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
708
720
  display: none;
709
721
  }
710
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
722
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
723
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
711
724
  margin: 2px 8px;
712
725
  }
713
726
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -731,22 +744,24 @@
731
744
  -ms-flex-pack: start;
732
745
  justify-content: flex-start;
733
746
  }
734
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-icons.e-caret,
735
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-dropdown-btn .e-icons.e-caret {
736
- transform: rotate(-90deg);
737
- margin-left: auto;
738
- }
739
747
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
740
748
  padding: 2px 8px;
741
749
  font-weight: 400;
742
750
  line-height: 22px;
743
751
  }
744
752
 
753
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
754
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
755
+ transform: rotate(-90deg);
756
+ padding: 8px;
757
+ margin: 0 0 0 auto;
758
+ }
759
+
745
760
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
746
761
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
747
762
  transform: rotate(90deg);
748
- margin-right: auto;
749
- margin-left: unset;
763
+ padding: 8px;
764
+ margin: 0 auto 0 0;
750
765
  }
751
766
 
752
767
  .e-ribbon-menu {
@@ -899,6 +914,12 @@
899
914
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
900
915
  height: auto;
901
916
  }
917
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
918
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
919
+ .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
920
+ .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
921
+ margin-bottom: 0;
922
+ }
902
923
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
903
924
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
904
925
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1113,7 +1134,9 @@
1113
1134
  }
1114
1135
 
1115
1136
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1116
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1137
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1138
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1139
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1117
1140
  margin: 2px 10px;
1118
1141
  }
1119
1142
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1121,6 +1144,18 @@
1121
1144
  margin: 10px;
1122
1145
  padding: 0;
1123
1146
  }
1147
+ .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,
1148
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1149
+ .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,
1150
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1151
+ padding: 10px;
1152
+ }
1153
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1154
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1155
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1156
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1157
+ padding: 10px;
1158
+ }
1124
1159
 
1125
1160
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1126
1161
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
@@ -185,9 +185,6 @@
185
185
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll-content > .e-item:not(.e-active) {
186
186
  display: none;
187
187
  }
188
- .e-ribbon.e-rbn .e-ribbon-tab .e-item {
189
- width: fit-content;
190
- }
191
188
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu {
192
189
  position: absolute;
193
190
  line-height: 22px;
@@ -271,6 +268,9 @@
271
268
  height: auto;
272
269
  min-height: auto;
273
270
  }
271
+ .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
272
+ box-shadow: none;
273
+ }
274
274
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
275
275
  padding: 0;
276
276
  }
@@ -280,6 +280,7 @@
280
280
  min-width: auto;
281
281
  width: auto;
282
282
  border-style: solid;
283
+ transform: none;
283
284
  border-width: 1px;
284
285
  border-radius: 2px;
285
286
  z-index: 3;
@@ -290,6 +291,7 @@
290
291
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
291
292
  font-size: 20px;
292
293
  height: auto;
294
+ transform: none;
293
295
  line-height: 20px;
294
296
  padding: 0 2px;
295
297
  width: auto;
@@ -358,6 +360,9 @@
358
360
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
359
361
  overflow-y: hidden;
360
362
  }
363
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
364
+ margin-bottom: 0;
365
+ }
361
366
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
362
367
  padding-top: 2px;
363
368
  height: auto;
@@ -407,6 +412,9 @@
407
412
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
408
413
  left: var(--fileMenuWidth);
409
414
  }
415
+ .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
416
+ padding-right: 30px;
417
+ }
410
418
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
411
419
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
412
420
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -418,6 +426,9 @@
418
426
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
419
427
  right: var(--fileMenuWidth);
420
428
  }
429
+ .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
430
+ padding-left: 30px;
431
+ }
421
432
 
422
433
  .e-ribbon.e-rbn,
423
434
  .e-ribbon-group-overflow-ddb {
@@ -639,6 +650,7 @@
639
650
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
640
651
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
641
652
  border: 1px solid transparent;
653
+ border-radius: 4px;
642
654
  }
643
655
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
644
656
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -757,7 +769,8 @@
757
769
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
758
770
  display: none;
759
771
  }
760
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
772
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
773
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
761
774
  margin: 3px 8px;
762
775
  }
763
776
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -781,22 +794,24 @@
781
794
  -ms-flex-pack: start;
782
795
  justify-content: flex-start;
783
796
  }
784
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-icons.e-caret,
785
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-dropdown-btn .e-icons.e-caret {
786
- transform: rotate(-90deg);
787
- margin-left: auto;
788
- }
789
797
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
790
798
  padding: 3px 8px;
791
799
  font-weight: 500;
792
800
  line-height: 18px;
793
801
  }
794
802
 
803
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
804
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
805
+ transform: rotate(-90deg);
806
+ padding: 8px;
807
+ margin: 0 0 0 auto;
808
+ }
809
+
795
810
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
796
811
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
797
812
  transform: rotate(90deg);
798
- margin-right: auto;
799
- margin-left: unset;
813
+ padding: 8px;
814
+ margin: 0 auto 0 0;
800
815
  }
801
816
 
802
817
  .e-ribbon-menu {
@@ -949,6 +964,12 @@
949
964
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
950
965
  height: auto;
951
966
  }
967
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
968
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
969
+ .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
970
+ .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
971
+ margin-bottom: 0;
972
+ }
952
973
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
953
974
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
954
975
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1163,7 +1184,9 @@
1163
1184
  }
1164
1185
 
1165
1186
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1166
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1187
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1188
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1189
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1167
1190
  margin: 3px 9px;
1168
1191
  }
1169
1192
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1171,6 +1194,18 @@
1171
1194
  margin: 9px;
1172
1195
  padding: 0;
1173
1196
  }
1197
+ .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,
1198
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1199
+ .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,
1200
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1201
+ padding: 9px;
1202
+ }
1203
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1204
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1205
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1206
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1207
+ padding: 9px;
1208
+ }
1174
1209
 
1175
1210
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1176
1211
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,