@syncfusion/ej2-navigations 20.4.44 → 20.4.49

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 (84) hide show
  1. package/CHANGELOG.md +35 -0
  2. package/dist/ej2-navigations.min.js +2 -2
  3. package/dist/ej2-navigations.umd.min.js +2 -2
  4. package/dist/ej2-navigations.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-navigations.es2015.js +106 -31
  6. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  7. package/dist/es6/ej2-navigations.es5.js +116 -40
  8. package/dist/es6/ej2-navigations.es5.js.map +1 -1
  9. package/dist/global/ej2-navigations.min.js +2 -2
  10. package/dist/global/ej2-navigations.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +11 -11
  13. package/src/carousel/carousel.js +2 -4
  14. package/src/common/index.d.ts +1 -1
  15. package/src/common/index.js +1 -1
  16. package/src/common/menu-base.js +4 -0
  17. package/src/menu/menu.js +1 -0
  18. package/src/sidebar/sidebar.js +1 -1
  19. package/src/tab/tab.js +8 -4
  20. package/src/toolbar/toolbar.js +16 -4
  21. package/src/treeview/treeview.d.ts +14 -0
  22. package/src/treeview/treeview.js +83 -26
  23. package/styles/accordion/_theme.scss +4 -4
  24. package/styles/accordion/bootstrap-dark.css +3 -3
  25. package/styles/accordion/bootstrap.css +3 -3
  26. package/styles/accordion/bootstrap4.css +3 -3
  27. package/styles/accordion/bootstrap5-dark.css +3 -3
  28. package/styles/accordion/bootstrap5.css +3 -3
  29. package/styles/accordion/fabric-dark.css +3 -3
  30. package/styles/accordion/fabric.css +3 -3
  31. package/styles/accordion/fluent-dark.css +3 -3
  32. package/styles/accordion/fluent.css +3 -3
  33. package/styles/accordion/highcontrast-light.css +3 -3
  34. package/styles/accordion/highcontrast.css +3 -3
  35. package/styles/accordion/material-dark.css +3 -3
  36. package/styles/accordion/material.css +3 -3
  37. package/styles/accordion/tailwind-dark.css +3 -3
  38. package/styles/accordion/tailwind.css +3 -3
  39. package/styles/bootstrap-dark.css +4 -3
  40. package/styles/bootstrap.css +4 -3
  41. package/styles/bootstrap4.css +5 -4
  42. package/styles/bootstrap5-dark.css +5 -44
  43. package/styles/bootstrap5.css +5 -44
  44. package/styles/context-menu/_layout-mixin.scss +3 -1
  45. package/styles/context-menu/_layout.scss +3 -1
  46. package/styles/context-menu/_theme-mixin.scss +16 -12
  47. package/styles/context-menu/bootstrap5-dark.css +0 -24
  48. package/styles/context-menu/bootstrap5.css +0 -24
  49. package/styles/context-menu/fluent-dark.css +0 -14
  50. package/styles/context-menu/fluent.css +0 -14
  51. package/styles/fabric-dark.css +8 -7
  52. package/styles/fabric.css +8 -7
  53. package/styles/fluent-dark.css +5 -19
  54. package/styles/fluent.css +5 -19
  55. package/styles/highcontrast-light.css +4 -3
  56. package/styles/highcontrast.css +4 -3
  57. package/styles/material-dark.css +4 -3
  58. package/styles/material.css +4 -3
  59. package/styles/menu/_layout.scss +1 -0
  60. package/styles/menu/_theme.scss +1 -1
  61. package/styles/menu/bootstrap-dark.css +1 -0
  62. package/styles/menu/bootstrap.css +1 -0
  63. package/styles/menu/bootstrap4.css +1 -0
  64. package/styles/menu/bootstrap5-dark.css +1 -16
  65. package/styles/menu/bootstrap5.css +1 -16
  66. package/styles/menu/fabric-dark.css +5 -4
  67. package/styles/menu/fabric.css +5 -4
  68. package/styles/menu/fluent-dark.css +2 -2
  69. package/styles/menu/fluent.css +2 -2
  70. package/styles/menu/highcontrast-light.css +1 -0
  71. package/styles/menu/highcontrast.css +1 -0
  72. package/styles/menu/icons/_fabric-dark.scss +4 -4
  73. package/styles/menu/icons/_fabric.scss +4 -4
  74. package/styles/menu/material-dark.css +1 -0
  75. package/styles/menu/material.css +1 -0
  76. package/styles/menu/tailwind-dark.css +1 -0
  77. package/styles/menu/tailwind.css +1 -0
  78. package/styles/tailwind-dark.css +4 -3
  79. package/styles/tailwind.css +4 -3
  80. package/styles/treeview/_bootstrap4-definition.scss +1 -1
  81. package/styles/treeview/_bootstrap5-definition.scss +1 -1
  82. package/styles/treeview/bootstrap4.css +1 -1
  83. package/styles/treeview/bootstrap5-dark.css +1 -1
  84. package/styles/treeview/bootstrap5.css +1 -1
