@syncfusion/ej2-navigations 27.2.4 → 28.1.33-686179

package/styles/fluent-lite.css

@@ -1382,7 +1382,6 @@
 }
 .e-toolbar .e-popup-down-icon.e-icons,
 .e-toolbar .e-popup-up-icon.e-icons {
-  color: #605e5c;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -1396,6 +1395,7 @@
           justify-content: center;
   width: 100%;
   font-size: 12px;
+  color: #605e5c;
 }
 .e-toolbar.e-toolpop {
   overflow: visible;
@@ -4974,17 +4974,6 @@
 .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap .e-tab-icon {
   color: #605e5c;
 }
-@media screen and (max-width: 480px) {
-  .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
-    color: #3b3a39;
-  }
-  .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap .e-tab-icon {
-    color: #3b3a39;
-  }
-  .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap .e-close-icon {
-    color: rgba(96, 94, 92, 0.87);
-  }
-}
 .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
   background: none;
   border: 0;
@@ -6195,7 +6184,7 @@
   line-height: 36px;
   margin: 0;
   min-height: 36px;
-  padding: 0 8px;
+  padding: 0 12px;
   text-decoration: none;
   vertical-align: middle;
 }
@@ -6208,6 +6197,9 @@
 .e-treeview .e-list-text .e-input-group .e-input {
   height: 28px;
 }
