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

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/esm2020/public_api.mjs +3 -0
  2. package/esm2020/src/index.mjs +9 -0
  3. package/esm2020/src/ribbon/collections.directive.mjs +70 -0
  4. package/esm2020/src/ribbon/groups.directive.mjs +66 -0
  5. package/esm2020/src/ribbon/items.directive.mjs +78 -0
  6. package/esm2020/src/ribbon/ribbon-all.module.mjs +47 -0
  7. package/esm2020/src/ribbon/ribbon.component.mjs +120 -0
  8. package/esm2020/src/ribbon/ribbon.module.mjs +61 -0
  9. package/esm2020/src/ribbon/tabs.directive.mjs +62 -0
  10. package/esm2020/syncfusion-ej2-angular-ribbon.mjs +5 -0
  11. package/fesm2015/syncfusion-ej2-angular-ribbon.mjs +482 -0
  12. package/fesm2015/syncfusion-ej2-angular-ribbon.mjs.map +1 -0
  13. package/fesm2020/syncfusion-ej2-angular-ribbon.mjs +482 -0
  14. package/fesm2020/syncfusion-ej2-angular-ribbon.mjs.map +1 -0
  15. package/package.json +27 -13
  16. package/src/ribbon/collections.directive.d.ts +5 -0
  17. package/src/ribbon/groups.directive.d.ts +5 -0
  18. package/src/ribbon/items.directive.d.ts +5 -0
  19. package/src/ribbon/ribbon-all.module.d.ts +6 -0
  20. package/src/ribbon/ribbon.component.d.ts +3 -0
  21. package/src/ribbon/ribbon.module.d.ts +10 -0
  22. package/src/ribbon/tabs.directive.d.ts +5 -0
  23. package/styles/bootstrap-dark.css +13 -78
  24. package/styles/bootstrap.css +13 -78
  25. package/styles/bootstrap4.css +13 -78
  26. package/styles/bootstrap5-dark.css +13 -78
  27. package/styles/bootstrap5.css +13 -78
  28. package/styles/fabric-dark.css +13 -78
  29. package/styles/fabric.css +13 -78
  30. package/styles/fluent-dark.css +13 -78
  31. package/styles/fluent.css +13 -78
  32. package/styles/highcontrast-light.css +13 -78
  33. package/styles/highcontrast.css +17 -82
  34. package/styles/material-dark.css +13 -78
  35. package/styles/material.css +13 -78
  36. package/styles/ribbon/_all.scss +2 -0
  37. package/styles/ribbon/_bootstrap-dark-definition.scss +206 -0
  38. package/styles/ribbon/_bootstrap-definition.scss +206 -0
  39. package/styles/ribbon/_bootstrap4-definition.scss +206 -0
  40. package/styles/ribbon/_bootstrap5-dark-definition.scss +1 -0
  41. package/styles/ribbon/_bootstrap5-definition.scss +206 -0
  42. package/styles/ribbon/_fabric-dark-definition.scss +206 -0
  43. package/styles/ribbon/_fabric-definition.scss +206 -0
  44. package/styles/ribbon/_fluent-dark-definition.scss +1 -0
  45. package/styles/ribbon/_fluent-definition.scss +206 -0
  46. package/styles/ribbon/_fusionnew-definition.scss +206 -0
  47. package/styles/ribbon/_highcontrast-definition.scss +206 -0
  48. package/styles/ribbon/_highcontrast-light-definition.scss +206 -0
  49. package/styles/ribbon/_layout.scss +1036 -0
  50. package/styles/ribbon/_material-dark-definition.scss +206 -0
  51. package/styles/ribbon/_material-definition.scss +206 -0
  52. package/styles/ribbon/_tailwind-dark-definition.scss +1 -0
  53. package/styles/ribbon/_tailwind-definition.scss +206 -0
  54. package/styles/ribbon/_theme.scss +343 -0
  55. package/styles/ribbon/bootstrap-dark.css +13 -78
  56. package/styles/ribbon/bootstrap-dark.scss +17 -1
  57. package/styles/ribbon/bootstrap.css +13 -78
  58. package/styles/ribbon/bootstrap.scss +17 -1
  59. package/styles/ribbon/bootstrap4.css +13 -78
  60. package/styles/ribbon/bootstrap4.scss +17 -1
  61. package/styles/ribbon/bootstrap5-dark.css +13 -78
  62. package/styles/ribbon/bootstrap5-dark.scss +17 -1
  63. package/styles/ribbon/bootstrap5.css +13 -78
  64. package/styles/ribbon/bootstrap5.scss +17 -1
  65. package/styles/ribbon/fabric-dark.css +13 -78
  66. package/styles/ribbon/fabric-dark.scss +17 -1
  67. package/styles/ribbon/fabric.css +13 -78
  68. package/styles/ribbon/fabric.scss +17 -1
  69. package/styles/ribbon/fluent-dark.css +13 -78
  70. package/styles/ribbon/fluent-dark.scss +17 -1
  71. package/styles/ribbon/fluent.css +13 -78
  72. package/styles/ribbon/fluent.scss +17 -1
  73. package/styles/ribbon/highcontrast-light.css +13 -78
  74. package/styles/ribbon/highcontrast-light.scss +16 -1
  75. package/styles/ribbon/highcontrast.css +17 -82
  76. package/styles/ribbon/highcontrast.scss +17 -1
  77. package/styles/ribbon/icons/_bootstrap-dark.scss +9 -0
  78. package/styles/ribbon/icons/_bootstrap.scss +9 -0
  79. package/styles/ribbon/icons/_bootstrap4.scss +9 -0
  80. package/styles/ribbon/icons/_bootstrap5-dark.scss +1 -0
  81. package/styles/ribbon/icons/_bootstrap5.scss +9 -0
  82. package/styles/ribbon/icons/_fabric-dark.scss +9 -0
  83. package/styles/ribbon/icons/_fabric.scss +9 -0
  84. package/styles/ribbon/icons/_fluent-dark.scss +1 -0
  85. package/styles/ribbon/icons/_fluent.scss +9 -0
  86. package/styles/ribbon/icons/_fusionnew.scss +9 -0
  87. package/styles/ribbon/icons/_highcontrast.scss +9 -0
  88. package/styles/ribbon/icons/_material-dark.scss +9 -0
  89. package/styles/ribbon/icons/_material.scss +9 -0
  90. package/styles/ribbon/icons/_material3.scss +9 -0
  91. package/styles/ribbon/icons/_tailwind-dark.scss +9 -0
  92. package/styles/ribbon/icons/_tailwind.scss +9 -0
  93. package/styles/ribbon/material-dark.css +13 -78
  94. package/styles/ribbon/material-dark.scss +17 -1
  95. package/styles/ribbon/material.css +13 -78
  96. package/styles/ribbon/material.scss +17 -1
  97. package/styles/ribbon/tailwind-dark.css +13 -78
  98. package/styles/ribbon/tailwind-dark.scss +17 -1
  99. package/styles/ribbon/tailwind.css +13 -78
  100. package/styles/ribbon/tailwind.scss +17 -1
  101. package/styles/tailwind-dark.css +13 -78
  102. package/styles/tailwind.css +13 -78
  103. package/syncfusion-ej2-angular-ribbon.d.ts +5 -0
  104. package/@syncfusion/ej2-angular-ribbon.es5.js +0 -566
  105. package/@syncfusion/ej2-angular-ribbon.es5.js.map +0 -1
  106. package/@syncfusion/ej2-angular-ribbon.js +0 -526
  107. package/@syncfusion/ej2-angular-ribbon.js.map +0 -1
  108. package/CHANGELOG.md +0 -21
  109. package/dist/ej2-angular-ribbon.umd.js +0 -710
  110. package/dist/ej2-angular-ribbon.umd.js.map +0 -1
  111. package/dist/ej2-angular-ribbon.umd.min.js +0 -11
  112. package/dist/ej2-angular-ribbon.umd.min.js.map +0 -1
  113. package/ej2-angular-ribbon.d.ts +0 -5
  114. package/ej2-angular-ribbon.metadata.json +0 -1
  115. package/license +0 -10
  116. package/postinstall/tagchange.js +0 -18
  117. package/schematics/collection.json +0 -10
  118. package/schematics/ng-add/index.d.ts +0 -3
  119. package/schematics/ng-add/index.js +0 -9
  120. package/schematics/ng-add/index.ts +0 -10
  121. package/schematics/ng-add/schema.d.ts +0 -13
  122. package/schematics/ng-add/schema.js +0 -2
  123. package/schematics/ng-add/schema.json +0 -34
  124. package/schematics/ng-add/schema.ts +0 -30
  125. package/schematics/tsconfig.json +0 -25
  126. package/schematics/utils/lib-details.d.ts +0 -4
  127. package/schematics/utils/lib-details.js +0 -6
  128. package/schematics/utils/lib-details.ts +0 -4
  129. package/styles/material3-dark.css +0 -1671
  130. package/styles/material3-dark.scss +0 -2
  131. package/styles/material3.css +0 -1727
  132. package/styles/material3.scss +0 -2
  133. package/styles/ribbon/material3-dark.css +0 -1671
  134. package/styles/ribbon/material3-dark.scss +0 -2
  135. package/styles/ribbon/material3.css +0 -1727
  136. package/styles/ribbon/material3.scss +0 -2
