@syncfusion/ej2-navigations 33.2.15 → 34.1.29

package/styles/menu/fabric-dark.css

@@ -84,10 +84,6 @@
      -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
-  font-size: 13px;
-  padding: 0;
-  text-align: left;
-  white-space: nowrap;
 }
 .e-menu-wrapper ul.e-ul, .e-menu-wrapper ul.e-ul *,
 .e-menu-container ul.e-ul,
@@ -100,6 +96,13 @@
 .e-menu-container ul.e-ul *:focus {
   outline: none;
 }
+.e-menu-wrapper ul,
+.e-menu-container ul {
+  font-size: 13px;
+  padding: 0;
+  text-align: left;
+  white-space: nowrap;
+}
 .e-menu-wrapper ul.e-vertical,
 .e-menu-container ul.e-vertical {
   min-width: 120px;
@@ -136,14 +139,6 @@
 .e-menu-container ul .e-menu-item {
   cursor: pointer;
   position: relative;
-  display: -webkit-inline-box;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  height: 42px;
-  line-height: 42px;
-  padding: 0 8px;
-  vertical-align: top;
-  white-space: nowrap;
 }
 .e-menu-wrapper ul .e-menu-item.e-menu-hide,
 .e-menu-container ul .e-menu-item.e-menu-hide {
@@ -171,6 +166,17 @@
   line-height: normal;
   pointer-events: none;
 }
+.e-menu-wrapper ul .e-menu-item,
+.e-menu-container ul .e-menu-item {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  height: 42px;
+  line-height: 42px;
+  padding: 0 8px;
+  vertical-align: top;
+  white-space: nowrap;
+}
 .e-menu-wrapper ul .e-menu-item .e-menu-icon,
 .e-menu-container ul .e-menu-item .e-menu-icon {
   font-size: 14px;
@@ -212,7 +218,6 @@
   height: 36px;
   line-height: 36px;
   padding: 0 10px;
-  display: list-item;
 }
 .e-menu-wrapper .e-ul .e-menu-item .e-menu-url,
 .e-menu-container .e-ul .e-menu-item .e-menu-url {
@@ -245,6 +250,10 @@
   height: auto;
   margin: 0;
 }
+.e-menu-wrapper .e-ul .e-menu-item,
+.e-menu-container .e-ul .e-menu-item {
+  display: list-item;
+}
 .e-menu-wrapper .e-ul .e-menu-item .e-caret,
 .e-menu-container .e-ul .e-menu-item .e-caret {
   font-size: 12px;
@@ -390,10 +399,6 @@
   padding-left: 30px;
 }
 
-.e-rtl.e-menu-wrapper ul .e-menu-item,
-.e-rtl.e-menu-container ul .e-menu-item {
-  text-align: right;
-}
 .e-rtl.e-menu-wrapper ul .e-menu-item .e-menu-icon,
 .e-rtl.e-menu-container ul .e-menu-item .e-menu-icon {
   margin-right: 0;
@@ -404,6 +409,10 @@
   margin-right: 16px;
   right: auto;
 }
+.e-rtl.e-menu-wrapper ul .e-menu-item,
+.e-rtl.e-menu-container ul .e-menu-item {
+  text-align: right;
+}
 .e-rtl.e-menu-wrapper ul .e-menu-item .e-menu-icon,
 .e-rtl.e-menu-container ul .e-menu-item .e-menu-icon {
   margin-left: 8px;
@@ -469,8 +478,6 @@
   border: 1px solid #414040;
   overflow-y: auto;
   width: 100%;
-  /* stylelint-disable */
-  /* stylelint-enable */
 }
 .e-menu-wrapper.e-hamburger ul.e-menu.e-menu-parent.e-hide-menu,
 .e-menu-container.e-hamburger ul.e-menu.e-menu-parent.e-hide-menu {
@@ -493,6 +500,10 @@
 .e-menu-container.e-hamburger ul.e-menu .e-menu-item.e-menu-hide {
   display: none;
 }
+.e-menu-wrapper.e-hamburger ul.e-menu,
+.e-menu-container.e-hamburger ul.e-menu {
+  /* stylelint-disable */
+}
 .e-menu-wrapper.e-hamburger ul.e-menu .e-menu-item[aria-expanded=true] .e-caret,
 .e-menu-container.e-hamburger ul.e-menu .e-menu-item[aria-expanded=true] .e-caret {
   -webkit-transition: -webkit-transform 0.3s ease-in-out;
@@ -513,6 +524,10 @@
   transform: rotate(0deg);
   text-indent: 0;
 }
+.e-menu-wrapper.e-hamburger ul.e-menu,
+.e-menu-container.e-hamburger ul.e-menu {
+  /* stylelint-enable */
+}
 .e-menu-wrapper.e-hamburger ul.e-menu:not(.e-vertical),
 .e-menu-container.e-hamburger ul.e-menu:not(.e-vertical) {
   border-top: 0;
@@ -623,7 +638,6 @@
   color: inherit;
   outline: 0 solid #414040;
   outline-offset: 0;
-  background: #414040;
 }
 .e-menu-wrapper .e-menu .e-menu-item.e-focused .e-caret,
 .e-menu-container .e-menu .e-menu-item.e-focused .e-caret {
@@ -633,6 +647,10 @@
 .e-menu-container .e-menu .e-menu-item.e-focused .e-menu-icon {
   color: #dadada;
 }
+.e-menu-wrapper .e-menu .e-menu-item.e-focused,
+.e-menu-container .e-menu .e-menu-item.e-focused {
+  background: #414040;
+}
 .e-menu-wrapper .e-menu .e-menu-item.e-selected, .e-menu-wrapper .e-menu .e-menu-item.e-active-item,
 .e-menu-container .e-menu .e-menu-item.e-selected,
 .e-menu-container .e-menu .e-menu-item.e-active-item {
@@ -846,7 +864,6 @@
 .e-bigger.e-menu-container ul.e-ul .e-menu-item {
   height: 48px;
   line-height: 48px;
-  padding: 0 10px;
 }
 .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item .e-menu-icon,
 .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item .e-menu-icon,
@@ -868,6 +885,12 @@
   height: auto;
   line-height: normal;
 }
+.e-bigger .e-menu-wrapper ul.e-ul .e-menu-item,
+.e-bigger.e-menu-wrapper ul.e-ul .e-menu-item,
+.e-bigger .e-menu-container ul.e-ul .e-menu-item,
+.e-bigger.e-menu-container ul.e-ul .e-menu-item {
+  padding: 0 10px;
+}
 .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
 .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
 .e-bigger .e-menu-container ul.e-ul .e-menu-item .e-caret,

package/styles/menu/fabric-dark.scss

@@ -1,9 +1,4 @@
-@use 'ej2-base/styles/definition/fabric-dark' as *;
-@use '../context-menu/fabric-dark-definition' as *;
-@use '../h-scroll/fabric-dark-definition' as *;
-@use '../v-scroll/fabric-dark-definition' as *;
-@use 'ej2-popups/styles/popup/fabric-dark-definition' as *;
 @use 'fabric-dark-definition' as *;
 @use 'icons/fabric-dark' as *;
-@use 'all.fabric-dark' as *;
-@use 'bigger.fabric-dark' as *;
+@use 'all' as *;
+@use 'bigger' as *;

package/styles/menu/fabric.css

@@ -1,4 +1,3 @@
-/*! component's theme wise override definitions and variables */
 .e-menu-wrapper ul.e-vertical .e-menu-item .e-caret::before,
 .e-menu-container ul.e-vertical .e-menu-item .e-caret::before {
   content: "\e219";
@@ -85,10 +84,6 @@
      -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
-  font-size: 13px;
-  padding: 0;
-  text-align: left;
-  white-space: nowrap;
 }
 .e-menu-wrapper ul.e-ul, .e-menu-wrapper ul.e-ul *,
 .e-menu-container ul.e-ul,
@@ -101,6 +96,13 @@
 .e-menu-container ul.e-ul *:focus {
   outline: none;
 }
+.e-menu-wrapper ul,
+.e-menu-container ul {
+  font-size: 13px;
+  padding: 0;
+  text-align: left;
+  white-space: nowrap;
+}
 .e-menu-wrapper ul.e-vertical,
 .e-menu-container ul.e-vertical {
   min-width: 120px;
@@ -137,14 +139,6 @@
 .e-menu-container ul .e-menu-item {
   cursor: pointer;
   position: relative;
-  display: -webkit-inline-box;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  height: 42px;
-  line-height: 42px;
-  padding: 0 8px;
-  vertical-align: top;
-  white-space: nowrap;
 }
 .e-menu-wrapper ul .e-menu-item.e-menu-hide,
 .e-menu-container ul .e-menu-item.e-menu-hide {
@@ -172,6 +166,17 @@
   line-height: normal;
   pointer-events: none;
 }
+.e-menu-wrapper ul .e-menu-item,
+.e-menu-container ul .e-menu-item {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  height: 42px;
+  line-height: 42px;
+  padding: 0 8px;
+  vertical-align: top;
+  white-space: nowrap;
+}
 .e-menu-wrapper ul .e-menu-item .e-menu-icon,
 .e-menu-container ul .e-menu-item .e-menu-icon {
   font-size: 14px;
@@ -213,7 +218,6 @@
   height: 36px;
   line-height: 36px;
   padding: 0 10px;
-  display: list-item;
 }
 .e-menu-wrapper .e-ul .e-menu-item .e-menu-url,
 .e-menu-container .e-ul .e-menu-item .e-menu-url {
@@ -246,6 +250,10 @@
   height: auto;
   margin: 0;
 }
+.e-menu-wrapper .e-ul .e-menu-item,
+.e-menu-container .e-ul .e-menu-item {
+  display: list-item;
+}
 .e-menu-wrapper .e-ul .e-menu-item .e-caret,
 .e-menu-container .e-ul .e-menu-item .e-caret {
   font-size: 12px;
@@ -391,10 +399,6 @@
   padding-left: 30px;
 }
 
-.e-rtl.e-menu-wrapper ul .e-menu-item,
-.e-rtl.e-menu-container ul .e-menu-item {
-  text-align: right;
-}
 .e-rtl.e-menu-wrapper ul .e-menu-item .e-menu-icon,
 .e-rtl.e-menu-container ul .e-menu-item .e-menu-icon {
   margin-right: 0;
@@ -405,6 +409,10 @@
   margin-right: 16px;
   right: auto;
 }
+.e-rtl.e-menu-wrapper ul .e-menu-item,
+.e-rtl.e-menu-container ul .e-menu-item {
+  text-align: right;
+}
 .e-rtl.e-menu-wrapper ul .e-menu-item .e-menu-icon,
 .e-rtl.e-menu-container ul .e-menu-item .e-menu-icon {
   margin-left: 8px;
@@ -470,8 +478,6 @@
   border: none;
   overflow-y: auto;
   width: 100%;
-  /* stylelint-disable */
-  /* stylelint-enable */
 }
 .e-menu-wrapper.e-hamburger ul.e-menu.e-menu-parent.e-hide-menu,
 .e-menu-container.e-hamburger ul.e-menu.e-menu-parent.e-hide-menu {
@@ -494,6 +500,10 @@
 .e-menu-container.e-hamburger ul.e-menu .e-menu-item.e-menu-hide {
   display: none;
 }
+.e-menu-wrapper.e-hamburger ul.e-menu,
+.e-menu-container.e-hamburger ul.e-menu {
+  /* stylelint-disable */
+}
 .e-menu-wrapper.e-hamburger ul.e-menu .e-menu-item[aria-expanded=true] .e-caret,
 .e-menu-container.e-hamburger ul.e-menu .e-menu-item[aria-expanded=true] .e-caret {
   -webkit-transition: -webkit-transform 0.3s ease-in-out;
@@ -514,6 +524,10 @@
   transform: rotate(0deg);
   text-indent: 0;
 }
+.e-menu-wrapper.e-hamburger ul.e-menu,
+.e-menu-container.e-hamburger ul.e-menu {
+  /* stylelint-enable */
+}
 .e-menu-wrapper.e-hamburger ul.e-menu:not(.e-vertical),
 .e-menu-container.e-hamburger ul.e-menu:not(.e-vertical) {
   border-top: 0;
@@ -624,7 +638,6 @@
   color: inherit;
   outline: 0 solid #eaeaea;
   outline-offset: 0;
-  background: #eaeaea;
 }
 .e-menu-wrapper .e-menu .e-menu-item.e-focused .e-caret,
 .e-menu-container .e-menu .e-menu-item.e-focused .e-caret {
@@ -634,6 +647,10 @@
 .e-menu-container .e-menu .e-menu-item.e-focused .e-menu-icon {
   color: #333;
 }
+.e-menu-wrapper .e-menu .e-menu-item.e-focused,
+.e-menu-container .e-menu .e-menu-item.e-focused {
+  background: #eaeaea;
+}
 .e-menu-wrapper .e-menu .e-menu-item.e-selected, .e-menu-wrapper .e-menu .e-menu-item.e-active-item,
 .e-menu-container .e-menu .e-menu-item.e-selected,
 .e-menu-container .e-menu .e-menu-item.e-active-item {
@@ -847,7 +864,6 @@
 .e-bigger.e-menu-container ul.e-ul .e-menu-item {
   height: 48px;
   line-height: 48px;
-  padding: 0 10px;
 }
 .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item .e-menu-icon,
 .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item .e-menu-icon,
@@ -869,6 +885,12 @@
   height: auto;
   line-height: normal;
 }
+.e-bigger .e-menu-wrapper ul.e-ul .e-menu-item,
+.e-bigger.e-menu-wrapper ul.e-ul .e-menu-item,
+.e-bigger .e-menu-container ul.e-ul .e-menu-item,
+.e-bigger.e-menu-container ul.e-ul .e-menu-item {
+  padding: 0 10px;
+}
 .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
 .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
 .e-bigger .e-menu-container ul.e-ul .e-menu-item .e-caret,

package/styles/menu/fabric.scss

@@ -1,9 +1,4 @@
-@use 'ej2-base/styles/definition/fabric' as *;
-@use '../context-menu/fabric-definition' as *;
-@use '../h-scroll/fabric-definition' as *;
-@use '../v-scroll/fabric-definition' as *;
-@use 'ej2-popups/styles/popup/fabric-definition' as *;
 @use 'fabric-definition' as *;
 @use 'icons/fabric' as *;
-@use 'all.fabric' as *;
-@use 'bigger.fabric' as *;
+@use 'all' as *;
+@use 'bigger' as *;

package/styles/menu/fluent-dark.css

@@ -1,28 +1,3 @@
-/*! component's theme wise override definitions and variables */
-@-webkit-keyframes hscroll-popup-shadow {
-  0% {
-    border-color: rgba(255, 255, 255, 0.5);
-    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);
-            box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);
-  }
-  100% {
-    -webkit-box-shadow: 0 0 0 200px rgba(255, 255, 255, 0.12);
-            box-shadow: 0 0 0 200px rgba(255, 255, 255, 0.12);
-  }
-}
-@keyframes hscroll-popup-shadow {
-  0% {
-    border-color: rgba(255, 255, 255, 0.5);
-    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);
-            box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);
-  }
-  100% {
-    -webkit-box-shadow: 0 0 0 200px rgba(255, 255, 255, 0.12);
-            box-shadow: 0 0 0 200px rgba(255, 255, 255, 0.12);
-  }
-}
-/*! component's theme wise override definitions and variables */
-/* stylelint-disable-line no-empty-source */
 .e-menu-wrapper ul.e-vertical .e-menu-item .e-caret::before,
 .e-menu-container ul.e-vertical .e-menu-item .e-caret::before {
   content: "\e748";
@@ -109,10 +84,6 @@
      -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
-  font-size: 14px;
-  padding: 0;
-  text-align: left;
-  white-space: nowrap;
 }
 .e-menu-wrapper ul.e-ul, .e-menu-wrapper ul.e-ul *,
 .e-menu-container ul.e-ul,
@@ -125,6 +96,13 @@
 .e-menu-container ul.e-ul *:focus {
   outline: none;
 }
+.e-menu-wrapper ul,
+.e-menu-container ul {
+  font-size: 14px;
+  padding: 0;
+  text-align: left;
+  white-space: nowrap;
+}
 .e-menu-wrapper ul.e-vertical,
 .e-menu-container ul.e-vertical {
   min-width: 120px;
@@ -161,14 +139,6 @@
 .e-menu-container ul .e-menu-item {
   cursor: pointer;
   position: relative;
-  display: -webkit-inline-box;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  height: 40px;
-  line-height: 40px;
-  padding: 0 8px;
-  vertical-align: top;
-  white-space: nowrap;
 }
 .e-menu-wrapper ul .e-menu-item.e-menu-hide,
 .e-menu-container ul .e-menu-item.e-menu-hide {
@@ -196,6 +166,17 @@
   line-height: normal;
   pointer-events: none;
 }
+.e-menu-wrapper ul .e-menu-item,
+.e-menu-container ul .e-menu-item {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  height: 40px;
+  line-height: 40px;
+  padding: 0 8px;
+  vertical-align: top;
+  white-space: nowrap;
+}
 .e-menu-wrapper ul .e-menu-item .e-menu-icon,
 .e-menu-container ul .e-menu-item .e-menu-icon {
   font-size: 14px;
@@ -237,7 +218,6 @@
   height: 36px;
   line-height: 36px;
   padding: 0 8px;
-  display: list-item;
 }
 .e-menu-wrapper .e-ul .e-menu-item .e-menu-url,
 .e-menu-container .e-ul .e-menu-item .e-menu-url {
@@ -270,6 +250,10 @@
   height: auto;
   margin: 4px 0;
 }
+.e-menu-wrapper .e-ul .e-menu-item,
+.e-menu-container .e-ul .e-menu-item {
+  display: list-item;
+}
 .e-menu-wrapper .e-ul .e-menu-item .e-caret,
 .e-menu-container .e-ul .e-menu-item .e-caret {
   font-size: 14px;
@@ -415,10 +399,6 @@
   padding-left: 34px;
 }
 
-.e-rtl.e-menu-wrapper ul .e-menu-item,
-.e-rtl.e-menu-container ul .e-menu-item {
-  text-align: right;
-}
 .e-rtl.e-menu-wrapper ul .e-menu-item .e-menu-icon,
 .e-rtl.e-menu-container ul .e-menu-item .e-menu-icon {
   margin-right: 0;
@@ -429,6 +409,10 @@
   margin-right: 16px;
   right: auto;
 }
+.e-rtl.e-menu-wrapper ul .e-menu-item,
+.e-rtl.e-menu-container ul .e-menu-item {
+  text-align: right;
+}
 .e-rtl.e-menu-wrapper ul .e-menu-item .e-menu-icon,
 .e-rtl.e-menu-container ul .e-menu-item .e-menu-icon {
   margin-left: 4px;
@@ -493,8 +477,6 @@
   border: none;
   overflow-y: auto;
   width: 100%;
-  /* stylelint-disable */
-  /* stylelint-enable */
 }
 .e-menu-wrapper.e-hamburger ul.e-menu.e-menu-parent.e-hide-menu,
 .e-menu-container.e-hamburger ul.e-menu.e-menu-parent.e-hide-menu {
@@ -517,6 +499,10 @@
 .e-menu-container.e-hamburger ul.e-menu .e-menu-item.e-menu-hide {
   display: none;
 }
+.e-menu-wrapper.e-hamburger ul.e-menu,
+.e-menu-container.e-hamburger ul.e-menu {
+  /* stylelint-disable */
+}
 .e-menu-wrapper.e-hamburger ul.e-menu .e-menu-item[aria-expanded=true] .e-caret,
 .e-menu-container.e-hamburger ul.e-menu .e-menu-item[aria-expanded=true] .e-caret {
   -webkit-transition: -webkit-transform 0.3s ease-in-out;
@@ -537,6 +523,10 @@
   transform: rotate(0deg);
   text-indent: 0;
 }
+.e-menu-wrapper.e-hamburger ul.e-menu,
+.e-menu-container.e-hamburger ul.e-menu {
+  /* stylelint-enable */
+}
 .e-menu-wrapper.e-hamburger ul.e-menu:not(.e-vertical),
 .e-menu-container.e-hamburger ul.e-menu:not(.e-vertical) {
   border-top: 0;
@@ -647,7 +637,6 @@
   color: #f3f2f1;
   outline: 0 solid #292827;
   outline-offset: 0;
-  background: #292827;
 }
 .e-menu-wrapper .e-menu .e-menu-item.e-focused .e-caret,
 .e-menu-container .e-menu .e-menu-item.e-focused .e-caret {
@@ -657,6 +646,10 @@
 .e-menu-container .e-menu .e-menu-item.e-focused .e-menu-icon {
   color: #a19f9d;
 }
+.e-menu-wrapper .e-menu .e-menu-item.e-focused,
+.e-menu-container .e-menu .e-menu-item.e-focused {
+  background: #292827;
+}
 .e-menu-wrapper .e-menu .e-menu-item.e-selected, .e-menu-wrapper .e-menu .e-menu-item.e-active-item,
 .e-menu-container .e-menu .e-menu-item.e-selected,
 .e-menu-container .e-menu .e-menu-item.e-active-item {
@@ -875,7 +868,6 @@
 .e-bigger.e-menu-container ul.e-ul .e-menu-item {
   height: 40px;
   line-height: 40px;
-  padding: 0 8px;
 }
 .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item .e-menu-icon,
 .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item .e-menu-icon,
@@ -897,6 +889,12 @@
   height: auto;
   line-height: normal;
 }
+.e-bigger .e-menu-wrapper ul.e-ul .e-menu-item,
+.e-bigger.e-menu-wrapper ul.e-ul .e-menu-item,
+.e-bigger .e-menu-container ul.e-ul .e-menu-item,
+.e-bigger.e-menu-container ul.e-ul .e-menu-item {
+  padding: 0 8px;
+}
 .e-bigger .e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
 .e-bigger.e-menu-wrapper ul.e-ul .e-menu-item .e-caret,
 .e-bigger .e-menu-container ul.e-ul .e-menu-item .e-caret,

package/styles/menu/fluent-dark.scss

@@ -1,9 +1,4 @@
-@use 'ej2-base/styles/definition/fluent-dark' as *;
-@use '../context-menu/fluent-dark-definition' as *;
-@use '../h-scroll/fluent-dark-definition' as *;
-@use '../v-scroll/fluent-dark-definition' as *;
-@use 'ej2-popups/styles/popup/fluent-dark-definition' as *;
 @use 'fluent-dark-definition' as *;
 @use 'icons/fluent-dark' as *;
-@use 'all.fluent-dark' as *;
-@use 'bigger.fluent-dark' as *;
+@use 'all' as *;
+@use 'bigger' as *;