@syncfusion/ej2-navigations 21.2.8 → 22.1.34

package/styles/tab/material3.scss

@@ -0,0 +1,6 @@
+@import 'ej2-base/styles/material3-definition.scss';
+
+@import '../toolbar/material3-definition.scss';
+@import 'material3-definition.scss';
+@import 'icons/material3.scss';
+@import 'all.scss';

package/styles/tab/tailwind-dark.css

@@ -329,7 +329,7 @@
 }
 .e-bigger .e-tab .e-tab-header .e-toolbar-pop .e-toolbar-item .e-close-icon,
 .e-tab.e-bigger .e-tab-header .e-toolbar-pop .e-toolbar-item .e-close-icon {
-  margin: 0;
+  margin: 0 0 0 8px;
 }
 .e-bigger .e-tab .e-tab-header .e-toolbar-pop .e-toolbar-item .e-close-icon::before,
 .e-tab.e-bigger .e-tab-header .e-toolbar-pop .e-toolbar-item .e-close-icon::before {
@@ -1460,7 +1460,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-tab .e-tab-header .e-toolbar-item.e-itop, .e-tab .e-tab-header .e-toolbar-item.e-ibottom {
-    height: 72px;
+    height: 62px;
   }
 }
 .e-tab .e-tab-header .e-toolbar-item.e-itop .e-tab-wrap, .e-tab .e-tab-header .e-toolbar-item.e-ibottom .e-tab-wrap {
@@ -1473,7 +1473,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-tab .e-tab-header .e-toolbar-item.e-itop .e-tab-wrap, .e-tab .e-tab-header .e-toolbar-item.e-ibottom .e-tab-wrap {
-    height: 72px;
+    height: 62px;
   }
 }
 .e-tab .e-tab-header .e-toolbar-item.e-itop .e-tab-wrap:focus .e-text-wrap, .e-tab .e-tab-header .e-toolbar-item.e-ibottom .e-tab-wrap:focus .e-text-wrap {
@@ -1865,6 +1865,11 @@
   height: 38px;
   padding: 0;
 }
+@media screen and (max-width: 480px) {
+  .e-tab .e-tab-header.e-horizontal-bottom .e-toolbar-item.e-active .e-text-wrap {
+    height: 48px;
+  }
+}
 .e-tab .e-tab-header.e-horizontal-bottom .e-toolbar-item.e-active .e-text-wrap::before, .e-tab .e-tab-header.e-horizontal-bottom .e-toolbar-item.e-active:not(.e-separator):last-child .e-text-wrap::before {
   top: unset;
 }
@@ -2251,6 +2256,10 @@
 .e-tab.e-focused .e-tab-header .e-horizontal-bottom .e-toolbar-item.e-itop.e-active .e-tab-wrap:focus .e-text-wrap, .e-tab.e-focused .e-tab-header .e-horizontal-bottom .e-toolbar-item.e-ibottom.e-active .e-tab-wrap:focus .e-text-wrap {
   height: auto;
 }
+.e-tab.e-template .e-tab-header .e-toolbar-items .e-toolbar-item .e-tab-wrap .e-text-wrap .e-tab-text > div,
+.e-tab.e-template .e-tab-header .e-toolbar-pop .e-toolbar-item .e-tab-wrap .e-text-wrap .e-tab-text > div {
+  display: inherit;
+}
 .e-tab.e-template .e-content > .e-item {
   display: none;
 }
