@syncfusion/ej2-navigations 19.4.56 → 20.1.51

package/styles/toolbar/fluent.scss

@@ -0,0 +1,8 @@
+@import 'ej2-base/styles/fluent-definition.scss';
+@import '../h-scroll/fluent-definition.scss';
+@import '../v-scroll/fluent-definition.scss';
+@import 'ej2-buttons/styles/button/fluent-definition.scss';
+@import 'ej2-popups/styles/popup/fluent-definition.scss';
+@import 'fluent-definition.scss';
+@import 'icons/fluent.scss';
+@import 'all.scss';

package/styles/toolbar/highcontrast-light.css

@@ -1274,6 +1274,10 @@
   outline: none;
 }
 
+.e-toolbar .e-toolbar-pop .e-toolbar-item:not(.e-separator) {
+  background: transparent;
+}
+
 .e-toolbar.e-extended-toolbar .e-toolbar-pop {
   background: #fff;
 }

package/styles/toolbar/highcontrast.css

@@ -1275,6 +1275,10 @@
   outline: none;
 }
 
+.e-toolbar .e-toolbar-pop .e-toolbar-item:not(.e-separator) {
+  background: transparent;
+}
+
 .e-toolbar.e-extended-toolbar .e-toolbar-pop {
   background: #000;
 }

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

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

package/styles/toolbar/icons/_fluent.scss

@@ -4,13 +4,14 @@
   #{&}.e-toolbar {
 
     .e-popup-down-icon::before {
-      content: '\e7ae';
+      content: '\e71c';
       line-height: normal;
     }
 
     .e-popup-up-icon::before {
-      content: '\e7ae';
+      content: '\e71c';
       line-height: normal;
     }
   }
 }
+  

package/styles/toolbar/icons/_tailwind.scss

@@ -4,13 +4,14 @@
   #{&}.e-toolbar {
 
     .e-popup-down-icon::before {
-      content: '\e706';
+      content: '\e729';
       line-height: normal;
     }
 
     .e-popup-up-icon::before {
-      content: '\e752';
+      content: '\e776';
       line-height: normal;
     }
   }
 }
+  

package/styles/toolbar/material-dark.css

@@ -1275,6 +1275,10 @@
   box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.21);
 }
 
+.e-toolbar .e-toolbar-pop .e-toolbar-item:not(.e-separator) {
+  background: transparent;
+}
+
 .e-toolbar.e-extended-toolbar .e-toolbar-pop {
   background: #212121;
 }

package/styles/toolbar/material.css

@@ -1278,6 +1278,10 @@
   box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.21);
 }
 
+.e-toolbar .e-toolbar-pop .e-toolbar-item:not(.e-separator) {
+  background: transparent;
+}
+
 .e-toolbar.e-extended-toolbar .e-toolbar-pop {
   background: #fafafa;
 }

package/styles/toolbar/tailwind-dark.css

@@ -13,12 +13,12 @@
 /*! component's theme wise override definitions and variables */
 /*! toolbar icons */
 .e-toolbar .e-popup-down-icon::before {
-  content: '\e706';
+  content: '\e729';
   line-height: normal;
 }
 
 .e-toolbar .e-popup-up-icon::before {
-  content: '\e752';
+  content: '\e776';
   line-height: normal;
 }
 
@@ -235,7 +235,7 @@
 .e-bigger .e-toolbar .e-toolbar-items .e-toolbar-item.e-separator,
 .e-toolbar.e-bigger .e-toolbar-items .e-toolbar-item.e-separator {
   height: 30px;
-  margin: 8px 4px;
+  margin: 8px 6px;
   min-height: 30px;
 }
 
@@ -367,7 +367,7 @@
 .e-bigger .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item.e-separator,
 .e-toolbar.e-bigger.e-extended-toolbar .e-toolbar-extended .e-toolbar-item.e-separator {
   height: 30px;
-  margin: 8px 4px;
+  margin: 8px 6px;
   min-height: 30px;
 }
 
@@ -561,7 +561,7 @@
 }
 
 .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item.e-separator {
-  margin: 7px 3px;
+  margin: 7px 4px;
   min-height: 16px;
   min-width: 1px;
   vertical-align: middle;
@@ -1007,7 +1007,7 @@
 }
 
 .e-toolbar .e-toolbar-items .e-toolbar-item.e-separator {
-  margin: 7px 3px;
+  margin: 7px 4px;
   min-height: 24px;
   min-width: 1px;
 }
@@ -1261,6 +1261,10 @@
   background: #4b5563;
 }
 
+.e-toolbar .e-toolbar-pop .e-toolbar-item:not(.e-separator) {
+  background: transparent;
+}
+
 .e-toolbar.e-extended-toolbar .e-toolbar-pop {
   background: #374151;
 }