@@ -0,0 +1,9 @@
1
+ @include export-module('ribbon-tailwind-dark-icons') {
2
+ .e-ribbon {
3
+ & .e-drop-icon {
4
+ &::before {
5
+ content: '\e729';
6
+ }
7
+ }
8
+ }
9
+ }
@@ -0,0 +1,9 @@
1
+ @include export-module('ribbon-tailwind-icons') {
2
+ .e-ribbon {
3
+ & .e-drop-icon {
4
+ &::before {
5
+ content: '\e729';
6
+ }
7
+ }
8
+ }
9
+ }
@@ -176,6 +176,9 @@
176
176
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll-content > .e-item:not(.e-active) {
177
177
  display: none;
178
178
  }
179
+ .e-ribbon.e-rbn .e-ribbon-tab .e-item {
180
+ width: fit-content;
181
+ }
179
182
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu {
180
183
  position: absolute;
181
184
  line-height: 22px;
@@ -184,7 +187,6 @@
184
187
  border-width: 0 0 1px 0;
185
188
  font-size: 14px;
186
189
  font-weight: 400;
187
- box-shadow: none;
188
190
  }
189
191
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
190
192
  border-radius: unset;
@@ -260,9 +262,6 @@
260
262
  height: auto;
261
263
  min-height: auto;
