@syncfusion/ej2-navigations 20.2.50 → 20.3.48

package/styles/toolbar/_material-dark-definition.scss

@@ -1,4 +1,4 @@
-//default 
+//default
 $tbar-skin: 'material' !default;
 $tbar-zero-value: 0 !default;
 $tbar-pop-icon-bgr-padding: 0 !default;
@@ -86,8 +86,8 @@ $tbar-btn-bgr-mrgn: 5.5px 0 !default;
 $tbar-btn-bgr-height: calc(100% - 11px) !default;
 $tbar-btn-nrml-height: calc(100% - 10px) !default;
 $tbar-btn-nrml-mrgn: 4px 0 !default;
-$tbar-separator-nrml-mrgn: 7.5px 3px  !default;
-$tbar-separator-bgr-mrgn: 10px 5px  !default;
+$tbar-separator-nrml-mrgn: 7.5px 3px !default;
+$tbar-separator-bgr-mrgn: 10px 5px !default;
 $tbar-separator-nrml-height: calc(100% - 15px) !default;
 $tbar-separator-bgr-height: calc(100% - 20px) !default;
 $tbar-separator-nrml-minheight: 27px !default;
@@ -103,10 +103,10 @@ $tbar-btn-icon-nrml-height: 25px !default;
 $tbar-btn-icon-nrml-line-height: 25px !default;
 $tbar-left-item-line-height: 35px !default;
 $tbar-right-item-line-height: 24px !default;
-$tbar-btn-bgr-padding: $tbar-zero-value 6px  !default;
+$tbar-btn-bgr-padding: $tbar-zero-value 6px !default;
 $tbar-btn-bgr-focus-padding: 0 6px !default;
 $tbar-item-height: auto !default;
-$tbar-btn-nrml-padding: $tbar-zero-value 1.5px  !default;
+$tbar-btn-nrml-padding: $tbar-zero-value 1.5px !default;
 $tbar-pop-btn-bgr-padding: $tbar-zero-value 16px !default;
 $tbar-pop-btn-nrml-padding: $tbar-zero-value 16px !default;
 $tbar-item-pop-bg-color: transparent !default;
@@ -147,14 +147,12 @@ $tbar-separator-border: rgba($grey-white, .24) !default;
 $tbar-default-border: $grey-700 !default;
 $tbar-btn-border: none !default;
 
-
-
-
 //enddefault
 //dimensions
 $tbar-ribble-animation-border-frame: rgba(255, 255, 255, .5) !default;
 $tbar-ribble-animation-shadow-frame: 0 0 0 0 $tbar-ribble-animation-border-frame !default;
 $tbar-ribble-animation-shadow-frame-end: 0 0 0 200px rgba(255, 255, 255, .12) !default;
+
 @mixin tbar-btn-animation {
   background-color: transparent;
   border-radius: 50%;
@@ -178,9 +176,9 @@ $tbar-ribble-animation-shadow-frame-end: 0 0 0 200px rgba(255, 255, 255, .12) !d
   0% {
     border-color: $tbar-ribble-animation-border-frame;
     box-shadow: $tbar-ribble-animation-shadow-frame;
-    }
+  }
 
   100% {
     box-shadow: $tbar-ribble-animation-shadow-frame-end;
-    }
- }
+  }
+}

package/styles/toolbar/_material-definition.scss

@@ -66,10 +66,10 @@ $tbar-btn-bgr-height: calc(100% - 11px) !default;
 $tbar-btn-nrml-height: calc(100% - 10px) !default;
 $tbar-btn-nrml-mrgn: 4px 0 !default;
 $tbar-v-btn-nrml-mrgn: 4px auto !default;