+.e-treeview .e-navigable-text {
+  padding: 0 12px;
+}
 .e-treeview .e-list-icon,
 .e-treeview .e-list-img {
   display: inline-block;
@@ -6225,6 +6217,10 @@
 .e-treeview .e-list-img + .e-list-text {
   padding: 0 12px;
 }
+.e-treeview .e-list-icon + .e-navigable-text,
+.e-treeview .e-list-img + .e-navigable-text {
+  padding: 0 12px;
+}
 .e-treeview .e-icon-collapsible,
 .e-treeview .e-icon-expandable {
   display: inline-block;
@@ -6326,6 +6322,12 @@
 .e-treeview .e-navigable .e-anchor-wrap {
   padding: 0 0 0 12px;
 }
+.e-treeview .e-navigable .e-nav-wrapper {
+  padding: 0;
+}
+.e-treeview .e-navigable .e-checkbox-wrapper + .e-list-text .e-nav-wrapper:not(:has(.e-list-icon)) {
+  padding: 0;
+}
 .e-treeview .e-navigable .e-list-icon,
 .e-treeview .e-navigable .e-list-img {
   margin: 0 12px 0 0;
@@ -6338,19 +6340,17 @@
   float: left;
 }
 .e-treeview.e-drag-item .e-text-content .e-list-text {
-  padding: 0 12px;
+  padding: 0px;
 }
 .e-treeview.e-drag-item .e-icon-collapsible,
 .e-treeview.e-drag-item .e-icon-expandable {
   -webkit-box-sizing: content-box;
           box-sizing: content-box;
   padding-left: 12px;
-  padding-top: 8px;
 }
 .e-treeview.e-drag-item .e-icon-collapsible::before,
 .e-treeview.e-drag-item .e-icon-expandable::before {
   font-size: 12px;
-  padding: 12px;
 }
 .e-treeview.e-drag-item .e-drop-count {
   border: 1px solid;
@@ -6383,6 +6383,9 @@
 .e-treeview.e-rtl .e-navigable .e-anchor-wrap {
   padding: 0 12px 0 0;
 }
+.e-treeview.e-rtl .e-navigable .e-nav-wrapper {
+  padding: 0;
+}
 .e-treeview.e-rtl .e-navigable .e-list-icon,
 .e-treeview.e-rtl .e-navigable .e-list-img,
 .e-treeview.e-rtl .e-navigable .e-list-icon + .e-list-img {
@@ -8461,6 +8464,7 @@ ejs-sidebar {
 }
 .e-stepper.e-vertical {
   min-height: inherit;
+  height: inherit;
   display: inline-block;
 }
 .e-stepper.e-vertical .e-step-label.e-step-label-only,
@@ -8484,6 +8488,7 @@ ejs-sidebar {
       -ms-flex-direction: column;
           flex-direction: column;
   min-height: inherit;
+  height: inherit;
   float: left;
   -webkit-box-align: start;
       -ms-flex-align: start;
@@ -8735,7 +8740,8 @@ ejs-sidebar {
   background-color: #fff;
   border-color: transparent;
 }
-.e-stepper .e-step-disabled .e-indicator {
+.e-stepper .e-step-disabled .e-indicator,
+.e-stepper .e-step-disabled .e-step {
   background: #edebe9;
   color: #a19f9d;
 }

package/styles/fluent.css

@@ -729,6 +729,13 @@
     margin-top: 10px;
   }
 }
+@media (max-width: 769px) {
+  .e-bigger .e-pager.e-rtl div.e-parentmsgbar,
+  .e-pager.e-bigger.e-rtl div.e-parentmsgbar {
+    margin-left: 0;
+    margin-top: 10px;
+  }
+}
 .e-bigger .e-pager.e-rtl .e-pp.e-spacing.e-numericitem, .e-bigger .e-pager.e-rtl .e-np.e-spacing.e-numericitem, .e-bigger .e-pager.e-rtl .e-pp.e-spacing.e-numericitem:hover, .e-bigger .e-pager.e-rtl .e-np.e-spacing.e-numericitem:hover,
 .e-pager.e-bigger.e-rtl .e-pp.e-spacing.e-numericitem,
 .e-pager.e-bigger.e-rtl .e-np.e-spacing.e-numericitem,
@@ -1638,7 +1645,6 @@
 }
 .e-toolbar .e-popup-down-icon.e-icons,
 .e-toolbar .e-popup-up-icon.e-icons {
-  color: #605e5c;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -1652,6 +1658,7 @@
           justify-content: center;
   width: 100%;
   font-size: 12px;
+  color: #605e5c;
 }
 .e-toolbar.e-toolpop {
   overflow: visible;
@@ -5635,17 +5642,6 @@
 .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap .e-tab-icon {
   color: #605e5c;
 }
-@media screen and (max-width: 480px) {
-  .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
-    color: #3b3a39;
-  }
-  .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap .e-tab-icon {
-    color: #3b3a39;
-  }
-  .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap .e-close-icon {
-    color: rgba(96, 94, 92, 0.87);
-  }
-}
 .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
   background: none;
   border: 0;
@@ -7024,6 +7020,13 @@
   top: 0;
   vertical-align: initial;
 }
+.e-bigger .e-tab .e-tab-header.e-vertical .e-hor-nav .e-popup-up-icon,
+.e-bigger .e-tab .e-tab-header.e-vertical .e-hor-nav .e-popup-down-icon,
+.e-tab.e-bigger .e-tab-header.e-vertical .e-hor-nav .e-popup-up-icon,
+.e-tab.e-bigger .e-tab-header.e-vertical .e-hor-nav .e-popup-down-icon {
+  height: 100%;
+  width: 100%;
+}
 .e-bigger .e-tab .e-tab-header .e-hor-nav,
 .e-tab.e-bigger .e-tab-header .e-hor-nav {
   height: 48px;
@@ -8050,7 +8053,7 @@
   line-height: 36px;
   margin: 0;
   min-height: 36px;
-  padding: 0 8px;
+  padding: 0 12px;
   text-decoration: none;
   vertical-align: middle;
 }
@@ -8063,6 +8066,9 @@
 .e-treeview .e-list-text .e-input-group .e-input {
   height: 28px;
 }
+.e-treeview .e-navigable-text {
+  padding: 0 12px;
+}
 .e-treeview .e-list-icon,
 .e-treeview .e-list-img {
   display: inline-block;
@@ -8080,6 +8086,10 @@
 .e-treeview .e-list-img + .e-list-text {
   padding: 0 12px;
 }
+.e-treeview .e-list-icon + .e-navigable-text,
+.e-treeview .e-list-img + .e-navigable-text {
+  padding: 0 12px;
+}
 .e-treeview .e-icon-collapsible,
 .e-treeview .e-icon-expandable {
   display: inline-block;
@@ -8181,6 +8191,12 @@
 .e-treeview .e-navigable .e-anchor-wrap {
   padding: 0 0 0 12px;
 }
+.e-treeview .e-navigable .e-nav-wrapper {
+  padding: 0;
+}
+.e-treeview .e-navigable .e-checkbox-wrapper + .e-list-text .e-nav-wrapper:not(:has(.e-list-icon)) {
+  padding: 0;
+}
 .e-treeview .e-navigable .e-list-icon,
 .e-treeview .e-navigable .e-list-img {
   margin: 0 12px 0 0;
@@ -8193,19 +8209,17 @@
   float: left;
 }
 .e-treeview.e-drag-item .e-text-content .e-list-text {
-  padding: 0 12px;
+  padding: 0px;
 }
 .e-treeview.e-drag-item .e-icon-collapsible,
 .e-treeview.e-drag-item .e-icon-expandable {
   -webkit-box-sizing: content-box;
           box-sizing: content-box;
   padding-left: 12px;
-  padding-top: 8px;
 }
 .e-treeview.e-drag-item .e-icon-collapsible::before,
 .e-treeview.e-drag-item .e-icon-expandable::before {
   font-size: 12px;
-  padding: 12px;
 }
 .e-treeview.e-drag-item .e-drop-count {
   border: 1px solid;
@@ -8238,6 +8252,9 @@
 .e-treeview.e-rtl .e-navigable .e-anchor-wrap {
   padding: 0 12px 0 0;
 }
+.e-treeview.e-rtl .e-navigable .e-nav-wrapper {
+  padding: 0;
+}
 .e-treeview.e-rtl .e-navigable .e-list-icon,
 .e-treeview.e-rtl .e-navigable .e-list-img,
 .e-treeview.e-rtl .e-navigable .e-list-icon + .e-list-img {
@@ -8599,7 +8616,6 @@
 .e-treeview.e-bigger .e-list-text {
   line-height: 40px;
   min-height: 40px;
-  padding: 0 16px;
 }
 .e-bigger .e-treeview .e-list-text .e-input-group,
 .e-treeview.e-bigger .e-list-text .e-input-group {
@@ -10996,6 +11012,7 @@ ejs-sidebar {
 }
 .e-stepper.e-vertical {
   min-height: inherit;
+  height: inherit;
   display: inline-block;
 }
 .e-stepper.e-vertical .e-step-label.e-step-label-only,
@@ -11019,6 +11036,7 @@ ejs-sidebar {
       -ms-flex-direction: column;
           flex-direction: column;
   min-height: inherit;
+  height: inherit;
   float: left;
   -webkit-box-align: start;
       -ms-flex-align: start;
@@ -11270,7 +11288,8 @@ ejs-sidebar {
   background-color: #fff;
   border-color: transparent;
 }
-.e-stepper .e-step-disabled .e-indicator {
+.e-stepper .e-step-disabled .e-indicator,
+.e-stepper .e-step-disabled .e-step {
   background: #edebe9;
   color: #a19f9d;
 }

package/styles/fluent2-lite.css

@@ -109,6 +109,9 @@
   padding: 13px 12px 10px;
   text-align: center;
 }
+.e-pager.e-mac-safari .e-numericitem {
+  vertical-align: top;
+}
 .e-pager div.e-pagermsgdiv {
   padding-right: 6px;
   padding-top: 4px;
@@ -1433,7 +1436,6 @@
 }
 .e-toolbar .e-popup-down-icon.e-icons,
 .e-toolbar .e-popup-up-icon.e-icons {
-  color: var(--color-sf-icon-color);
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -1447,6 +1449,7 @@
           justify-content: center;
   width: 100%;
   font-size: 16px;
+  color: var(--color-sf-icon-color);
 }
 .e-toolbar.e-toolpop {
   overflow: visible;
@@ -2804,6 +2807,11 @@
 }
 .e-carousel .e-carousel-navigators .e-previous .e-btn:not(:disabled):focus-visible .e-btn-icon,
 .e-carousel .e-carousel-navigators .e-next .e-btn:not(:disabled):focus-visible .e-btn-icon,
+.e-carousel .e-carousel-navigators .e-play-pause .e-btn:not(:disabled):focus-visible .e-btn-icon {
+  color: var(--color-sf-icon-color);
+}
+.e-carousel .e-carousel-navigators .e-previous .e-btn:not(:disabled):focus-visible .e-btn-icon,
+.e-carousel .e-carousel-navigators .e-next .e-btn:not(:disabled):focus-visible .e-btn-icon,
 .e-carousel .e-carousel-navigators .e-play-pause .e-btn:not(:disabled):focus-visible .e-btn-icon {
   color: var(--color-sf-icon-color-hover);
 }
@@ -2913,7 +2921,7 @@
 }
 .e-contextmenu-wrapper ul.e-ul,
 .e-contextmenu-container ul.e-ul {
-  font-family: "Segoe UI", -apple-system, blinkMacSystemfont, "Roboto", "Helvetica Neue", sans-serif;
+  font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", sans-serif;
 }
 .e-contextmenu-wrapper ul .e-menu-item,
 .e-contextmenu-container ul .e-menu-item {
@@ -3482,7 +3490,7 @@
 }
 .e-tab .e-tab-header .e-toolbar-item .e-tab-text {
   display: inherit;
-  font-family: "Segoe UI", -apple-system, blinkMacSystemfont, "Roboto", "Helvetica Neue", sans-serif;
+  font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", sans-serif;
   font-size: 14px;
   font-weight: 600;
   text-transform: capitalize;
@@ -4271,7 +4279,7 @@
 .e-tab .e-tab-header.e-vertical .e-hor-nav .e-popup-up-icon::before,
 .e-tab .e-tab-header.e-vertical .e-hor-nav .e-popup-down-icon::before {
   float: left;
-  font-family: "Segoe UI", -apple-system, blinkMacSystemfont, "Roboto", "Helvetica Neue", sans-serif;
+  font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", sans-serif;
   font-size: 14px;
   font-weight: 600;
   line-height: 35px;
@@ -4974,7 +4982,7 @@
 }
 .e-tab-clone-element .e-tab-text {
   display: inherit;
-  font-family: "Segoe UI", -apple-system, blinkMacSystemfont, "Roboto", "Helvetica Neue", sans-serif;
+  font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", sans-serif;
   font-size: 14px;
   font-weight: 600;
   text-transform: capitalize;
@@ -5198,17 +5206,6 @@
 .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap .e-tab-icon {
   color: var(--color-sf-content-text-color-alt2);
 }
-@media screen and (max-width: 480px) {
-  .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
-    color: var(--color-sf-content-text-color-alt3);
-  }
-  .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap .e-tab-icon {
-    color: var(--color-sf-content-text-color-alt3);
-  }
-  .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap .e-close-icon {
-    color: rgba(var(--color-sf-icon-color), 0.87);
-  }
-}
 .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
   background: inherit;
   border: 0;
@@ -6529,6 +6526,9 @@
 .e-treeview.e-text-wrap .e-list-icon + .e-list-img + .e-list-text {
   max-width: calc(100% - 60px);
 }
+.e-treeview .e-checkbox-wrapper .e-frame {
+  margin-right: 0;
+}
 .e-treeview .e-ul {
   margin: 0;
   padding: 0 0 0 12px;
@@ -6615,7 +6615,7 @@
   margin: 0 0 0 4px;
 }
 .e-treeview .e-checkbox-wrapper + .e-list-text {
-  padding: 0 4px;
+  padding: 0 12px;
 }
 .e-treeview .e-checkbox-wrapper .e-ripple-container {
   bottom: -7px;
@@ -6650,6 +6650,9 @@
   border-color: var(--color-sf-border-focus);
   border-bottom-color: var(--color-sf-border-focus);
 }
+.e-treeview .e-navigable-text {
+  padding: 0 12px;
+}
 .e-treeview .e-list-icon,
 .e-treeview .e-list-img {
   display: inline-block;
@@ -6667,6 +6670,10 @@
 .e-treeview .e-list-img + .e-list-text {
   padding: 0 12px;
 }
+.e-treeview .e-list-icon + .e-navigable-text,
+.e-treeview .e-list-img + .e-navigable-text {
+  padding: 0 12px;
+}
 .e-treeview .e-icon-collapsible,
 .e-treeview .e-icon-expandable {
   display: inline-block;
@@ -6763,7 +6770,7 @@
 }
 .e-treeview .e-navigable .e-checkbox-wrapper + .e-list-url .e-anchor-wrap .e-list-icon,
 .e-treeview .e-navigable .e-checkbox-wrapper + .e-list-url .e-anchor-wrap .e-list-img {
-  margin: 0 10px 0 2px;
+  margin: 0 12px 0 0;
 }
 .e-treeview .e-navigable .e-checkbox-wrapper + .e-list-url .e-anchor-wrap .e-list-icon + .e-list-img {
   margin: 0 12px 0 0;
@@ -6771,6 +6778,12 @@
 .e-treeview .e-navigable .e-anchor-wrap {
   padding: 0 0 0 4px;
 }
+.e-treeview .e-navigable .e-nav-wrapper {
+  padding: 0;
+}
+.e-treeview .e-navigable .e-checkbox-wrapper + .e-list-text .e-nav-wrapper:not(:has(.e-list-icon)) {
+  padding: 0;
+}
 .e-treeview .e-navigable .e-list-icon,
 .e-treeview .e-navigable .e-list-img {
   margin: 0 12px 0 0;
@@ -6826,6 +6839,9 @@
 .e-treeview.e-rtl .e-navigable .e-anchor-wrap {
   padding: 0 4px 0 0;
 }
+.e-treeview.e-rtl .e-navigable .e-nav-wrapper {
+  padding: 0;
+}
 .e-treeview.e-rtl .e-navigable .e-list-icon,
 .e-treeview.e-rtl .e-navigable .e-list-img,
 .e-treeview.e-rtl .e-navigable .e-list-icon + .e-list-img {
@@ -7046,7 +7062,7 @@
 }
 .e-treeview.e-drag-item {
   background-color: var(--color-sf-content-bg-color-alt3);
-  font-family: "Segoe UI", -apple-system, blinkMacSystemfont, "Roboto", "Helvetica Neue", sans-serif;
+  font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", sans-serif;
 }
 .e-treeview.e-drag-item .e-icon-collapsible::before,
 .e-treeview.e-drag-item .e-icon-expandable::before {
@@ -7566,7 +7582,7 @@ ejs-sidebar {
 .e-menu-wrapper .e-menu-header,
 .e-menu-container .e-menu-header {
   display: none;
-  font-family: "Segoe UI", -apple-system, blinkMacSystemfont, "Roboto", "Helvetica Neue", sans-serif;
+  font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", sans-serif;
   font-size: 16px;
   font-weight: 400;
   height: 40px;
@@ -7948,6 +7964,15 @@ ejs-sidebar {
 .e-menu-container .e-menu .e-menu-item.e-focused .e-menu-icon {
   color: var(--color-sf-icon-color-pressed);
 }
+.e-menu-wrapper .e-menu .e-menu-item.e-focused:focus-visible,
+.e-menu-container .e-menu .e-menu-item.e-focused:focus-visible {
+  color: var(--color-sf-content-text-color);
+}
+.e-menu-wrapper .e-menu .e-menu-item.e-focused:focus-visible .e-caret, .e-menu-wrapper .e-menu .e-menu-item.e-focused:focus-visible .e-menu-icon,
+.e-menu-container .e-menu .e-menu-item.e-focused:focus-visible .e-caret,
+.e-menu-container .e-menu .e-menu-item.e-focused:focus-visible .e-menu-icon {
+  color: var(--color-sf-icon-color);
+}
 .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 {
@@ -7971,8 +7996,8 @@ ejs-sidebar {
 .e-menu-container .e-menu .e-menu-item.e-separator {
   border-bottom-color: var(--color-sf-border-light);
 }
-.e-menu-wrapper .e-menu .e-menu-item:focus-visible,
-.e-menu-container .e-menu .e-menu-item:focus-visible {
+.e-menu-wrapper .e-menu .e-menu-item:focus-visible:not(.e-selected),
+.e-menu-container .e-menu .e-menu-item:focus-visible:not(.e-selected) {
   border-radius: 4px;
   background-color: var(--color-sf-content-bg-color);
   -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
@@ -8040,7 +8065,7 @@ ejs-sidebar {
 }
 .e-menu-wrapper .e-ul .e-menu-item:focus-visible,
 .e-menu-container .e-ul .e-menu-item:focus-visible {
-  background-color: var(--color-sf-content-bg-color);
+  background-color: var(--color-sf-flyout-bg-color-focus);
   -webkit-box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
           box-shadow: inset 0 0 0 1px var(--color-sf-shadow-color), inset 0 0 0 2px var(--color-sf-shadow-color1);
   border-radius: 4px;
@@ -9052,6 +9077,7 @@ ejs-sidebar {
 }
 .e-stepper.e-vertical {
   min-height: inherit;
+  height: inherit;
   display: inline-block;
 }
 .e-stepper.e-vertical .e-step-label.e-step-label-only,
@@ -9075,6 +9101,7 @@ ejs-sidebar {
       -ms-flex-direction: column;
           flex-direction: column;
   min-height: inherit;
+  height: inherit;
   float: left;
   -webkit-box-align: start;
       -ms-flex-align: start;
@@ -9326,7 +9353,8 @@ ejs-sidebar {
   background-color: var(--color-sf-content-bg-color);
   border-color: transparent;
 }
-.e-stepper .e-step-disabled .e-indicator {
+.e-stepper .e-step-disabled .e-indicator,
+.e-stepper .e-step-disabled .e-step {
   background: var(--color-sf-content-bg-color-disabled);
   color: var(--color-sf-secondary-text-color-disabled);
 }