@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.
Files changed (34) hide show
  1. package/CHANGELOG.md +3 -2
  2. package/dist/ej2-vue-ribbon.umd.min.js +1 -1
  3. package/dist/global/ej2-vue-ribbon.min.js +2 -2
  4. package/package.json +10 -9
  5. package/styles/bootstrap-dark.css +47 -12
  6. package/styles/bootstrap.css +47 -12
  7. package/styles/bootstrap4.css +47 -12
  8. package/styles/bootstrap5-dark.css +47 -12
  9. package/styles/bootstrap5.css +47 -12
  10. package/styles/fabric-dark.css +47 -12
  11. package/styles/fabric.css +47 -12
  12. package/styles/fluent-dark.css +47 -12
  13. package/styles/fluent.css +47 -12
  14. package/styles/highcontrast-light.css +47 -12
  15. package/styles/highcontrast.css +47 -12
  16. package/styles/material-dark.css +47 -12
  17. package/styles/material.css +47 -12
  18. package/styles/ribbon/bootstrap-dark.css +47 -12
  19. package/styles/ribbon/bootstrap.css +47 -12
  20. package/styles/ribbon/bootstrap4.css +47 -12
  21. package/styles/ribbon/bootstrap5-dark.css +47 -12
  22. package/styles/ribbon/bootstrap5.css +47 -12
  23. package/styles/ribbon/fabric-dark.css +47 -12
  24. package/styles/ribbon/fabric.css +47 -12
  25. package/styles/ribbon/fluent-dark.css +47 -12
  26. package/styles/ribbon/fluent.css +47 -12
  27. package/styles/ribbon/highcontrast-light.css +47 -12
  28. package/styles/ribbon/highcontrast.css +47 -12
  29. package/styles/ribbon/material-dark.css +47 -12
  30. package/styles/ribbon/material.css +47 -12
  31. package/styles/ribbon/tailwind-dark.css +47 -12
  32. package/styles/ribbon/tailwind.css +47 -12
  33. package/styles/tailwind-dark.css +47 -12
  34. package/styles/tailwind.css +47 -12
package/styles/ribbon/fluent-dark.css CHANGED
@@ -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;
@@ -276,6 +273,9 @@
276
273
  height: auto;
277
274
  min-height: auto;
278
275
  }
276
+ .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
277
+ box-shadow: none;
278
+ }
279
279
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
280
280
  padding: 0;
281
281
  }
@@ -285,6 +285,7 @@
285
285
  min-width: auto;
286
286
  width: auto;
287
287
  border-style: solid;
288
+ transform: none;
288
289
  border-width: 1px;
289
290
  border-radius: 2px;
290
291
  z-index: 3;
@@ -295,6 +296,7 @@
295
296
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
296
297
  font-size: 14px;
297
298
  height: auto;
299
+ transform: none;
298
300
  line-height: 14px;
299
301
  padding: 0 5px;
300
302
  width: auto;
@@ -363,6 +365,9 @@
363
365
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
364
366
  overflow-y: hidden;
365
367
  }
368
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
369
+ margin-bottom: 0;
370
+ }
366
371
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
367
372
  padding-top: 1px;
368
373
  height: auto;
@@ -412,6 +417,9 @@
412
417
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
413
418
  left: var(--fileMenuWidth);
414
419
  }
420
+ .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
421
+ padding-right: 30px;
422
+ }
415
423
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
416
424
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
417
425
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -423,6 +431,9 @@
423
431
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
424
432
  right: var(--fileMenuWidth);
425
433
  }
434
+ .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
435
+ padding-left: 30px;
436
+ }
426
437
 
427
438
  .e-ribbon.e-rbn,
428
439
  .e-ribbon-group-overflow-ddb {
@@ -644,6 +655,7 @@
644
655
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
645
656
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
646
657
  border: 1px solid transparent;
658
+ border-radius: 2px;
647
659
  }
648
660
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
649
661
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -762,7 +774,8 @@
762
774
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
763
775
  display: none;
764
776
  }
765
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
777
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
778
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
766
779
  margin: 3px 5px;
767
780
  }
768
781
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -786,22 +799,24 @@
786
799
  -ms-flex-pack: start;
787
800
  justify-content: flex-start;
788
801
  }
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
802
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
795
803
  padding: 3px 5px;
796
804
  font-weight: 600;