-$tbar-separator-nrml-mrgn: 7.5px 3px  !default;
-$tbar-separator-bgr-mrgn: 10px 5px  !default;
-$tbar-separator-vertical-bgr-mrgn: 5px 10px  !default;
-$tbar-separator-vertical-nrml-mrgn: 3px 7.5px  !default;
+$tbar-separator-nrml-mrgn: 7.5px 3px !default;
+$tbar-separator-bgr-mrgn: 10px 5px !default;
+$tbar-separator-vertical-bgr-mrgn: 5px 10px !default;
+$tbar-separator-vertical-nrml-mrgn: 3px 7.5px !default;
 $tbar-separator-nrml-height: calc(100% - 15px) !default;
 $tbar-separator-bgr-height: calc(100% - 20px) !default;
 $tbar-separator-nrml-minheight: 27px !default;
@@ -85,9 +85,9 @@ $tbar-btn-icon-nrml-height: 25px !default;
 $tbar-btn-icon-nrml-line-height: 25px !default;
 $tbar-left-item-line-height: 35px !default;
 $tbar-right-item-line-height: 24px !default;
-$tbar-btn-bgr-padding: $tbar-zero-value 6px  !default;
+$tbar-btn-bgr-padding: $tbar-zero-value 6px !default;
 $tbar-btn-bgr-focus-padding: 0 6px !default;
-$tbar-btn-nrml-padding: $tbar-zero-value 1.5px  !default;
+$tbar-btn-nrml-padding: $tbar-zero-value 1.5px !default;
 $tbar-pop-btn-bgr-padding: $tbar-zero-value 16px !default;
 $tbar-pop-btn-nrml-padding: $tbar-zero-value 16px !default;
 
@@ -110,7 +110,7 @@ $tbar-popup-vertical-rtl-border-width: 0 0 $border-size 0 !default;
 $tbar-item-pop-bg-color: transparent !default;
 
 $tbar-btn-weight: 400 !default;
-$tbar-btn-family: 'Roboto', 'Segoe UI', 'GeezaPro', 'DejaVu Serif' !default;;
+$tbar-btn-family: 'Roboto', 'Segoe UI', 'GeezaPro', 'DejaVu Serif' !default;
 $tbar-btn-font-size: 14px !default;
 $tbar-btn-txt-font-size: $tbar-btn-font-size !default;
 $tbar-hover-bg: rgba($grey-black, .12) !default;
@@ -118,7 +118,7 @@ $tbar-hover-border-color: rgba($grey-black, .12) !default;
 $tbar-focus-border-color: $tbar-hover-border-color !default;
 $tbar-focus-bg: $tbar-hover-bg !default;
 $tbar-default-icon-color: rgba($grey-light-font, .54) !default;
-$tbar-default-font: rgba($grey-light-font, .87)  !default;
+$tbar-default-font: rgba($grey-light-font, .87) !default;
 $tbar-hover-font: $tbar-default-font !default;
 $tbar-active-font-color: $tbar-default-font !default;
 $tbar-press-font: $tbar-default-font !default;
@@ -139,13 +139,12 @@ $tbar-ribble-animation-border-frame: rgba(255, 255, 255, .5) !default;
 $tbar-ribble-animation-shadow-frame: 0 0 0 0 $tbar-ribble-animation-border-frame !default;
 $tbar-ribble-animation-shadow-frame-end: 0 0 0 200px rgba(255, 255, 255, .12) !default;
 
-
 @mixin tbar-btn-animation {
   background-color: transparent;
   border-radius: 50%;
   border-width: 1px;
   box-sizing: border-box;
-  content: '' ;
+  content: '';
   height: 1px;
   left: 50%;
   position: absolute;
@@ -163,9 +162,9 @@ $tbar-ribble-animation-shadow-frame-end: 0 0 0 200px rgba(255, 255, 255, .12) !d
   0% {
     border-color: $tbar-ribble-animation-border-frame;
     box-shadow: $tbar-ribble-animation-shadow-frame;
-    }
+  }
 
   100% {
     box-shadow: $tbar-ribble-animation-shadow-frame-end;
-    }
- }
+  }
+}