package/styles/toolbar/tailwind.css

@@ -13,12 +13,12 @@
 /*! component's theme wise override definitions and variables */
 /*! toolbar icons */
 .e-toolbar .e-popup-down-icon::before {
-  content: '\e706';
+  content: '\e729';
   line-height: normal;
 }
 
 .e-toolbar .e-popup-up-icon::before {
-  content: '\e752';
+  content: '\e776';
   line-height: normal;
 }
 
@@ -235,7 +235,7 @@
 .e-bigger .e-toolbar .e-toolbar-items .e-toolbar-item.e-separator,
 .e-toolbar.e-bigger .e-toolbar-items .e-toolbar-item.e-separator {
   height: 30px;
-  margin: 8px 4px;
+  margin: 8px 6px;
   min-height: 30px;
 }
 
@@ -367,7 +367,7 @@
 .e-bigger .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item.e-separator,
 .e-toolbar.e-bigger.e-extended-toolbar .e-toolbar-extended .e-toolbar-item.e-separator {
   height: 30px;
-  margin: 8px 4px;
+  margin: 8px 6px;
   min-height: 30px;
 }
 
@@ -561,7 +561,7 @@
 }
 
 .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item.e-separator {
-  margin: 7px 3px;
+  margin: 7px 4px;
   min-height: 16px;
   min-width: 1px;
   vertical-align: middle;
@@ -1007,7 +1007,7 @@
 }
 
 .e-toolbar .e-toolbar-items .e-toolbar-item.e-separator {
-  margin: 7px 3px;
+  margin: 7px 4px;
   min-height: 24px;
   min-width: 1px;
 }
@@ -1261,6 +1261,10 @@
   background: #e5e7eb;
 }
 
+.e-toolbar .e-toolbar-pop .e-toolbar-item:not(.e-separator) {
+  background: transparent;
+}
+
 .e-toolbar.e-extended-toolbar .e-toolbar-pop {
   background: #f3f4f6;
 }

package/styles/treeview/_bootstrap5-definition.scss

@@ -29,8 +29,8 @@ $treeview-rtl-image-margin: 0 8px 0 0 !default;
 $treeview-image-text-padding: 0 8px !default;
 $treeview-icon-image-margin: 0 0 0 8px !default;
 $treeview-rtl-icon-image-margin: 0 8px 0 0 !default;
-$treeview-check-margin: 0 0 0 8px !default;
-$treeview-rtl-check-margin: 0 8px 0 0 !default;
+$treeview-check-margin: 0 0 0 12px !default;
+$treeview-rtl-check-margin: 0 12px 0 0 !default;
 $treeview-check-text-padding: 0 8px !default;
 $treeview-check-image-margin: 0 0 0 8px !default;
 $treeview-rtl-check-image-margin: 0 8px 0 0 !default;

package/styles/treeview/_fluent-dark-definition.scss

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

package/styles/treeview/_fluent-definition.scss

@@ -10,13 +10,13 @@ $treeview-root-ul-padding: 0 0 0 12px !default;
 $treeview-rtl-root-ul-padding: 0 12px 0 0 !default;
 $treeview-child-ul-padding: 0 0 0 20px !default;
 $treeview-rtl-child-ul-padding: 0 20px 0 0 !default;
-$treeview-text-wrap-padding: 0 0 0 20px !default;
+$treeview-text-wrap-padding: 0 12px 0 20px !default;
 $treeview-rtl-text-wrap-padding: 0 20px 0 0 !default;
 $treeview-icon-size: 20px !default;
 $treeview-icon-margin: 0 0 0 -20px !default;
 $treeview-rtl-icon-margin: 0 -20px 0 0 !default;
 $treeview-icon-padding: 0px !default;
-$treeview-text-padding: 0 12px !default;
+$treeview-text-padding: 0 8px !default;
 $treeview-text-margin: 0 !default;
 $treeview-image-size: 20px !default;
 $treeview-image-margin: 0 0 0 12px !default;

package/styles/treeview/_layout.scss

@@ -121,7 +121,7 @@
           .e-icon-expandable,
           .e-icon-collapsible {
             padding-left: 24px;
-            padding-top: 10;
+            padding-top: 10px;
           }
         }
 