262
264
  }
263
- .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
264
- box-shadow: none;
265
- }
266
265
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
267
266
  padding: 0;
268
267
  }
@@ -272,10 +271,9 @@
272
271
  min-width: auto;
273
272
  width: auto;
274
273
  border-style: solid;
275
- transform: none;
276
274
  border-width: 1px;
277
275
  border-radius: unset;
278
- z-index: 3;
276
+ z-index: 2;
279
277
  }
280
278
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav.e-overlay {
281
279
  display: none;
@@ -283,7 +281,6 @@
283
281
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
284
282
  font-size: 16px;
285
283
  height: auto;
286
- transform: none;
287
284
  line-height: 16px;
288
285
  padding: 0 4px;
289
286
  width: auto;
@@ -322,7 +319,6 @@
322
319
  border: none;
323
320
  height: 32px;
324
321
  margin: auto;
325
- box-shadow: none;
326
322
  }
327
323
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
328
324
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -353,9 +349,6 @@
353
349
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
354
350
  overflow-y: hidden;
355
351
  }
356
- .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
357
- margin-bottom: 0;
358
- }
359
352
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
360
353
  padding-top: 2px;
361
354
  height: auto;
@@ -405,9 +398,6 @@
405
398
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
406
399
  left: var(--fileMenuWidth);
407
400
  }
408
- .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
409
- padding-right: 30px;
410
- }
411
401
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
412
402
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
413
403
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -419,9 +409,6 @@
419
409
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
420
410
  right: var(--fileMenuWidth);