package/styles/toolbar/_material3-definition.scss

@@ -1,5 +1,5 @@
 /*! Toolbar's bootstrap5 theme wise override definitions and variables */
-// sass-lint:disable-all
+/* stylelint-disable */
 $tbar-skin: 'bootstrap5' !default;
 
 //font definitions

package/styles/toolbar/_theme.scss

@@ -1,6 +1,7 @@
-@include export-module('toolbar-theme') {
+@include export-module('toolbar-theme') {
+
   /*! toolbar theme */
-  // sass-lint:disable no-vendor-prefixes
+  /* stylelint-disable property-no-vendor-prefix */
   .e-toolbar {
     -webkit-tap-highlight-color: $tbar-tab-highlight-color;
     background: $tbar-default-bg;
@@ -19,13 +20,11 @@
         border-width: $tbar-popup-vertical-rtl-border-width;
       }
 
-
       .e-toolbar-items .e-toolbar-item {
 
         &.e-separator {
           border-width: $tba-vertical-separator;
         }
-
       }
     }
 
@@ -158,9 +157,7 @@
               }
             }
           }
-
         }
-
       }
     }
 
@@ -446,7 +443,7 @@
         &::after {
           @include tbar-btn-animation-after;
         }
-     }
+      }
 
       &:hover {
         background: $tbar-hover-bg;
@@ -518,7 +515,7 @@
     .e-tbar-btn {
 
       &:active {
-        background:  $tbar-press-bg;
+        background: $tbar-press-bg;
         @if $tbar-skin == 'bootstrap5' {
           background: $tbar-active-bg;
         }

package/styles/toolbar/bootstrap-dark.css

@@ -9,6 +9,7 @@
 }
 
 /*! toolbar layout */
+/* stylelint-disable property-no-vendor-prefix */
 .e-bigger .e-toolbar,
 .e-toolbar.e-bigger {
   height: 50px;
@@ -374,8 +375,6 @@
   height: 40px;
   min-height: 40px;
   position: relative;
-  -ms-touch-action: none;
-      touch-action: none;
   -webkit-user-select: none;
       -ms-user-select: none;
           user-select: none;
@@ -819,6 +818,10 @@
 .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item:last-child {
   margin-right: 15px;
 }
+.e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content {
+  -ms-touch-action: pan-y pinch-zoom;
+      touch-action: pan-y pinch-zoom;
+}
 .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 15px;
 }
@@ -941,6 +944,10 @@
   bottom: auto;
   top: 0;
 }
+.e-toolbar.e-vertical .e-toolbar-items .e-vscroll-bar .e-vscroll-content {
+  -ms-touch-action: pan-x pinch-zoom;
+      touch-action: pan-x pinch-zoom;
+}
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-left,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-center,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-right {
@@ -990,6 +997,7 @@
 }
 
 /*! toolbar theme */
+/* stylelint-disable property-no-vendor-prefix */
 .e-toolbar {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   background: #131313;

package/styles/toolbar/bootstrap.css

@@ -10,6 +10,7 @@
 }
 
 /*! toolbar layout */
+/* stylelint-disable property-no-vendor-prefix */
 .e-bigger .e-toolbar,
 .e-toolbar.e-bigger {
   height: 50px;
@@ -375,8 +376,6 @@
   height: 40px;
   min-height: 40px;
   position: relative;
-  -ms-touch-action: none;
-      touch-action: none;
   -webkit-user-select: none;
       -ms-user-select: none;
           user-select: none;
@@ -820,6 +819,10 @@
 .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item:last-child {
   margin-right: 3px;
 }
+.e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content {
+  -ms-touch-action: pan-y pinch-zoom;
+      touch-action: pan-y pinch-zoom;
+}
 .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 3px;
 }
@@ -942,6 +945,10 @@
   bottom: auto;
   top: 0;
 }