@@ -275,15 +275,15 @@
275
275
  border: 1px solid #292827;
276
276
  border-radius: 2px;
277
277
  }
278
- .e-accordion .e-active {
279
- background: #1b1a19;
280
- }
281
278
  .e-accordion .e-acrdn-item {
282
279
  border-color: #292827;
283
280
  border-style: solid;
284
281
  border-width: 0;
285
282
  border-radius: 0;
286
283
  }
284
+ .e-accordion .e-acrdn-item.e-active {
285
+ background: #1b1a19;
286
+ }
287
287
  .e-accordion .e-acrdn-item.e-select:last-child {
288
288
  border-bottom: 0;
289
289
  border-radius: 0;
@@ -275,15 +275,15 @@
275
275
  border: 1px solid #edebe9;
276
276
  border-radius: 2px;
277
277
  }
278
- .e-accordion .e-active {
279
- background: #fff;
280
- }
281
278
  .e-accordion .e-acrdn-item {
282
279
  border-color: #edebe9;
283
280
  border-style: solid;
284
281
  border-width: 0;
285
282
  border-radius: 0;
286
283
  }
284
+ .e-accordion .e-acrdn-item.e-active {
285
+ background: #fff;
286
+ }
287
287
  .e-accordion .e-acrdn-item.e-select:last-child {
288
288
  border-bottom: 0;
289
289
  border-radius: 0;
@@ -274,15 +274,15 @@
274
274
  border: 1px solid #757575;
275
275
  border-radius: 0;
276
276
  }
277
- .e-accordion .e-active {
278
- background: #ccc;
279
- }
280
277
  .e-accordion .e-acrdn-item {
281
278
  border-color: #757575;
282
279
  border-style: solid;
283
280
  border-width: 0;
284
281
  border-radius: 0;
285
282
  }
283
+ .e-accordion .e-acrdn-item.e-active {
284
+ background: #ccc;
285
+ }
286
286
  .e-accordion .e-acrdn-item.e-select:last-child {
287
287
  border-bottom: 0;
288
288
  border-radius: 0;
@@ -275,15 +275,15 @@
275
275
  border: 1px solid #969696;
276
276
  border-radius: 0;
277
277
  }
278
- .e-accordion .e-active {
279
- background: #000;
280
- }
281
278
  .e-accordion .e-acrdn-item {
282
279
  border-color: #969696;
283
280
  border-style: solid;
284
281
  border-width: 0;
285
282
  border-radius: 0;
286
283
  }
284
+ .e-accordion .e-acrdn-item.e-active {
285
+ background: #000;
286
+ }
287
287
  .e-accordion .e-acrdn-item.e-select:last-child {
288
288
  border-bottom: 0;
289
289
  border-radius: 0;
@@ -275,15 +275,15 @@
275
275
  border: 1px solid #616161;
276
276
  border-radius: 0;
277
277
  }
278
- .e-accordion .e-active {
279
- background: #303030;
280
- }
281
278
  .e-accordion .e-acrdn-item {
282
279
  border-color: #616161;
283
280
  border-style: solid;
284
281
  border-width: 0;
285
282
  border-radius: 0;
286
283
  }
284
+ .e-accordion .e-acrdn-item.e-active {
285
+ background: #303030;
286
+ }
287
287
  .e-accordion .e-acrdn-item.e-select:last-child {
288
288
  border-bottom: 1px solid transparent;
289
289
  border-radius: 0;
@@ -276,15 +276,15 @@
276
276
  border: 1px solid rgba(0, 0, 0, 0.12);
277
277
  border-radius: 0;
278
278
  }
279
- .e-accordion .e-active {
280
- background: #fff;
281
- }
282
279
  .e-accordion .e-acrdn-item {
283
280
  border-color: rgba(0, 0, 0, 0.12);
284
281
  border-style: solid;
285
282
  border-width: 0;
286
283
  border-radius: 0;
287
284
  }
