@syncfusion/ej2-navigations 21.2.8 → 22.1.34

package/styles/toolbar/fluent.css

@@ -32,6 +32,12 @@
 .e-toolbar.e-bigger .e-toolbar-items .e-toolbar-left .e-toolbar-item:first-child {
   margin-left: 10px;
 }
+.e-bigger .e-toolbar .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-item:last-child,
+.e-bigger .e-toolbar .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-right .e-toolbar-item:last-child,
+.e-toolbar.e-bigger .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-item:last-child,
+.e-toolbar.e-bigger .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-right .e-toolbar-item:last-child {
+  margin-right: 10px;
+}
 .e-bigger .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child,
 .e-toolbar.e-bigger .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 10px;
@@ -1072,10 +1078,11 @@
 .e-toolbar.e-rtl .e-hor-nav {
   background: #f3f2f1;
   border: solid #edebe9;
-  border-left: 0;
   border-width: 0 0 0 0;
 }
 .e-toolbar.e-rtl .e-hor-nav:not(.e-nav-active):hover {
   background: #edebe9;
   color: #201f1e;
+  border: solid #edebe9;
+  border-width: 0 0 0 0;
 }

package/styles/toolbar/highcontrast-light.css

@@ -21,6 +21,12 @@
 .e-toolbar.e-bigger .e-toolbar-items .e-toolbar-left .e-toolbar-item:first-child {
   margin-left: 3px;
 }
+.e-bigger .e-toolbar .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-item:last-child,
+.e-bigger .e-toolbar .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-right .e-toolbar-item:last-child,
+.e-toolbar.e-bigger .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-item:last-child,
+.e-toolbar.e-bigger .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-right .e-toolbar-item:last-child {
+  margin-right: 3px;
+}
 .e-bigger .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child,
 .e-toolbar.e-bigger .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 3px;