@@ -2793,7 +2802,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-tab-clone-element.e-itop, .e-tab-clone-element.e-ibottom {
-    height: 72px;
+    height: 62px;
   }
 }
 .e-tab-clone-element.e-itop .e-tab-wrap, .e-tab-clone-element.e-ibottom .e-tab-wrap {
@@ -2806,7 +2815,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-tab-clone-element.e-itop .e-tab-wrap, .e-tab-clone-element.e-ibottom .e-tab-wrap {
-    height: 72px;
+    height: 62px;
   }
 }
 .e-tab-clone-element.e-itop .e-tab-wrap:focus .e-text-wrap, .e-tab-clone-element.e-ibottom .e-tab-wrap:focus .e-text-wrap {
@@ -3016,6 +3025,9 @@
 .e-tab .e-tab-header .e-toolbar-item:hover {
   background: inherit;
 }
+.e-tab .e-tab-header .e-toolbar-item.e-active:hover {
+  background: inherit;
+}
 .e-tab .e-tab-header .e-toolbar-item .e-ripple-element {
   background: rgba(0, 0, 0, 0.12);
 }
@@ -3071,8 +3083,8 @@
   content: unset;
   display: unset;
   position: unset;
-  top: unset;
   width: unset;
+  top: unset;
 }
 .e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-text,
 .e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-icon {
@@ -3084,6 +3096,9 @@
 .e-tab .e-tab-header .e-toolbar-item.e-active.e-ileft .e-tab-text, .e-tab .e-tab-header .e-toolbar-item.e-active.e-iright .e-tab-text {
   color: #22d3ee;
 }
+.e-tab .e-tab-header .e-toolbar-item.e-active .e-close-icon {
+  color: #d1d5db;
+}
 .e-tab .e-tab-header .e-toolbar-item .e-close-icon {
   color: #d1d5db;
 }
@@ -3497,6 +3512,10 @@
 .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active {
   border: 0;
 }
+.e-tab.e-fill .e-tab-header .e-toolbar-item.e-active.e-disable.e-overlay .e-tab-text,
+.e-tab.e-fill .e-tab-header .e-toolbar-item.e-active.e-disable.e-overlay .e-tab-icon {
+  color: #6b7280;
+}
 .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
   background: #22d3ee;
   border-radius: 0;
@@ -3657,6 +3676,10 @@
   margin: 0;
   background: inherit;
 }
+.e-tab.e-background .e-tab-header .e-toolbar-item.e-active.e-disable.e-overlay .e-tab-text,
+.e-tab.e-background .e-tab-header .e-toolbar-item.e-active.e-disable.e-overlay .e-tab-icon {
+  color: #6b7280;
+}
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
   background: #22d3ee;
   border-color: unset;

package/styles/tab/tailwind.css

@@ -329,7 +329,7 @@
 }
 .e-bigger .e-tab .e-tab-header .e-toolbar-pop .e-toolbar-item .e-close-icon,
 .e-tab.e-bigger .e-tab-header .e-toolbar-pop .e-toolbar-item .e-close-icon {
-  margin: 0;
+  margin: 0 0 0 8px;
 }
 .e-bigger .e-tab .e-tab-header .e-toolbar-pop .e-toolbar-item .e-close-icon::before,
 .e-tab.e-bigger .e-tab-header .e-toolbar-pop .e-toolbar-item .e-close-icon::before {
@@ -1460,7 +1460,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-tab .e-tab-header .e-toolbar-item.e-itop, .e-tab .e-tab-header .e-toolbar-item.e-ibottom {
-    height: 72px;
+    height: 62px;
   }
 }
 .e-tab .e-tab-header .e-toolbar-item.e-itop .e-tab-wrap, .e-tab .e-tab-header .e-toolbar-item.e-ibottom .e-tab-wrap {
@@ -1473,7 +1473,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-tab .e-tab-header .e-toolbar-item.e-itop .e-tab-wrap, .e-tab .e-tab-header .e-toolbar-item.e-ibottom .e-tab-wrap {
-    height: 72px;
+    height: 62px;
   }
 }
 .e-tab .e-tab-header .e-toolbar-item.e-itop .e-tab-wrap:focus .e-text-wrap, .e-tab .e-tab-header .e-toolbar-item.e-ibottom .e-tab-wrap:focus .e-text-wrap {
@@ -1865,6 +1865,11 @@
   height: 38px;
   padding: 0;
 }