@@ -533,7 +533,9 @@
 
     .e-list-item {
       list-style: none;
-      padding: 2px 0;
+      @if $skin-name != 'tailwind' {
+        padding: 2px 0;
+      }
 
       .e-ul {
         margin: 2px 0 -2px;
@@ -630,9 +632,12 @@
 
       .e-input-group {
         height: $treeview-input-height;
-        @if($skin-name == 'tailwind' or $skin-name == 'FluentUI') {
+        @if($skin-name == 'FluentUI') {
           margin-top: 3px;
         }
+        @else if($skin-name == 'tailwind') {
+          margin-bottom: 3px;
+        }
         @else if($skin-name == 'bootstrap5') {
           margin-bottom: 2px;
         }

package/styles/treeview/_tailwind-definition.scss

@@ -34,14 +34,14 @@ $treeview-rtl-image-margin: 0 8px 0 0 !default;
 $treeview-image-text-padding: 0 8px !default;
 $treeview-icon-image-margin: 0 0 0 8px !default;
 $treeview-rtl-icon-image-margin: 0 8px 0 0 !default;
-$treeview-check-margin: 0 0 0 8px !default;
-$treeview-rtl-check-margin: 0 8px 0 0 !default;
+$treeview-check-margin: 0 0 0 6px !default;
+$treeview-rtl-check-margin: 0 6px 0 0 !default;
 $treeview-check-text-padding: 0 8px !default;
 $treeview-check-image-margin: 0 0 0 8px !default;
 $treeview-rtl-check-image-margin: 0 8px 0 0 !default;
 $treeview-drop-count-border-size: 1px !default;
 $treeview-drop-count-font-size: $text-xs !default;
-$treeview-active-font-weight: 500 !default;
+$treeview-active-font-weight: 600 !default;
 $treeview-edit-wrap-width: calc(100% - 2px) !default;
 $treeview-check-wrap-width: calc(100% - 23px) !default;
 $treeview-check-icon-wrap-width: calc(100% - 56px) !default;
@@ -59,8 +59,8 @@ $treeview-big-image-margin: 0 0 0 12px !default;
 $treeview-big-rtl-image-margin: 0 12px 0 0 !default;
 $treeview-big-icon-image-margin: 0 0 0 12px !default;
 $treeview-big-rtl-icon-image-margin: 0 12px 0 0 !default;
-$treeview-big-check-margin: 0 0 0 12px !default;
-$treeview-big-rtl-check-margin: 0 12px 0 0 !default;
+$treeview-big-check-margin: 0 0 0 8px !default;
+$treeview-big-rtl-check-margin: 0 8px 0 0 !default;
 $treeview-big-check-image-margin: 0 0 0 12px !default;
 $treeview-big-rtl-check-image-margin: 0 12px 0 0 !default;
 $treeview-big-root-ul-padding: 0 0 0 16px !default;

package/styles/treeview/bootstrap5-dark.css

@@ -469,7 +469,7 @@
 }
 
 .e-treeview .e-checkbox-wrapper {
-  margin: 0 0 0 8px;
+  margin: 0 0 0 12px;
   pointer-events: all;
   position: relative;
 }
@@ -651,7 +651,7 @@
 }
 
 .e-treeview .e-navigable .e-anchor-wrap {
-  padding: 0 0 0 8px;
+  padding: 0 0 0 12px;
 }
 
 .e-treeview .e-navigable .e-list-icon,
@@ -716,7 +716,7 @@
 }
 
 .e-treeview.e-rtl .e-navigable .e-anchor-wrap {
-  padding: 0 8px 0 0;
+  padding: 0 12px 0 0;
 }
 
 .e-treeview.e-rtl .e-navigable .e-list-icon,
@@ -738,7 +738,7 @@
 }
 
 .e-treeview.e-rtl .e-checkbox-wrapper {
-  margin: 0 8px 0 0;
+  margin: 0 12px 0 0;
 }
 
 .e-treeview.e-rtl .e-checkbox-wrapper + .e-list-icon,

package/styles/treeview/bootstrap5.css

@@ -469,7 +469,7 @@
 }
 
 .e-treeview .e-checkbox-wrapper {
-  margin: 0 0 0 8px;
+  margin: 0 0 0 12px;
   pointer-events: all;
   position: relative;
 }
@@ -651,7 +651,7 @@
 }
 
 .e-treeview .e-navigable .e-anchor-wrap {
-  padding: 0 0 0 8px;
+  padding: 0 0 0 12px;
 }
 
 .e-treeview .e-navigable .e-list-icon,
@@ -716,7 +716,7 @@
 }
 
 .e-treeview.e-rtl .e-navigable .e-anchor-wrap {
-  padding: 0 8px 0 0;
+  padding: 0 12px 0 0;
 }
 
 .e-treeview.e-rtl .e-navigable .e-list-icon,
@@ -738,7 +738,7 @@
 }
 
 .e-treeview.e-rtl .e-checkbox-wrapper {
-  margin: 0 8px 0 0;
+  margin: 0 12px 0 0;
 }
 
 .e-treeview.e-rtl .e-checkbox-wrapper + .e-list-icon,