421
411
  }
422
- .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
423
- padding-left: 30px;
424
- }
425
412
 
426
413
  .e-ribbon.e-rbn,
427
414
  .e-ribbon-group-overflow-ddb {
@@ -462,8 +449,6 @@
462
449
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
463
450
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
464
451
  min-width: auto;
465
- min-height: auto;
466
- border-radius: unset;
467
452
  }
468
453
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
469
454
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -547,7 +532,6 @@
547
532
  font-weight: 400;
548
533
  font-size: 12px;
549
534
  text-transform: none;
550
- box-shadow: none;
551
535
  }
552
536
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
553
537
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -646,7 +630,6 @@
646
630
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
647
631
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
648
632
  border: 1px solid transparent;
649
- border-radius: unset;
650
633
  }
651
634
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
652
635
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -656,7 +639,6 @@
656
639
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
657
640
  border: 1px solid transparent;
658
641
  border-radius: unset;
659
- box-shadow: none;
660
642
  }
661
643
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
662
644
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -766,8 +748,7 @@
766
748
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
767
749
  display: none;
768
750
  }
769
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
770
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
751
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
771
752
  margin: 7px 8px;
772
753
  }
773
754
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -791,24 +772,22 @@
791
772
  -ms-flex-pack: start;
792
773
  justify-content: flex-start;
793
774
  }
775
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-split-btn-wrapper .e-icons.e-caret,
776
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item.e-ribbon-medium-item > .e-dropdown-btn .e-icons.e-caret {
777
+ transform: rotate(-90deg);
778
+ margin-left: auto;
779
+ }
794
780
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
795
781
  padding: 7px 8px;
796
782
  font-weight: 400;
797
783
  line-height: 22px;
798
784
  }
799
785
 
800
- .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
801
- .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
802
- transform: rotate(-90deg);
803
- padding: 8px;
804
- margin: 0 0 0 auto;
805
- }
806
-
807
786
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
808
787
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
809
788
  transform: rotate(90deg);
810
- padding: 8px;
811
- margin: 0 auto 0 0;
789
+ margin-right: auto;
790
+ margin-left: unset;
812
791
  }
813
792
 
814
793
  .e-ribbon-menu {
@@ -828,17 +807,6 @@
828
807
  padding-left: 34px !important; /* stylelint-disable-line declaration-no-important */
829
808
  }
830
809
 
831
- .e-ribbon-control.e-dropdown-popup ul .e-item {
832
- font-size: 14px;
833
- height: 36px;
834
- -ms-flex-align: center;
835
- align-items: center;
836
- }
837
- .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
838
- font-size: 16px;
839
- line-height: 16px;
840
- }
841
-
842
810
  .e-ribbon-tooltip .e-tip-content {
843
811
  padding: 4px;
844
812
  }
@@ -877,10 +845,6 @@
877
845
  padding-right: 16px;
878
846
  height: 56px;
879
847
  }
880
- .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-hscroll,
881
- .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
882
- min-height: auto;
883
- }
884
848
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-hor-nav,
885
849
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-hor-nav {
886
850
  height: 56px;
@@ -972,12 +936,6 @@
972
936
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
973
937
  height: auto;
974
938
  }
975
- .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
976
- .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
977
- .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
978
- .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
979
- margin-bottom: 0;
980
- }
981
939
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
982
940
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
983
941
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1192,9 +1150,7 @@
1192
1150
  }
1193
1151
 
1194
1152
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1195
- .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1196
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1197
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1153
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1198
1154
  margin: 7px 8px;
1199
1155
  }
1200
1156
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1202,27 +1158,6 @@
1202
1158
  margin: 8px;
1203
1159
  padding: 0;
1204
1160
  }
1205
- .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,
1206
- .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1207
- .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,
1208
- .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1209
- padding: 8px;
1210
- }
1211
- .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1212
- .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1213
- .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1214
- .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1215
- padding: 8px;
1216
- }
1217
-
1218
- .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1219
- font-size: 16px;
1220
- height: 48px;
1221
- }
1222
- .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1223
- font-size: 20px;
1224
- line-height: 20px;
1225
- }
1226
1161
 