+.e-toolbar.e-vertical .e-toolbar-items .e-vscroll-bar .e-vscroll-content {
+  -ms-touch-action: pan-x pinch-zoom;
+      touch-action: pan-x pinch-zoom;
+}
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-left,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-center,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-right {
@@ -991,6 +998,7 @@
 }
 
 /*! toolbar theme */
+/* stylelint-disable property-no-vendor-prefix */
 .e-toolbar {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   background: #f8f8f8;

package/styles/toolbar/bootstrap4.css

@@ -10,6 +10,7 @@
 }
 
 /*! toolbar layout */
+/* stylelint-disable property-no-vendor-prefix */
 .e-bigger .e-toolbar,
 .e-toolbar.e-bigger {
   height: 54px;
@@ -382,8 +383,6 @@
   height: 38px;
   min-height: 38px;
   position: relative;
-  -ms-touch-action: none;
-      touch-action: none;
   -webkit-user-select: none;
       -ms-user-select: none;
           user-select: none;
@@ -827,6 +826,10 @@
 .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item:last-child {
   margin-right: 12px;
 }
+.e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content {
+  -ms-touch-action: pan-y pinch-zoom;
+      touch-action: pan-y pinch-zoom;
+}
 .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 12px;
 }
@@ -949,6 +952,10 @@
   bottom: auto;
   top: 0;
 }
+.e-toolbar.e-vertical .e-toolbar-items .e-vscroll-bar .e-vscroll-content {
+  -ms-touch-action: pan-x pinch-zoom;
+      touch-action: pan-x pinch-zoom;
+}
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-left,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-center,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-right {
@@ -998,6 +1005,7 @@
 }
 
 /*! toolbar theme */
+/* stylelint-disable property-no-vendor-prefix */
 .e-toolbar {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   background: #f8f9fa;

package/styles/toolbar/bootstrap5-dark.css

@@ -8,7 +8,8 @@
     box-shadow: 0 0 0 200px rgba(255, 255, 255, 0.12);
   }
 }
-/*! component's theme wise override definitions and variables */ /*! Toolbar's bootstrap5 theme wise override definitions and variables */
+/*! component's theme wise override definitions and variables */ /* stylelint-disable-line no-empty-source */ /*! Toolbar's bootstrap5 theme wise override definitions and variables */
+/* stylelint-disable */
 /*! toolbar icons */
 .e-toolbar .e-popup-down-icon::before {
   content: "\e729";
@@ -20,6 +21,7 @@
 }
 
 /*! toolbar layout */
+/* stylelint-disable property-no-vendor-prefix */
 .e-bigger .e-toolbar,
 .e-toolbar.e-bigger {
   height: 46px;
@@ -363,8 +365,6 @@
   height: 38px;
   min-height: 38px;
   position: relative;
-  -ms-touch-action: none;
-      touch-action: none;
   -webkit-user-select: none;
       -ms-user-select: none;
           user-select: none;
@@ -805,6 +805,10 @@
 .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item:last-child {
   margin-right: 8px;
 }
+.e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content {
+  -ms-touch-action: pan-y pinch-zoom;
+      touch-action: pan-y pinch-zoom;
+}
 .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 8px;
 }
@@ -925,6 +929,10 @@
   bottom: auto;
   top: 0;
 }
+.e-toolbar.e-vertical .e-toolbar-items .e-vscroll-bar .e-vscroll-content {
+  -ms-touch-action: pan-x pinch-zoom;
+      touch-action: pan-x pinch-zoom;
+}
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-left,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-center,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-right {
@@ -974,6 +982,7 @@
 }
 
 /*! toolbar theme */
+/* stylelint-disable property-no-vendor-prefix */
 .e-toolbar {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   background: #282d31;

package/styles/toolbar/bootstrap5.css

@@ -8,7 +8,8 @@
     box-shadow: 0 0 0 200px rgba(255, 255, 255, 0.12);
   }
 }