@@ -936,7 +942,7 @@
 }
 .e-toolbar .e-hor-nav:hover {
   background: #ecf;
-  border-left: 0;
+  border-left: 1px solid #000;
   color: #000;
 }
 .e-toolbar .e-hor-nav:hover .e-icons {
@@ -1061,10 +1067,11 @@
 .e-toolbar.e-rtl .e-hor-nav {
   background: #fff;
   border: solid #000;
-  border-left: 0;
   border-width: 0 1px 0 0;
 }
 .e-toolbar.e-rtl .e-hor-nav:not(.e-nav-active):hover {
   background: #ecf;
   color: #000;
+  border: solid #000;
+  border-width: 0 1px 0 0;
 }

package/styles/toolbar/highcontrast.css

@@ -22,6 +22,12 @@
 .e-toolbar.e-bigger .e-toolbar-items .e-toolbar-left .e-toolbar-item:first-child {
   margin-left: 3px;
 }
+.e-bigger .e-toolbar .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-item:last-child,
+.e-bigger .e-toolbar .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-right .e-toolbar-item:last-child,
+.e-toolbar.e-bigger .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-item:last-child,
+.e-toolbar.e-bigger .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-right .e-toolbar-item:last-child {
+  margin-right: 3px;
+}
 .e-bigger .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child,
 .e-toolbar.e-bigger .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 3px;
@@ -937,7 +943,7 @@
 }
 .e-toolbar .e-hor-nav:hover {
   background: #685708;
-  border-left: 0;
+  border-left: 1px solid #fff;
   color: #fff;
 }
 .e-toolbar .e-hor-nav:hover .e-icons {
@@ -1062,10 +1068,11 @@
 .e-toolbar.e-rtl .e-hor-nav {
   background: #000;
   border: solid #fff;
-  border-left: 0;
   border-width: 0 1px 0 0;
 }
 .e-toolbar.e-rtl .e-hor-nav:not(.e-nav-active):hover {
   background: #685708;
   color: #fff;
+  border: solid #fff;
+  border-width: 0 1px 0 0;
 }

package/styles/toolbar/icons/_material3-dark.scss

@@ -0,0 +1 @@
+@import './material3.scss';

package/styles/toolbar/material-dark.css

@@ -49,6 +49,12 @@
 .e-toolbar.e-bigger .e-toolbar-items .e-toolbar-left .e-toolbar-item:first-child {
   margin-left: 3px;
 }
+.e-bigger .e-toolbar .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-item:last-child,
+.e-bigger .e-toolbar .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-right .e-toolbar-item:last-child,
+.e-toolbar.e-bigger .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-item:last-child,
+.e-toolbar.e-bigger .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-right .e-toolbar-item:last-child {
+  margin-right: 3px;
+}
 .e-bigger .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child,
 .e-toolbar.e-bigger .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 3px;
@@ -975,7 +981,7 @@
 }
 .e-toolbar .e-hor-nav:hover {
   background: rgba(255, 255, 255, 0.1);
-  border-left: 0;
+  border-left: 1px solid #616161;
   color: #fff;
 }
 .e-toolbar .e-hor-nav:hover .e-icons {
@@ -984,7 +990,7 @@
 .e-toolbar .e-hor-nav:hover:not(.e-nav-active) {
   border-color: #616161;
   border-style: solid;
-  border-width: 0;
+  border-width: 0 0 0 1px;
 }
 .e-toolbar .e-hor-nav:hover:active {
   background: rgba(255, 255, 255, 0.1);
@@ -1100,10 +1106,11 @@
 .e-toolbar.e-rtl .e-hor-nav {
   background: #212121;
   border: solid #616161;
-  border-left: 0;
   border-width: 0 1px 0 0;
 }
 .e-toolbar.e-rtl .e-hor-nav:not(.e-nav-active):hover {
   background: rgba(255, 255, 255, 0.1);
   color: #fff;
+  border: solid #616161;
+  border-width: 0 1px 0 0;
 }

package/styles/toolbar/material.css

@@ -52,6 +52,12 @@
 .e-toolbar.e-bigger .e-toolbar-items .e-toolbar-left .e-toolbar-item:first-child {
   margin-left: 3px;
 }
+.e-bigger .e-toolbar .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-item:last-child,
+.e-bigger .e-toolbar .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-right .e-toolbar-item:last-child,
+.e-toolbar.e-bigger .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-item:last-child,
+.e-toolbar.e-bigger .e-toolbar-items:first-child:not(.e-toolbar-multirow) > .e-toolbar-right .e-toolbar-item:last-child {
+  margin-right: 3px;
+}
 .e-bigger .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child,
 .e-toolbar.e-bigger .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 3px;
@@ -978,7 +984,7 @@
 }
 .e-toolbar .e-hor-nav:hover {
   background: rgba(0, 0, 0, 0.12);
-  border-left: 0;
+  border-left: 1px solid rgba(0, 0, 0, 0.12);
   color: rgba(0, 0, 0, 0.87);
 }
 .e-toolbar .e-hor-nav:hover .e-icons {
@@ -987,7 +993,7 @@
 .e-toolbar .e-hor-nav:hover:not(.e-nav-active) {
   border-color: rgba(0, 0, 0, 0.12);
   border-style: solid;
-  border-width: 0;
+  border-width: 0 0 0 1px;
 }
 .e-toolbar .e-hor-nav:hover:active {
   background: rgba(0, 0, 0, 0.12);
@@ -1103,10 +1109,11 @@
 .e-toolbar.e-rtl .e-hor-nav {
   background: #fafafa;
   border: solid rgba(0, 0, 0, 0.12);
-  border-left: 0;
   border-width: 0 1px 0 0;
 }
 .e-toolbar.e-rtl .e-hor-nav:not(.e-nav-active):hover {
   background: rgba(0, 0, 0, 0.12);
   color: rgba(0, 0, 0, 0.87);
+  border: solid rgba(0, 0, 0, 0.12);
+  border-width: 0 1px 0 0;
 }