1227
1162
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1228
1163
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
@@ -1 +1,17 @@
1
- @import 'ej2-ribbon/styles/ribbon/material-dark.scss';
1
+ @import 'ej2-base/styles/material-dark-definition.scss';
2
+ @import 'ej2-popups/styles/tooltip/material-dark-definition.scss';
3
+ @import 'ej2-buttons/styles/button/material-dark-definition.scss';
4
+ @import 'ej2-buttons/styles/check-box/material-dark-definition.scss';
5
+ @import 'ej2-splitbuttons/styles/drop-down-button/material-dark-definition.scss';
6
+ @import 'ej2-dropdowns/styles/drop-down-base/material-dark-definition.scss';
7
+ @import 'ej2-dropdowns/styles/drop-down-list/material-dark-definition.scss';
8
+ @import 'ej2-dropdowns/styles/combo-box/material-dark-definition.scss';
9
+ @import 'ej2-navigations/styles/h-scroll/material-dark-definition.scss';
10
+ @import 'ej2-navigations/styles/v-scroll/material-dark-definition.scss';
11
+ @import 'ej2-navigations/styles/context-menu/material-dark-definition.scss';
12
+ @import 'ej2-navigations/styles/toolbar/material-dark-definition.scss';
13
+ @import 'ej2-navigations/styles/menu/material-dark-definition.scss';
14
+ @import 'ej2-navigations/styles/tab/material-dark-definition.scss';
15
+ @import 'material-dark-definition.scss';
16
+ @import 'icons/material-dark.scss';
17
+ @import 'all.scss';
@@ -209,6 +209,9 @@
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
+ }
212
215
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu {
213
216
  position: absolute;
214
217
  line-height: 22px;
@@ -217,7 +220,6 @@
217
220
  border-width: 0 0 1px 0;
218
221
  font-size: 14px;
219
222
  font-weight: 400;
220
- box-shadow: none;
221
223
  }
222
224
  .e-ribbon.e-rbn .e-ribbon-tab .e-ribbon-file-menu.e-active {
223
225
  border-radius: unset;
@@ -293,9 +295,6 @@
293
295
  height: auto;
294
296
  min-height: auto;
295
297
  }
296
- .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
297
- box-shadow: none;
298
- }
299
298
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
300
299
  padding: 0;
301
300
  }
@@ -305,10 +304,9 @@
305
304
  min-width: auto;
306
305
  width: auto;
307
306
  border-style: solid;
308
- transform: none;
309
307
  border-width: 1px;
310
308
  border-radius: unset;
311
- z-index: 3;
309
+ z-index: 2;
312
310
  }