-/*! component's theme wise override definitions and variables */ /*! Toolbar's bootstrap5 theme wise override definitions and variables */
+/*! component's theme wise override definitions and variables */ /* stylelint-disable-line no-empty-source */ /*! Toolbar's bootstrap5 theme wise override definitions and variables */
+/* stylelint-disable */
 /*! toolbar icons */
 .e-toolbar .e-popup-down-icon::before {
   content: "\e729";
@@ -20,6 +21,7 @@
 }
 
 /*! toolbar layout */
+/* stylelint-disable property-no-vendor-prefix */
 .e-bigger .e-toolbar,
 .e-toolbar.e-bigger {
   height: 46px;
@@ -363,8 +365,6 @@
   height: 38px;
   min-height: 38px;
   position: relative;
-  -ms-touch-action: none;
-      touch-action: none;
   -webkit-user-select: none;
       -ms-user-select: none;
           user-select: none;
@@ -805,6 +805,10 @@
 .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item:last-child {
   margin-right: 8px;
 }
+.e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content {
+  -ms-touch-action: pan-y pinch-zoom;
+      touch-action: pan-y pinch-zoom;
+}
 .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 8px;
 }
@@ -925,6 +929,10 @@
   bottom: auto;
   top: 0;
 }
+.e-toolbar.e-vertical .e-toolbar-items .e-vscroll-bar .e-vscroll-content {
+  -ms-touch-action: pan-x pinch-zoom;
+      touch-action: pan-x pinch-zoom;
+}
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-left,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-center,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-right {
@@ -974,6 +982,7 @@
 }
 
 /*! toolbar theme */
+/* stylelint-disable property-no-vendor-prefix */
 .e-toolbar {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   background: #f8f9fa;

package/styles/toolbar/fabric-dark.css

@@ -9,6 +9,7 @@
 }
 
 /*! toolbar layout */
+/* stylelint-disable property-no-vendor-prefix */
 .e-bigger .e-toolbar,
 .e-toolbar.e-bigger {
   height: 50px;
@@ -353,8 +354,6 @@
   height: 40px;
   min-height: 40px;
   position: relative;
-  -ms-touch-action: none;
-      touch-action: none;
   -webkit-user-select: none;
       -ms-user-select: none;
           user-select: none;
@@ -796,6 +795,10 @@
 .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item:last-child {
   margin-right: 3px;
 }
+.e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content {
+  -ms-touch-action: pan-y pinch-zoom;
+      touch-action: pan-y pinch-zoom;
+}
 .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 3px;
 }
@@ -917,6 +920,10 @@
   bottom: auto;
   top: 0;
 }
+.e-toolbar.e-vertical .e-toolbar-items .e-vscroll-bar .e-vscroll-content {
+  -ms-touch-action: pan-x pinch-zoom;
+      touch-action: pan-x pinch-zoom;
+}
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-left,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-center,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-right {
@@ -966,6 +973,7 @@
 }
 
 /*! toolbar theme */
+/* stylelint-disable property-no-vendor-prefix */
 .e-toolbar {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   background: #333232;

package/styles/toolbar/fabric.css

@@ -10,6 +10,7 @@
 }
 
 /*! toolbar layout */
+/* stylelint-disable property-no-vendor-prefix */
 .e-bigger .e-toolbar,
 .e-toolbar.e-bigger {
   height: 50px;
@@ -354,8 +355,6 @@
   height: 40px;
   min-height: 40px;
   position: relative;
-  -ms-touch-action: none;
-      touch-action: none;
   -webkit-user-select: none;
       -ms-user-select: none;
           user-select: none;
@@ -797,6 +796,10 @@
 .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item:last-child {
   margin-right: 3px;
 }
+.e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content {
+  -ms-touch-action: pan-y pinch-zoom;
+      touch-action: pan-y pinch-zoom;
+}
 .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 3px;
 }