+@media screen and (max-width: 480px) {
+  .e-tab .e-tab-header.e-horizontal-bottom .e-toolbar-item.e-active .e-text-wrap {
+    height: 48px;
+  }
+}
 .e-tab .e-tab-header.e-horizontal-bottom .e-toolbar-item.e-active .e-text-wrap::before, .e-tab .e-tab-header.e-horizontal-bottom .e-toolbar-item.e-active:not(.e-separator):last-child .e-text-wrap::before {
   top: unset;
 }
@@ -2251,6 +2256,10 @@
 .e-tab.e-focused .e-tab-header .e-horizontal-bottom .e-toolbar-item.e-itop.e-active .e-tab-wrap:focus .e-text-wrap, .e-tab.e-focused .e-tab-header .e-horizontal-bottom .e-toolbar-item.e-ibottom.e-active .e-tab-wrap:focus .e-text-wrap {
   height: auto;
 }
+.e-tab.e-template .e-tab-header .e-toolbar-items .e-toolbar-item .e-tab-wrap .e-text-wrap .e-tab-text > div,
+.e-tab.e-template .e-tab-header .e-toolbar-pop .e-toolbar-item .e-tab-wrap .e-text-wrap .e-tab-text > div {
+  display: inherit;
+}
 .e-tab.e-template .e-content > .e-item {
   display: none;
 }
@@ -2793,7 +2802,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-tab-clone-element.e-itop, .e-tab-clone-element.e-ibottom {
-    height: 72px;
+    height: 62px;
   }
 }
 .e-tab-clone-element.e-itop .e-tab-wrap, .e-tab-clone-element.e-ibottom .e-tab-wrap {
@@ -2806,7 +2815,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-tab-clone-element.e-itop .e-tab-wrap, .e-tab-clone-element.e-ibottom .e-tab-wrap {
-    height: 72px;
+    height: 62px;
   }
 }
 .e-tab-clone-element.e-itop .e-tab-wrap:focus .e-text-wrap, .e-tab-clone-element.e-ibottom .e-tab-wrap:focus .e-text-wrap {
@@ -3016,6 +3025,9 @@
 .e-tab .e-tab-header .e-toolbar-item:hover {
   background: inherit;
 }
+.e-tab .e-tab-header .e-toolbar-item.e-active:hover {
+  background: inherit;
+}
 .e-tab .e-tab-header .e-toolbar-item .e-ripple-element {
   background: rgba(0, 0, 0, 0.12);
 }
@@ -3071,8 +3083,8 @@
   content: unset;
   display: unset;
   position: unset;
-  top: unset;
   width: unset;
+  top: unset;
 }
 .e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-text,
 .e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-icon {
@@ -3084,6 +3096,9 @@
 .e-tab .e-tab-header .e-toolbar-item.e-active.e-ileft .e-tab-text, .e-tab .e-tab-header .e-toolbar-item.e-active.e-iright .e-tab-text {
   color: #4f46e5;
 }
+.e-tab .e-tab-header .e-toolbar-item.e-active .e-close-icon {
+  color: #6b7280;
+}
 .e-tab .e-tab-header .e-toolbar-item .e-close-icon {
   color: #6b7280;
 }
@@ -3497,6 +3512,10 @@
 .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active {
   border: 0;
 }
+.e-tab.e-fill .e-tab-header .e-toolbar-item.e-active.e-disable.e-overlay .e-tab-text,
+.e-tab.e-fill .e-tab-header .e-toolbar-item.e-active.e-disable.e-overlay .e-tab-icon {
+  color: #9ca3af;
+}
 .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
   background: #4f46e5;
   border-radius: 0;
@@ -3657,6 +3676,10 @@
   margin: 0;
   background: inherit;
 }
+.e-tab.e-background .e-tab-header .e-toolbar-item.e-active.e-disable.e-overlay .e-tab-text,
+.e-tab.e-background .e-tab-header .e-toolbar-item.e-active.e-disable.e-overlay .e-tab-icon {
+  color: #9ca3af;
+}
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
   background: #4f46e5;
   border-color: unset;