285
+ .e-accordion .e-acrdn-item.e-active {
286
+ background: #fff;
287
+ }
288
288
  .e-accordion .e-acrdn-item.e-select:last-child {
289
289
  border-bottom: 1px solid transparent;
290
290
  border-radius: 0;
@@ -276,15 +276,15 @@
276
276
  border: 1px solid #4b5563;
277
277
  border-radius: 0;
278
278
  }
279
- .e-accordion .e-active {
280
- background: #1f2937;
281
- }
282
279
  .e-accordion .e-acrdn-item {
283
280
  border-color: #4b5563;
284
281
  border-style: solid;
285
282
  border-width: 0 0 1px 0;
286
283
  border-radius: 4px 4px 0 0;
287
284
  }
285
+ .e-accordion .e-acrdn-item.e-active {
286
+ background: #1f2937;
287
+ }
288
288
  .e-accordion .e-acrdn-item.e-select:last-child {
289
289
  border-bottom: 0;
290
290
  border-radius: 0 0 4px 4px;
@@ -276,15 +276,15 @@
276
276
  border: 1px solid #e5e7eb;
277
277
  border-radius: 0;
278
278
  }
279
- .e-accordion .e-active {
280
- background: #fff;
281
- }
282
279
  .e-accordion .e-acrdn-item {
283
280
  border-color: #e5e7eb;
284
281
  border-style: solid;
285
282
  border-width: 0 0 1px 0;
286
283
  border-radius: 4px 4px 0 0;
287
284
  }
285
+ .e-accordion .e-acrdn-item.e-active {
286
+ background: #fff;
287
+ }
288
288
  .e-accordion .e-acrdn-item.e-select:last-child {
289
289
  border-bottom: 0;
290
290
  border-radius: 0 0 4px 4px;
@@ -2774,15 +2774,15 @@
2774
2774
  border: 1px none #505050;
2775
2775
  border-radius: 0;
2776
2776
  }
2777
- .e-accordion .e-active {
2778
- background: #484848;
2779
- }
2780
2777
  .e-accordion .e-acrdn-item {
2781
2778
  border-color: #505050;
2782
2779
  border-style: solid;
2783
2780
  border-width: 0;
2784
2781
  border-radius: 4px;
2785
2782
  }