313
311
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav.e-overlay {
314
312
  display: none;
@@ -316,7 +314,6 @@
316
314
  .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll .e-scroll-nav .e-nav-arrow {
317
315
  font-size: 16px;
318
316
  height: auto;
319
- transform: none;
320
317
  line-height: 16px;
321
318
  padding: 0 4px;
322
319
  width: auto;
@@ -355,7 +352,6 @@
355
352
  border: none;
356
353
  height: 32px;
357
354
  margin: auto;
358
- box-shadow: none;
359
355
  }
360
356
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn .e-btn-icon,
361
357
  .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn .e-btn-icon {
@@ -386,9 +382,6 @@
386
382
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-tab .e-hscroll-bar {
387
383
  overflow-y: hidden;
388
384
  }
389
- .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group {
390
- margin-bottom: 0;
391
- }
392
385
  .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group {
393
386
  padding-top: 2px;
394
387
  height: auto;
@@ -438,9 +431,6 @@
438
431
  .e-ribbon.e-rbn:not(.e-rtl) .e-tab-header {
439
432
  left: var(--fileMenuWidth);
440
433
  }
441
- .e-ribbon.e-rbn:not(.e-rtl) .e-ribbon-tab .e-hscroll.e-scroll-device {
442
- padding-right: 30px;
443
- }
444
434
  .e-ribbon.e-rbn.e-rtl .e-ribbon-collapse-btn,
445
435
  .e-ribbon.e-rbn.e-rtl .e-ribbon-help-template,
446
436
  .e-ribbon.e-rbn.e-rtl .e-ribbon-group::after {
@@ -452,9 +442,6 @@
452
442
  .e-ribbon.e-rbn.e-rtl .e-tab-header {
453
443
  right: var(--fileMenuWidth);
454
444
  }
455
- .e-ribbon.e-rbn.e-rtl .e-ribbon-tab .e-hscroll.e-scroll-device {
456
- padding-left: 30px;
457
- }
458
445
 
459
446
  .e-ribbon.e-rbn,
460
447
  .e-ribbon-group-overflow-ddb {
@@ -495,8 +482,6 @@
495
482
  .e-ribbon.e-rbn .e-input-group.e-control-wrapper .e-clear-icon,
496
483
  .e-ribbon-group-overflow-ddb .e-input-group.e-control-wrapper .e-clear-icon {
497
484
  min-width: auto;
498
- min-height: auto;
499
- border-radius: unset;
500
485
  }
501
486
  .e-ribbon.e-rbn .e-input-group .e-clear-icon,
502
487
  .e-ribbon-group-overflow-ddb .e-input-group .e-clear-icon {
@@ -580,7 +565,6 @@
580
565
  font-weight: 400;
581
566
  font-size: 12px;
582
567
  text-transform: none;
583
- box-shadow: none;
584
568
  }
585
569
  .e-ribbon.e-rbn .e-ribbon-group-overflow .e-btn:focus,
586
570
  .e-ribbon.e-rbn .e-ribbon-item .e-btn:focus,
@@ -679,7 +663,6 @@
679
663
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper,
680
664
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper {
681
665
  border: 1px solid transparent;
682
- border-radius: unset;
683
666
  }
684
667
  .e-ribbon.e-rbn .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn,
685
668
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-colorpicker-wrapper .e-split-btn-wrapper.e-rtl .e-split-colorpicker.e-split-btn {
@@ -689,7 +672,6 @@
689
672
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper {
690
673
  border: 1px solid transparent;
691
674
  border-radius: unset;
692
- box-shadow: none;
693
675
  }
694
676
  .e-ribbon.e-rbn .e-ribbon-item .e-split-btn-wrapper .e-btn,
695
677
  .e-ribbon-group-overflow-ddb .e-ribbon-item .e-split-btn-wrapper .e-btn {
@@ -799,8 +781,7 @@
799
781
  .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
800
782
  display: none;
801
783
  }
802
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
803
- .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
784
+ .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
804
785
  margin: 3px 8px;
805
786
  }
806
787
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper {
@@ -824,24 +805,22 @@
824
805
  -ms-flex-pack: start;
825
806
  justify-content: flex-start;
826
807
  }
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
+ }
827
813
  .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-overflow-header {
828
814
  padding: 3px 8px;
829
815
  font-weight: 600;
830
816
  line-height: 18px;
831
817
  }
832
818
 
833
- .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
834
- .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
835
- transform: rotate(-90deg);
836
- padding: 8px;
837
- margin: 0 0 0 auto;
838
- }
839
-
840
819
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
841
820
  .e-rtl.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
842
821
  transform: rotate(90deg);
843
- padding: 8px;
844
- margin: 0 auto 0 0;
822
+ margin-right: auto;
823
+ margin-left: unset;
845
824
  }
846
825
 
847
826
  .e-ribbon-menu {
@@ -861,17 +840,6 @@
861
840
  padding-left: 34px !important; /* stylelint-disable-line declaration-no-important */
862
841
  }
863
842
 
864
- .e-ribbon-control.e-dropdown-popup ul .e-item {
865
- font-size: 14px;
866
- height: 36px;
867
- -ms-flex-align: center;
868
- align-items: center;
869
- }
870
- .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
871
- font-size: 16px;
872
- line-height: 16px;
873
- }
874
-
875
843
  .e-ribbon-tooltip .e-tip-content {
876
844
  padding: 4px;
877
845
  }
@@ -910,10 +878,6 @@
910
878
  padding-right: 16px;
911
879
  height: 56px;
912
880
  }