797
805
  line-height: 18px;
798
806
  }
799
807
 
808
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
809
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
810
+ transform: rotate(-90deg);
811
+ padding: 5px;
812
+ margin: 0 0 0 auto;
813
+ }
814
+
800
815
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
801
816
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
802
817
  transform: rotate(90deg);
803
- margin-right: auto;
804
- margin-left: unset;
818
+ padding: 5px;
819
+ margin: 0 auto 0 0;
805
820
  }
806
821
 
807
822
  .e-ribbon-menu {
@@ -954,6 +969,12 @@
954
969
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
955
970
  height: auto;
956
971
  }
972
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
973
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
974
+ .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
975
+ .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
976
+ margin-bottom: 0;
977
+ }
957
978
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
958
979
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
959
980
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1168,7 +1189,9 @@
1168
1189
  }
1169
1190
 
1170
1191
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1171
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1192
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1193
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1194
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1172
1195
  margin: 3px 7px;
1173
1196
  }
1174
1197
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1176,6 +1199,18 @@
1176
1199
  margin: 7px;
1177
1200
  padding: 0;
1178
1201
  }
1202
+ .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,
1203
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1204
+ .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,
1205
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1206
+ padding: 7px;
1207
+ }
1208
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1209
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1210
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1211
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1212
+ padding: 7px;
1213
+ }
1179
1214
 
1180
1215
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1181
1216
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
package/styles/ribbon/fluent.css CHANGED
@@ -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;
@@ -276,6 +273,9 @@
276
273
  height: auto;
277
274
  min-height: auto;
278
275
  }
276
+ .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
277
+ box-shadow: none;
278
+ }
279
279
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
280
280
  padding: 0;
281
281
  }
@@ -285,6 +285,7 @@
285
285
  min-width: auto;
286
286
  width: auto;
287
287
  border-style: solid;
288
+ transform: none;
288
289
  border-width: 1px;
289
290
  border-radius: 2px;
290
291
  z-index: 3;
@@ -295,6 +296,7 @@
295
296
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
296
297
  font-size: 14px;
297
298
  height: auto;
299
+ transform: none;
298
300
  line-height: 14px;
299
301
  padding: 0 5px;
300
302
  width: auto;
@@ -363,6 +365,9 @@
363
365
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
364
366
  overflow-y: hidden;
365
367
  }
368
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
369
+ margin-bottom: 0;
370
+ }
366
371
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
367
372
  padding-top: 1px;
368
373
  height: auto;
@@ -412,6 +417,9 @@
412
417
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
413
418
  left: var(--fileMenuWidth);
414
419
  }
420
+ .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
421
+ padding-right: 30px;
422
+ }
415
423
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
416
424
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
417
425
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -423,6 +431,9 @@
423
431
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
424
432
  right: var(--fileMenuWidth);
425
433
  }
434
+ .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
435
+ padding-left: 30px;
436
+ }
426
437
 
427
438
  .e-ribbon.e-rbn,
428
439
  .e-ribbon-group-overflow-ddb {
@@ -644,6 +655,7 @@
644
655
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
645
656
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
646
657
  border: 1px solid transparent;
658
+ border-radius: 2px;
647
659
  }
648
660
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
649
661
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -762,7 +774,8 @@
762
774
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
763
775
  display: none;
764
776
  }
765
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
777
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
778
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
766
779
  margin: 3px 5px;
767
780
  }
768
781
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -786,22 +799,24 @@
786
799
  -ms-flex-pack: start;
787
800
  justify-content: flex-start;
788
801
  }
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
802
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
795
803
  padding: 3px 5px;
796
804
  font-weight: 600;
797
805
  line-height: 18px;
798
806
  }
799
807
 
808
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
809
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
810
+ transform: rotate(-90deg);
811
+ padding: 5px;
812
+ margin: 0 0 0 auto;
813
+ }
814
+
800
815
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
801
816
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
802
817
  transform: rotate(90deg);
803
- margin-right: auto;
804
- margin-left: unset;
818
+ padding: 5px;
819
+ margin: 0 auto 0 0;
805
820
  }
806
821
 
807
822
  .e-ribbon-menu {
@@ -954,6 +969,12 @@
954
969
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
955
970
  height: auto;
956
971
  }