@@ -918,6 +921,10 @@
   bottom: auto;
   top: 0;
 }
+.e-toolbar.e-vertical .e-toolbar-items .e-vscroll-bar .e-vscroll-content {
+  -ms-touch-action: pan-x pinch-zoom;
+      touch-action: pan-x pinch-zoom;
+}
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-left,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-center,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-right {
@@ -967,6 +974,7 @@
 }
 
 /*! toolbar theme */
+/* stylelint-disable property-no-vendor-prefix */
 .e-toolbar {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   background: #fff;

package/styles/toolbar/fluent-dark.css

@@ -8,7 +8,7 @@
     box-shadow: 0 0 0 200px rgba(255, 255, 255, 0.12);
   }
 }
-/*! component's theme wise override definitions and variables */
+/*! component's theme wise override definitions and variables */ /* stylelint-disable-line no-empty-source */
 /*! toolbar icons */
 .e-toolbar .e-popup-down-icon::before {
   content: "\e71c";
@@ -20,6 +20,7 @@
 }
 
 /*! toolbar layout */
+/* stylelint-disable property-no-vendor-prefix */
 .e-bigger .e-toolbar,
 .e-toolbar.e-bigger {
   height: 48px;
@@ -96,7 +97,7 @@
 }
 .e-bigger .e-toolbar .e-toolbar-item .e-btn.e-tbar-btn .e-icons.e-btn-icon,
 .e-toolbar.e-bigger .e-toolbar-item .e-btn.e-tbar-btn .e-icons.e-btn-icon {
-  line-height: 18px;
+  line-height: 15px;
   min-height: 18px;
   min-width: 13px;
 }
@@ -309,7 +310,7 @@
 }
 .e-bigger .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-btn.e-tbar-btn .e-icons.e-btn-icon,
 .e-toolbar.e-bigger.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-btn.e-tbar-btn .e-icons.e-btn-icon {
-  line-height: 18px;
+  line-height: 15px;
   min-height: 18px;
   min-width: 13px;
 }
@@ -357,8 +358,6 @@
   height: 38px;
   min-height: 38px;
   position: relative;
-  -ms-touch-action: none;
-      touch-action: none;
   -webkit-user-select: none;
       -ms-user-select: none;
           user-select: none;
@@ -472,7 +471,7 @@
   vertical-align: middle;
 }
 .e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-btn.e-tbar-btn .e-icons.e-btn-icon:not(.e-toolbar-pop) {
-  line-height: 16px;
+  line-height: 13px;
   min-height: 16px;
   min-width: 12px;
   padding: 0;
@@ -700,7 +699,7 @@
   line-height: 22px;
 }
 .e-toolbar .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon {
-  line-height: 16px;
+  line-height: 13px;
   min-height: 16px;
 }
 .e-toolbar .e-toolbar-items {
@@ -795,6 +794,10 @@
 .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item:last-child {
   margin-right: 8px;
 }
+.e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content {
+  -ms-touch-action: pan-y pinch-zoom;
+      touch-action: pan-y pinch-zoom;
+}
 .e-toolbar .e-toolbar-items .e-hscroll-bar .e-hscroll-content > .e-toolbar-item:last-child {
   margin-right: 8px;
 }
@@ -915,6 +918,10 @@
   bottom: auto;
   top: 0;
 }
+.e-toolbar.e-vertical .e-toolbar-items .e-vscroll-bar .e-vscroll-content {
+  -ms-touch-action: pan-x pinch-zoom;
+      touch-action: pan-x pinch-zoom;
+}
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-left,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-center,
 .e-toolbar.e-vertical .e-toolbar-items.e-tbar-pos .e-toolbar-right {
@@ -964,6 +971,7 @@
 }
 
 /*! toolbar theme */
+/* stylelint-disable property-no-vendor-prefix */
 .e-toolbar {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   background: #252423;