913
- .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-hscroll,
914
- .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-hscroll {
915
- min-height: auto;
916
- }
917
881
  .e-bigger.e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-hor-nav,
918
882
  .e-bigger .e-ribbon.e-rbn .e-ribbon-tab .e-tab-header .e-hor-nav {
919
883
  height: 56px;
@@ -1005,12 +969,6 @@
1005
969
  .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group {
1006
970
  height: auto;
1007
971
  }
1008
- .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
1009
- .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-input-group,
1010
- .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group,
1011
- .e-bigger.e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-input-group {
1012
- margin-bottom: 0;
1013
- }
1014
972
  .e-bigger.e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
1015
973
  .e-bigger .e-ribbon.e-rbn.e-ribbon-simplified-mode .e-ribbon-group-content,
1016
974
  .e-bigger .e-ribbon-group-overflow-ddb.e-ribbon-simplified-mode .e-ribbon-group-content,
@@ -1225,9 +1183,7 @@
1225
1183
  }
1226
1184
 
1227
1185
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1228
- .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template,
1229
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group,
1230
- .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item .e-ribbon-template {
1186
+ .e-bigger.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-input-group {
1231
1187
  margin: 3px 8px;
1232
1188
  }
1233
1189
  .e-bigger .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-item > .e-checkbox-wrapper,
@@ -1235,27 +1191,6 @@
1235
1191
  margin: 8px;
1236
1192
  padding: 0;
1237
1193
  }
1238
- .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,
1239
- .e-bigger .e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1240
- .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,
1241
- .e-bigger.e-ribbon-group-overflow-ddb:not(.e-rtl) .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1242
- padding: 8px;
1243
- }
1244
- .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1245
- .e-bigger .e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret,
1246
- .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-split-btn-wrapper .e-icons.e-caret,
1247
- .e-bigger.e-ribbon-group-overflow-ddb.e-rtl .e-ribbon-overflow-target .e-ribbon-item > .e-dropdown-btn .e-icons.e-caret {
1248
- padding: 8px;
1249
- }
1250
-
1251
- .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item {
1252
- font-size: 16px;
1253
- height: 48px;
1254
- }
1255
- .e-bigger .e-ribbon-control.e-dropdown-popup ul .e-item .e-menu-icon {
1256
- font-size: 20px;
1257
- line-height: 20px;
1258
- }
1259
1194
 
1260
1195
  .e-bigger .e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
1261
1196
  .e-bigger.e-ribbon-menu.e-menu-wrapper ul.e-vertical .e-menu-item.e-blankicon,
@@ -1 +1,17 @@
1
- @import 'ej2-ribbon/styles/ribbon/material.scss';
1
+ @import 'ej2-base/styles/material-definition.scss';
2
+ @import 'ej2-popups/styles/tooltip/material-definition.scss';
3
+ @import 'ej2-buttons/styles/button/material-definition.scss';
4
+ @import 'ej2-buttons/styles/check-box/material-definition.scss';
5
+ @import 'ej2-splitbuttons/styles/drop-down-button/material-definition.scss';
6
+ @import 'ej2-dropdowns/styles/drop-down-base/material-definition.scss';
7
+ @import 'ej2-dropdowns/styles/drop-down-list/material-definition.scss';
8
+ @import 'ej2-dropdowns/styles/combo-box/material-definition.scss';
9
+ @import 'ej2-navigations/styles/h-scroll/material-definition.scss';
10
+ @import 'ej2-navigations/styles/v-scroll/material-definition.scss';
11
+ @import 'ej2-navigations/styles/context-menu/material-definition.scss';
12
+ @import 'ej2-navigations/styles/toolbar/material-definition.scss';
13
+ @import 'ej2-navigations/styles/menu/material-definition.scss';
14
+ @import 'ej2-navigations/styles/tab/material-definition.scss';
15
+ @import 'material-definition.scss';
16
+ @import 'icons/material.scss';
17
+ @import 'all.scss';