972
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
973
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
974
+ .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
975
+ .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
976
+ margin-bottom: 0;
977
+ }
957
978
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
958
979
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
959
980
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1168,7 +1189,9 @@
1168
1189
  }
1169
1190
 
1170
1191
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1171
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1192
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1193
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1194
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1172
1195
  margin: 3px 7px;
1173
1196
  }
1174
1197
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1176,6 +1199,18 @@
1176
1199
  margin: 7px;
1177
1200
  padding: 0;
1178
1201
  }
1202
+ .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,
1203
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1204
+ .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,
1205
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1206
+ padding: 7px;
1207
+ }
1208
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1209
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1210
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1211
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1212
+ padding: 7px;
1213
+ }
1179
1214
 
1180
1215
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1181
1216
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
package/styles/ribbon/highcontrast-light.css CHANGED
@@ -113,9 +113,6 @@
113
113
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll-content > .e-item:not(.e-active) {
114
114
  display: none;
115
115
  }
116
- .e-ribbon.e-rbn .e-ribbon-tab .e-item {
117
- width: fit-content;
118
- }
119
116
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu {
120
117
  position: absolute;
121
118
  line-height: 22px;
@@ -199,6 +196,9 @@
199
196
  height: auto;
200
197
  min-height: auto;
201
198
  }
199
+ .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
200
+ box-shadow: none;
201
+ }
202
202
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
203
203
  padding: 0;
204
204
  }
@@ -208,6 +208,7 @@
208
208
  min-width: auto;
209
209
  width: auto;
210
210
  border-style: solid;
211
+ transform: none;
211
212
  border-width: 1px;
212
213
  border-radius: unset;
213
214
  z-index: 3;
@@ -218,6 +219,7 @@
218
219
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
219
220
  font-size: 16px;
220
221
  height: auto;
222
+ transform: none;
221
223
  line-height: 16px;
222
224
  padding: 0 4px;
223
225
  width: auto;
@@ -286,6 +288,9 @@
286
288
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
287
289
  overflow-y: hidden;
288
290
  }
291
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
292
+ margin-bottom: 0;
293
+ }
289
294
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
290
295
  padding-top: 5px;
291
296
  height: auto;
@@ -335,6 +340,9 @@
335
340
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
336
341
  left: var(--fileMenuWidth);
337
342
  }
343
+ .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
344
+ padding-right: 30px;
345
+ }
338
346
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
339
347
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
340
348
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -346,6 +354,9 @@
346
354
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
347
355
  right: var(--fileMenuWidth);
348
356
  }
357
+ .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
358
+ padding-left: 30px;
359
+ }
349
360
 
350
361
  .e-ribbon.e-rbn,
351
362
  .e-ribbon-group-overflow-ddb {
@@ -567,6 +578,7 @@
567
578
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
568
579
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
569
580
  border: 1px solid transparent;
581
+ border-radius: unset;
570
582
  }
571
583
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
572
584
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -685,7 +697,8 @@
685
697
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
686
698
  display: none;
687
699
  }
688
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
700
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
701
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
689
702
  margin: 7px 10px;
690
703
  }
691
704
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -709,22 +722,24 @@
709
722
  -ms-flex-pack: start;
710
723
  justify-content: flex-start;
711
724
  }
712
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-icons.e-caret,
713
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-dropdown-btn .e-icons.e-caret {
714
- transform: rotate(-90deg);
715
- margin-left: auto;
716
- }
717
725
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
718
726
  padding: 6px 10px;
719
727
  font-weight: 600;
720
728
  line-height: 16px;
721
729
  }
722
730
 
731
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
732
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
733
+ transform: rotate(-90deg);
734
+ padding: 10px;
735
+ margin: 0 0 0 auto;
736
+ }
737
+
723
738
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
724
739
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
725
740
  transform: rotate(90deg);
726
- margin-right: auto;
727
- margin-left: unset;
741
+ padding: 10px;
742
+ margin: 0 auto 0 0;
728
743
  }
729
744
 
730
745
  .e-ribbon-menu {
@@ -877,6 +892,12 @@
877
892
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
878
893
  height: auto;
879
894
  }
895
+ .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
896
+ .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
897
+ .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
898
+ .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
899
+ margin-bottom: 0;
900
+ }
880
901
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
881
902
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
882
903
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1091,7 +1112,9 @@
1091
1112
  }
1092
1113
 
1093
1114
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1094
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1115
+ .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1116
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1117
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1095
1118
  margin: 7px 10px;