2783
+ .e-accordion .e-acrdn-item.e-active {
2784
+ background: #484848;
2785
+ }
2786
2786
  .e-accordion .e-acrdn-item.e-select:last-child {
2787
2787
  border-bottom: 1px solid #505050;
2788
2788
  border-radius: 4px;
@@ -8751,6 +8751,7 @@ ejs-sidebar {
8751
8751
  line-height: 42px;
8752
8752
  margin-right: 8px;
8753
8753
  text-align: center;
8754
+ margin-bottom: 4px;
8754
8755
  }
8755
8756
  .e-menu-wrapper ul .e-menu-item .e-caret,
8756
8757
  .e-menu-container ul .e-menu-item .e-caret {
@@ -2778,15 +2778,15 @@
2778
2778
  border: 1px none #ddd;
2779
2779
  border-radius: 0;
2780
2780
  }
2781
- .e-accordion .e-active {
2782
- background: #fff;
2783
- }
2784
2781
  .e-accordion .e-acrdn-item {
2785
2782
  border-color: #ddd;
2786
2783
  border-style: solid;
2787
2784
  border-width: 0;
2788
2785
  border-radius: 4px;
2789
2786
  }
2787
+ .e-accordion .e-acrdn-item.e-active {
2788
+ background: #fff;
2789
+ }
2790
2790
  .e-accordion .e-acrdn-item.e-select:last-child {
2791
2791
  border-bottom: 1px solid #ddd;
2792
2792
  border-radius: 4px;
@@ -8767,6 +8767,7 @@ ejs-sidebar {
8767
8767
  line-height: 40px;
8768
8768
  margin-right: 8px;
8769
8769
  text-align: center;
8770
+ margin-bottom: 4px;
8770
8771
  }
8771
8772
  .e-menu-wrapper ul .e-menu-item .e-caret,
8772
8773
  .e-menu-container ul .e-menu-item .e-caret {
@@ -2777,15 +2777,15 @@
2777
2777
  border: 1px solid rgba(0, 0, 0, 0.13);
2778
2778
  border-radius: 4px;
2779
2779
  }
2780
- .e-accordion .e-active {
2781
- background: #fff;
2782
- }
2783
2780
  .e-accordion .e-acrdn-item {
2784
2781
  border-color: rgba(0, 0, 0, 0.13);
2785
2782
  border-style: solid;
2786
2783
  border-width: 0 0 1px 0;
2787
2784
  border-radius: 4px 4px 0 0;
2788
2785
  }
2786
+ .e-accordion .e-acrdn-item.e-active {
2787
+ background: #fff;
2788
+ }
2789
2789
  .e-accordion .e-acrdn-item.e-select:last-child {
2790
2790
  border-bottom: 0;
2791
2791
  border-radius: 0 0 4px 4px;
@@ -8098,7 +8098,7 @@
8098
8098
  .e-treeview .e-icon-expandable {
8099
8099
  display: inline-block;
8100
8100
  height: 20px;
8101
- margin: 0 2px 0 -24px;
8101
+ margin: 0 4px 0 -24px;
8102
8102
  vertical-align: middle;
8103
8103
  width: 20px;
8104
8104
  }
@@ -8852,6 +8852,7 @@ ejs-sidebar {
8852
8852
  line-height: 30px;
8853
8853
  margin-right: 8px;
8854
8854
  text-align: center;
8855
+ margin-bottom: 4px;
8855
8856
  }
8856
8857
  .e-menu-wrapper ul .e-menu-item .e-caret,
8857
8858
  .e-menu-container ul .e-menu-item .e-caret {
@@ -2845,15 +2845,15 @@
2845
2845
  border: 1px solid #444c54;
2846
2846
  border-radius: 4px;
2847
2847
  }
2848
- .e-accordion .e-active {
2849
- background: #212529;
2850
- }
2851
2848
  .e-accordion .e-acrdn-item {
2852
2849
  border-color: #444c54;
2853
2850
  border-style: solid;
2854
2851
  border-width: 0 0 1px 0;
2855
2852
  border-radius: 0;
2856
2853
  }
2854
+ .e-accordion .e-acrdn-item.e-active {
2855
+ background: #212529;
2856
+ }
2857
2857
  .e-accordion .e-acrdn-item.e-select:last-child {
2858
2858
  border-bottom: 0;
2859
2859
  border-radius: 0;
@@ -3663,14 +3663,6 @@
3663
3663
  .e-contextmenu-container ul .e-menu-item.e-menu-header {
3664
3664
  border-bottom-color: #444c54;
3665
3665
  }
3666
- .e-contextmenu-wrapper ul .e-menu-item .e-caret,
3667
- .e-contextmenu-container ul .e-menu-item .e-caret {
3668
- color: #adb5bd;
3669
- }
3670
- .e-contextmenu-wrapper ul .e-menu-item .e-menu-icon,
3671
- .e-contextmenu-container ul .e-menu-item .e-menu-icon {
3672
- color: #adb5bd;
3673
- }
3674
3666
  .e-contextmenu-wrapper ul .e-menu-item .e-menu-url,
3675
3667
  .e-contextmenu-container ul .e-menu-item .e-menu-url {
3676
3668
  color: #fff;
@@ -3682,14 +3674,6 @@
3682
3674
  outline: 0 solid #444c54;
3683
3675
  outline-offset: 0;
3684
3676
  }
3685
- .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-caret,
3686
- .e-contextmenu-container ul .e-menu-item.e-focused .e-caret {
3687
- color: #adb5bd;
3688
- }
3689
- .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-menu-icon,
3690
- .e-contextmenu-container ul .e-menu-item.e-focused .e-menu-icon {
3691
- color: #adb5bd;
3692
- }
3693
3677
  .e-contextmenu-wrapper ul .e-menu-item.e-selected,
3694
3678
  .e-contextmenu-container ul .e-menu-item.e-selected {
3695
3679
  background-color: #0d6efd;
@@ -3697,14 +3681,6 @@
3697
3681
  outline: 0 solid #0d6efd;
3698
3682
  outline-offset: 0;
3699
3683
  }
3700
- .e-contextmenu-wrapper ul .e-menu-item.e-selected .e-caret,
3701
- .e-contextmenu-container ul .e-menu-item.e-selected .e-caret {
3702
- color: #adb5bd;
3703
- }
3704
- .e-contextmenu-wrapper ul .e-menu-item.e-selected .e-menu-icon,
3705
- .e-contextmenu-container ul .e-menu-item.e-selected .e-menu-icon {
3706
- color: #adb5bd;
3707
- }
3708
3684
  .e-contextmenu-wrapper ul .e-disabled,
3709
3685
  .e-contextmenu-container ul .e-disabled {
3710
3686
  color: rgba(255, 255, 255, 0.65);
@@ -8212,7 +8188,7 @@
8212
8188
  .e-treeview .e-icon-expandable {
8213
8189
  display: inline-block;
8214
8190
  height: 20px;
8215
- margin: 0 2px 0 -25px;
8191
+ margin: 0 4px 0 -25px;
8216
8192
  vertical-align: middle;
8217
8193
  width: 20px;
8218
8194
  }
@@ -8956,6 +8932,7 @@ ejs-sidebar {
8956
8932
  line-height: 32px;
8957
8933
  margin-right: 8px;
8958
8934
  text-align: center;
8935
+ margin-bottom: 4px;
8959
8936
  }
8960
8937
  .e-menu-wrapper ul .e-menu-item .e-caret,
8961
8938
  .e-menu-container ul .e-menu-item .e-caret {
@@ -9683,14 +9660,6 @@ ejs-sidebar {
9683
9660
  .e-menu-container .e-menu .e-menu-item.e-menu-header {
9684
9661
  border-bottom-color: #444c54;
9685
9662
  }
9686
- .e-menu-wrapper .e-menu .e-menu-item .e-caret,
9687
- .e-menu-container .e-menu .e-menu-item .e-caret {
9688
- color: #adb5bd;
9689
- }
9690
- .e-menu-wrapper .e-menu .e-menu-item .e-menu-icon,
9691
- .e-menu-container .e-menu .e-menu-item .e-menu-icon {
9692
- color: #adb5bd;
9693
- }
9694
9663
  .e-menu-wrapper .e-menu .e-menu-item.e-menu-header,
9695
9664
  .e-menu-container .e-menu .e-menu-item.e-menu-header {
9696
9665
  border-bottom-color: #444c54;
@@ -9706,14 +9675,6 @@ ejs-sidebar {
9706
9675
  outline-offset: 0;
9707
9676
  background-color: #495057;
9708
9677
  }
9709
- .e-menu-wrapper .e-menu .e-menu-item.e-focused .e-caret,
9710
- .e-menu-container .e-menu .e-menu-item.e-focused .e-caret {
9711
- color: #adb5bd;
9712
- }
9713
- .e-menu-wrapper .e-menu .e-menu-item.e-focused .e-menu-icon,
9714
- .e-menu-container .e-menu .e-menu-item.e-focused .e-menu-icon {
9715
- color: #adb5bd;
9716
- }
9717
9678
  .e-menu-wrapper .e-menu .e-menu-item.e-selected,
9718
9679
  .e-menu-container .e-menu .e-menu-item.e-selected {
9719
9680
  color: #fff;
@@ -2845,15 +2845,15 @@
2845
2845
  border: 1px solid #dee2e6;
2846
2846
  border-radius: 4px;
2847
2847
  }
2848
- .e-accordion .e-active {
2849
- background: #fff;
2850
- }
2851
2848
  .e-accordion .e-acrdn-item {
2852
2849
  border-color: #dee2e6;
2853
2850
  border-style: solid;
2854
2851
  border-width: 0 0 1px 0;
2855
2852
  border-radius: 0;
2856
2853
  }
2854
+ .e-accordion .e-acrdn-item.e-active {
2855
+ background: #fff;
2856
+ }
2857
2857
  .e-accordion .e-acrdn-item.e-select:last-child {
2858
2858
  border-bottom: 0;
2859
2859
  border-radius: 0;
@@ -3663,14 +3663,6 @@
3663
3663
  .e-contextmenu-container ul .e-menu-item.e-menu-header {
3664
3664
  border-bottom-color: #dee2e6;
3665
3665
  }
3666
- .e-contextmenu-wrapper ul .e-menu-item .e-caret,
3667
- .e-contextmenu-container ul .e-menu-item .e-caret {
3668
- color: #6c757d;
3669
- }
3670
- .e-contextmenu-wrapper ul .e-menu-item .e-menu-icon,
3671
- .e-contextmenu-container ul .e-menu-item .e-menu-icon {
3672
- color: #6c757d;
3673
- }
3674
3666
  .e-contextmenu-wrapper ul .e-menu-item .e-menu-url,
3675
3667
  .e-contextmenu-container ul .e-menu-item .e-menu-url {
3676
3668
  color: #212529;
@@ -3682,14 +3674,6 @@
3682
3674
  outline: 0 solid #dee2e6;
3683
3675
  outline-offset: 0;
3684
3676
  }
3685
- .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-caret,
3686
- .e-contextmenu-container ul .e-menu-item.e-focused .e-caret {
3687
- color: #6c757d;
3688
- }
3689
- .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-menu-icon,
3690
- .e-contextmenu-container ul .e-menu-item.e-focused .e-menu-icon {
3691
- color: #6c757d;
3692
- }
3693
3677
  .e-contextmenu-wrapper ul .e-menu-item.e-selected,
3694
3678
  .e-contextmenu-container ul .e-menu-item.e-selected {
3695
3679
  background-color: #0d6efd;
@@ -3697,14 +3681,6 @@
3697
3681
  outline: 0 solid #0d6efd;
3698
3682
  outline-offset: 0;
3699
3683
  }
3700
- .e-contextmenu-wrapper ul .e-menu-item.e-selected .e-caret,
3701
- .e-contextmenu-container ul .e-menu-item.e-selected .e-caret {
3702
- color: #6c757d;
3703
- }
3704
- .e-contextmenu-wrapper ul .e-menu-item.e-selected .e-menu-icon,
3705
- .e-contextmenu-container ul .e-menu-item.e-selected .e-menu-icon {
3706
- color: #6c757d;
3707
- }
3708
3684
  .e-contextmenu-wrapper ul .e-disabled,
3709
3685
  .e-contextmenu-container ul .e-disabled {
3710
3686
  color: rgba(33, 37, 41, 0.65);
@@ -8212,7 +8188,7 @@
8212
8188
  .e-treeview .e-icon-expandable {
8213
8189
  display: inline-block;
8214
8190
  height: 20px;
8215
- margin: 0 2px 0 -25px;
8191
+ margin: 0 4px 0 -25px;
8216
8192
  vertical-align: middle;
8217
8193
  width: 20px;
8218
8194
  }
@@ -8956,6 +8932,7 @@ ejs-sidebar {
8956
8932
  line-height: 32px;
8957
8933
  margin-right: 8px;
8958
8934
  text-align: center;
8935
+ margin-bottom: 4px;
8959
8936
  }
8960
8937
  .e-menu-wrapper ul .e-menu-item .e-caret,
8961
8938
  .e-menu-container ul .e-menu-item .e-caret {
@@ -9683,14 +9660,6 @@ ejs-sidebar {
9683
9660
  .e-menu-container .e-menu .e-menu-item.e-menu-header {
9684
9661
  border-bottom-color: #dee2e6;
9685
9662
  }
9686
- .e-menu-wrapper .e-menu .e-menu-item .e-caret,
9687
- .e-menu-container .e-menu .e-menu-item .e-caret {
9688
- color: #6c757d;
9689
- }
9690
- .e-menu-wrapper .e-menu .e-menu-item .e-menu-icon,
9691
- .e-menu-container .e-menu .e-menu-item .e-menu-icon {
9692
- color: #6c757d;
9693
- }
9694
9663
  .e-menu-wrapper .e-menu .e-menu-item.e-menu-header,
9695
9664
  .e-menu-container .e-menu .e-menu-item.e-menu-header {
9696
9665
  border-bottom-color: #dee2e6;
@@ -9706,14 +9675,6 @@ ejs-sidebar {
9706
9675
  outline-offset: 0;
9707
9676
  background-color: #dee2e6;
9708
9677
  }
9709
- .e-menu-wrapper .e-menu .e-menu-item.e-focused .e-caret,
9710
- .e-menu-container .e-menu .e-menu-item.e-focused .e-caret {
9711
- color: #6c757d;
9712
- }
9713
- .e-menu-wrapper .e-menu .e-menu-item.e-focused .e-menu-icon,
9714
- .e-menu-container .e-menu .e-menu-item.e-focused .e-menu-icon {
9715
- color: #6c757d;
9716
- }
9717
9678
  .e-menu-wrapper .e-menu .e-menu-item.e-selected,
9718
9679
  .e-menu-container .e-menu .e-menu-item.e-selected {
9719
9680
  color: #212529;
@@ -119,7 +119,9 @@
119
119
  }
120
120
 
121
121
  &.e-menu-caret-icon {
122
- padding-left: $cmenu-caret-li-padding;
122
+ @if $skin-name != 'FluentUI' {
123
+ padding-left: $cmenu-caret-li-padding;
124
+ }
123
125
  padding-right: $cmenu-li-right-padding;
124
126
  }
125
127
 
@@ -142,6 +142,8 @@
142
142
  .e-bigger.e-contextmenu-wrapper.e-rtl ul .e-blankicon,
143
143
  .e-bigger .e-contextmenu-container.e-rtl ul .e-blankicon,
144
144
  .e-bigger.e-contextmenu-container.e-rtl ul .e-blankicon {
145
- @include bigger-rtl-blank-icon;
145
+ @if $skin-name != 'FluentUI' {
146
+ @include bigger-rtl-blank-icon;
147
+ }
146
148
  }
147
149
  }
@@ -1,20 +1,24 @@
1
1
  @mixin focused-icon-color {
2
- & .e-caret {
3
- color: $cmenu-caret-color;
4
- }
5
-
6
- & .e-menu-icon {
7
- color: $cmenu-icon-color;
2
+ @if $skin-name != 'bootstrap5' {
3
+ & .e-caret {
4
+ color: $cmenu-caret-color;
5
+ }
6
+
7
+ & .e-menu-icon {
8
+ color: $cmenu-icon-color;
9
+ }
8
10
  }
9
11
  }
10
12
 
11
13
  @mixin selected-icon-color {
12
- & .e-caret {
13
- color: $cmenu-caret-hover-color;
14
- }
15
-
16
- & .e-menu-icon {
17
- color: $cmenu-hover-icon-color;
14
+ @if $skin-name != 'bootstrap5' {
15
+ & .e-caret {
16
+ color: $cmenu-caret-hover-color;
17
+ }
18
+
19
+ & .e-menu-icon {
20
+ color: $cmenu-hover-icon-color;
21
+ }
18
22
  }
19
23
  }
20
24
 
@@ -304,14 +304,6 @@
304
304
  .e-contextmenu-container ul .e-menu-item.e-menu-header {
305
305
  border-bottom-color: #444c54;
306
306
  }
307
- .e-contextmenu-wrapper ul .e-menu-item .e-caret,
308
- .e-contextmenu-container ul .e-menu-item .e-caret {
309
- color: #adb5bd;
310
- }
311
- .e-contextmenu-wrapper ul .e-menu-item .e-menu-icon,
312
- .e-contextmenu-container ul .e-menu-item .e-menu-icon {
313
- color: #adb5bd;
314
- }
315
307
  .e-contextmenu-wrapper ul .e-menu-item .e-menu-url,
316
308
  .e-contextmenu-container ul .e-menu-item .e-menu-url {
317
309
  color: #fff;
@@ -323,14 +315,6 @@
323
315
  outline: 0 solid #444c54;
324
316
  outline-offset: 0;
325
317
  }
326
- .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-caret,
327
- .e-contextmenu-container ul .e-menu-item.e-focused .e-caret {
328
- color: #adb5bd;
329
- }
330
- .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-menu-icon,
331
- .e-contextmenu-container ul .e-menu-item.e-focused .e-menu-icon {
332
- color: #adb5bd;
333
- }
334
318
  .e-contextmenu-wrapper ul .e-menu-item.e-selected,
335
319
  .e-contextmenu-container ul .e-menu-item.e-selected {
336
320
  background-color: #0d6efd;
@@ -338,14 +322,6 @@
338
322
  outline: 0 solid #0d6efd;
339
323
  outline-offset: 0;
340
324
  }
341
- .e-contextmenu-wrapper ul .e-menu-item.e-selected .e-caret,
342
- .e-contextmenu-container ul .e-menu-item.e-selected .e-caret {
343
- color: #adb5bd;
344
- }
345
- .e-contextmenu-wrapper ul .e-menu-item.e-selected .e-menu-icon,
346
- .e-contextmenu-container ul .e-menu-item.e-selected .e-menu-icon {
347
- color: #adb5bd;
348
- }
349
325
  .e-contextmenu-wrapper ul .e-disabled,
350
326
  .e-contextmenu-container ul .e-disabled {
351
327
  color: rgba(255, 255, 255, 0.65);
@@ -304,14 +304,6 @@
304
304
  .e-contextmenu-container ul .e-menu-item.e-menu-header {
305
305
  border-bottom-color: #dee2e6;
306
306
  }
307
- .e-contextmenu-wrapper ul .e-menu-item .e-caret,
308
- .e-contextmenu-container ul .e-menu-item .e-caret {
309
- color: #6c757d;
310
- }
311
- .e-contextmenu-wrapper ul .e-menu-item .e-menu-icon,
312
- .e-contextmenu-container ul .e-menu-item .e-menu-icon {
313
- color: #6c757d;
314
- }
315
307
  .e-contextmenu-wrapper ul .e-menu-item .e-menu-url,
316
308
  .e-contextmenu-container ul .e-menu-item .e-menu-url {
317
309
  color: #212529;
@@ -323,14 +315,6 @@
323
315
  outline: 0 solid #dee2e6;
324
316
  outline-offset: 0;
325
317
  }
326
- .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-caret,
327
- .e-contextmenu-container ul .e-menu-item.e-focused .e-caret {
328
- color: #6c757d;
329
- }
330
- .e-contextmenu-wrapper ul .e-menu-item.e-focused .e-menu-icon,
331
- .e-contextmenu-container ul .e-menu-item.e-focused .e-menu-icon {
332
- color: #6c757d;
333
- }
334
318
  .e-contextmenu-wrapper ul .e-menu-item.e-selected,
335
319
  .e-contextmenu-container ul .e-menu-item.e-selected {
336
320
  background-color: #0d6efd;
@@ -338,14 +322,6 @@
338
322
  outline: 0 solid #0d6efd;
339
323
  outline-offset: 0;
340
324
  }
341
- .e-contextmenu-wrapper ul .e-menu-item.e-selected .e-caret,
342
- .e-contextmenu-container ul .e-menu-item.e-selected .e-caret {
343
- color: #6c757d;
344
- }
345
- .e-contextmenu-wrapper ul .e-menu-item.e-selected .e-menu-icon,
346
- .e-contextmenu-container ul .e-menu-item.e-selected .e-menu-icon {
347
- color: #6c757d;
348
- }
349
325
  .e-contextmenu-wrapper ul .e-disabled,
350
326
  .e-contextmenu-container ul .e-disabled {
351
327
  color: rgba(33, 37, 41, 0.65);
@@ -222,7 +222,6 @@
222
222
  }
223
223
  .e-rtl.e-contextmenu-wrapper .e-menu-item.e-menu-caret-icon,
224
224
  .e-rtl.e-contextmenu-container .e-menu-item.e-menu-caret-icon {
225
- padding-left: 24px;
226
225
  padding-right: 12px;
227
226
  }
228
227
  .e-rtl.e-contextmenu-wrapper .e-menu-item.e-blankicon,
@@ -279,19 +278,6 @@
279
278
  font-size: 18px;
280
279
  }
281
280
 
282
- .e-bigger .e-contextmenu-wrapper.e-rtl ul .e-blankicon,
283
- .e-bigger.e-contextmenu-wrapper.e-rtl ul .e-blankicon,
284
- .e-bigger .e-contextmenu-container.e-rtl ul .e-blankicon,
285
- .e-bigger.e-contextmenu-container.e-rtl ul .e-blankicon {
286
- padding-left: 16px;
287
- }
288
- .e-bigger .e-contextmenu-wrapper.e-rtl ul .e-blankicon.e-menu-caret-icon,
289
- .e-bigger.e-contextmenu-wrapper.e-rtl ul .e-blankicon.e-menu-caret-icon,
290
- .e-bigger .e-contextmenu-container.e-rtl ul .e-blankicon.e-menu-caret-icon,
291
- .e-bigger.e-contextmenu-container.e-rtl ul .e-blankicon.e-menu-caret-icon {
292
- padding-left: 24px;
293
- }
294
-
295
281
  /*! contextmenu theme */
296
282
  .e-contextmenu-wrapper ul,
297
283
  .e-contextmenu-container ul {
@@ -222,7 +222,6 @@
222
222
  }
223
223
  .e-rtl.e-contextmenu-wrapper .e-menu-item.e-menu-caret-icon,
224
224
  .e-rtl.e-contextmenu-container .e-menu-item.e-menu-caret-icon {
225
- padding-left: 24px;
226
225
  padding-right: 12px;
227
226
  }
228
227
  .e-rtl.e-contextmenu-wrapper .e-menu-item.e-blankicon,
@@ -279,19 +278,6 @@
279
278
  font-size: 18px;
280
279
  }
281
280
 
282
- .e-bigger .e-contextmenu-wrapper.e-rtl ul .e-blankicon,
283
- .e-bigger.e-contextmenu-wrapper.e-rtl ul .e-blankicon,
284
- .e-bigger .e-contextmenu-container.e-rtl ul .e-blankicon,
285
- .e-bigger.e-contextmenu-container.e-rtl ul .e-blankicon {
286
- padding-left: 16px;
287
- }
288
- .e-bigger .e-contextmenu-wrapper.e-rtl ul .e-blankicon.e-menu-caret-icon,
289
- .e-bigger.e-contextmenu-wrapper.e-rtl ul .e-blankicon.e-menu-caret-icon,
290
- .e-bigger .e-contextmenu-container.e-rtl ul .e-blankicon.e-menu-caret-icon,
291
- .e-bigger.e-contextmenu-container.e-rtl ul .e-blankicon.e-menu-caret-icon {
292
- padding-left: 24px;
293
- }
294
-
295
281
  /*! contextmenu theme */
296
282
  .e-contextmenu-wrapper ul,
297
283
  .e-contextmenu-container ul {