1096
1119
  }
1097
1120
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1099,6 +1122,18 @@
1099
1122
  margin: 10px;
1100
1123
  padding: 0;
1101
1124
  }
1125
+ .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,
1126
+ .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1127
+ .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,
1128
+ .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1129
+ padding: 10px;
1130
+ }
1131
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1132
+ .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1133
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1134
+ .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1135
+ padding: 10px;
1136
+ }
1102
1137
 
1103
1138
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1104
1139
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
package/styles/ribbon/highcontrast.css CHANGED
@@ -122,9 +122,6 @@
122
122
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll-content > .e-item:not(.e-active) {
123
123
  display: none;
124
124
  }
125
- .e-ribbon.e-rbn .e-ribbon-tab .e-item {
126
- width: fit-content;
127
- }
128
125
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu {
129
126
  position: absolute;
130
127
  line-height: 22px;
@@ -208,6 +205,9 @@
208
205
  height: auto;
209
206
  min-height: auto;
210
207
  }
208
+ .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
209
+ box-shadow: none;
210
+ }
211
211
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
212
212
  padding: 0;
213
213
  }
@@ -217,6 +217,7 @@
217
217
  min-width: auto;
218
218
  width: auto;
219
219
  border-style: solid;
220
+ transform: none;
220
221
  border-width: 1px;
221
222
  border-radius: unset;
222
223
  z-index: 3;
@@ -227,6 +228,7 @@
227
228
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
228
229
  font-size: 16px;
229
230
  height: auto;
231
+ transform: none;
230
232
  line-height: 16px;
231
233
  padding: 0 4px;
232
234
  width: auto;
@@ -295,6 +297,9 @@
295
297
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
296
298
  overflow-y: hidden;
297
299
  }
300
+ .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
301
+ margin-bottom: 0;
302
+ }
298
303
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
299
304
  padding-top: 5px;
300
305
  height: auto;
@@ -344,6 +349,9 @@
344
349
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
345
350
  left: var(--fileMenuWidth);
346
351
  }
352
+ .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
353
+ padding-right: 30px;
354
+ }
347
355
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
348
356
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
349
357
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -355,6 +363,9 @@
355
363
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
356
364
  right: var(--fileMenuWidth);
357
365
  }
366
+ .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
367
+ padding-left: 30px;
368
+ }
358
369
 
359
370
  .e-ribbon.e-rbn,
360
371
  .e-ribbon-group-overflow-ddb {
@@ -576,6 +587,7 @@
576
587
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
577
588
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
578
589
  border: 1px solid transparent;
590
+ border-radius: unset;
579
591
  }
580
592
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
581
593
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -694,7 +706,8 @@
694
706
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
695
707
  display: none;
696
708
  }
697
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
709
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
710
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
698
711
  margin: 7px 10px;
699
712
  }
700
713
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -718,22 +731,24 @@
718
731
  -ms-flex-pack: start;
719
732
  justify-content: flex-start;
720
733
  }
721
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-icons.e-caret,
722
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-dropdown-btn .e-icons.e-caret {
723
- transform: rotate(-90deg);
724
- margin-left: auto;
725
- }
726
734
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
727
735
  padding: 6px 10px;
728
736
  font-weight: 600;
729
737
  line-height: 16px;
730
738
  }
731
739
 
740
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
741
+ .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
742
+ transform: rotate(-90deg);
743
+ padding: 10px;
744
+ margin: 0 0 0 auto;
745
+ }
746
+
732
747
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
733
748
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
734
749
  transform: rotate(90deg);
735
- margin-right: auto;
736
- margin-left: unset;
750
+ padding: 10px;
751
+ margin: 0 auto 0 0;
737
752
  }
738
753
 
739
754
  .e-ribbon-menu {
@@ -886,6 +901,12 @@
886
901
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
887
902
  height: auto;
888
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
+ }
889
910
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
890
911
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
891
912
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1100,7 +1121,9 @@
1100
1121
  }
1101
1122
 
1102
1123
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1103
- .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 {
1104
1127
  margin: 7px 10px;
1105
1128
  }
1106
1129
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1108,6 +1131,18 @@
1108
1131
  margin: 10px;
1109
1132
  padding: 0;
1110
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
+ }
1111
1146
 
1112
1147
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1113
1148
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,