@syncfusion/ej2-angular-navigations 20.2.38-ngcc → 20.2.38

package/styles/context-menu/icons/_fusionnew.scss

@@ -0,0 +1,32 @@
+@include export-module('context-menu-fusionnew-icons') {
+  /*! contextmenu layout */
+  .e-contextmenu-wrapper,
+  .e-contextmenu-container {
+    @at-root {
+      & ul {
+        & .e-menu-item  {
+          & .e-previous {
+            &::before {
+              content: '\e773';
+            }
+          }
+
+          & .e-caret {
+            &::before {
+              content: '\e748';
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .e-rtl.e-contextmenu-wrapper .e-menu-item,
+  .e-rtl.e-contextmenu-container .e-menu-item {
+    & .e-caret {
+      &::before {
+        content: '\e765';
+      }
+    }
+  }
+}

package/styles/context-menu/icons/_highcontrast-light.scss

@@ -0,0 +1,32 @@
+@include export-module('context-menu-highcontrast-light-icons') {
+  /*! contextmenu layout */
+  .e-contextmenu-wrapper,
+  .e-contextmenu-container {
+    @at-root {
+      & ul {
+        & .e-menu-item  {
+          & .e-previous {
+            &::before {
+              content: '\e962';
+            }
+          }
+
+          & .e-caret {
+            &::before {
+              content: '\e219';
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .e-rtl.e-contextmenu-wrapper .e-menu-item,
+  .e-rtl.e-contextmenu-container .e-menu-item {
+    & .e-caret {
+      &::before {
+        content: '\e98f';
+      }
+    }
+  }
+}

package/styles/context-menu/icons/_highcontrast.scss

@@ -0,0 +1,32 @@
+@include export-module('context-menu-highcontrast-icons') {
+  /*! contextmenu layout */
+  .e-contextmenu-wrapper,
+  .e-contextmenu-container {
+    @at-root {
+      & ul {
+        & .e-menu-item  {
+          & .e-previous {
+            &::before {
+              content: '\e962';
+            }
+          }
+
+          & .e-caret {
+            &::before {
+              content: '\e219';
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .e-rtl.e-contextmenu-wrapper .e-menu-item,
+  .e-rtl.e-contextmenu-container .e-menu-item {
+    & .e-caret {
+      &::before {
+        content: '\e98f';
+      }
+    }
+  }
+}

package/styles/context-menu/icons/_material-dark.scss

@@ -0,0 +1,32 @@
+@include export-module('context-menu-material-dark-icons') {
+  /*! contextmenu layout */
+  .e-contextmenu-wrapper,
+  .e-contextmenu-container {
+    @at-root {
+      & ul {
+        & .e-menu-item  {
+          & .e-previous {
+            &::before {
+              content: '\e977';
+            }
+          }
+
+          & .e-caret {
+            &::before {
+              content: '\e956';
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .e-rtl.e-contextmenu-wrapper .e-menu-item,
+  .e-rtl.e-contextmenu-container .e-menu-item {
+    & .e-caret {
+      &::before {
+        content: '\e937';
+      }
+    }
+  }
+}

package/styles/context-menu/icons/_material.scss

@@ -0,0 +1,32 @@
+@include export-module('context-menu-material-icons') {
+  /*! contextmenu layout */
+  .e-contextmenu-wrapper,
+  .e-contextmenu-container {
+    @at-root {
+      & ul {
+        & .e-menu-item  {
+          & .e-previous {
+            &::before {
+              content: '\e977';
+            }
+          }
+
+          & .e-caret {
+            &::before {
+              content: '\e956';
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .e-rtl.e-contextmenu-wrapper .e-menu-item,
+  .e-rtl.e-contextmenu-container .e-menu-item {
+    & .e-caret {
+      &::before {
+        content: '\e937';
+      }
+    }
+  }
+}

package/styles/context-menu/icons/_material3.scss

@@ -0,0 +1,32 @@
+@include export-module('context-menu-material3-icons') {
+  /*! contextmenu layout */
+  .e-contextmenu-wrapper,
+  .e-contextmenu-container {
+    @at-root {
+      & ul {
+        & .e-menu-item  {
+          & .e-previous {
+            &::before {
+              content: '\e773';
+            }
+          }
+
+          & .e-caret {
+            &::before {
+              content: '\e748';
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .e-rtl.e-contextmenu-wrapper .e-menu-item,
+  .e-rtl.e-contextmenu-container .e-menu-item {
+    & .e-caret {
+      &::before {
+        content: '\e765';
+      }
+    }
+  }
+}

package/styles/context-menu/icons/_tailwind-dark.scss

@@ -0,0 +1,32 @@
+@include export-module('context-menu-tailwind-dark-icons') {
+  /*! contextmenu layout */
+  .e-contextmenu-wrapper,
+  .e-contextmenu-container {
+    @at-root {
+      & ul {
+        & .e-menu-item  {
+          & .e-previous {
+            &::before {
+              content: '\e773';
+            }
+          }
+
+          & .e-caret {
+            &::before {
+              content: '\e748';
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .e-rtl.e-contextmenu-wrapper .e-menu-item,
+  .e-rtl.e-contextmenu-container .e-menu-item {
+    & .e-caret {
+      &::before {
+        content: '\e765';
+      }
+    }
+  }
+}

package/styles/context-menu/icons/_tailwind.scss

@@ -0,0 +1,32 @@
+@include export-module('context-menu-tailwind-icons') {
+  /*! contextmenu layout */
+  .e-contextmenu-wrapper,
+  .e-contextmenu-container {
+    @at-root {
+      & ul {
+        & .e-menu-item  {
+          & .e-previous {
+            &::before {
+              content: '\e773';
+            }
+          }
+
+          & .e-caret {
+            &::before {
+              content: '\e748';
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .e-rtl.e-contextmenu-wrapper .e-menu-item,
+  .e-rtl.e-contextmenu-container .e-menu-item {
+    & .e-caret {
+      &::before {
+        content: '\e765';
+      }
+    }
+  }
+}

package/styles/context-menu/material-dark.scss

@@ -1 +1,7 @@
-@import 'ej2-navigations/styles/context-menu/material-dark.scss';
+@import 'ej2-base/styles/material-dark-definition.scss';
+@import '../h-scroll/material-dark-definition.scss';
+@import '../v-scroll/material-dark-definition.scss';
+@import 'ej2-popups/styles/popup/material-dark-definition.scss';
+@import 'material-dark-definition.scss';
+@import 'icons/material-dark.scss';
+@import 'all.scss';

package/styles/context-menu/material.scss

@@ -1 +1,7 @@
-@import 'ej2-navigations/styles/context-menu/material.scss';
+@import 'ej2-base/styles/material-definition.scss';
+@import '../h-scroll/material-definition.scss';
+@import '../v-scroll/material-definition.scss';
+@import 'ej2-popups/styles/popup/material-definition.scss';
+@import 'material-definition.scss';
+@import 'icons/material.scss';
+@import 'all.scss';

package/styles/context-menu/tailwind-dark.scss

@@ -1 +1,7 @@
-@import 'ej2-navigations/styles/context-menu/tailwind-dark.scss';
+@import 'ej2-base/styles/tailwind-dark-definition.scss';
+@import '../h-scroll/tailwind-dark-definition.scss';
+@import '../v-scroll/tailwind-dark-definition.scss';
+@import 'ej2-popups/styles/popup/tailwind-dark-definition.scss';
+@import 'tailwind-dark-definition.scss';
+@import 'icons/tailwind-dark.scss';
+@import 'all.scss';

package/styles/context-menu/tailwind.scss

@@ -1 +1,7 @@
-@import 'ej2-navigations/styles/context-menu/tailwind.scss';
+@import 'ej2-base/styles/tailwind-definition.scss';
+@import '../h-scroll/tailwind-definition.scss';
+@import '../v-scroll/tailwind-definition.scss';
+@import 'ej2-popups/styles/popup/tailwind-definition.scss';
+@import 'tailwind-definition.scss';
+@import 'icons/tailwind.scss';
+@import 'all.scss';

package/styles/fluent-dark.css

@@ -2776,7 +2776,7 @@
   padding: 6px;
 }
 .e-carousel .e-carousel-indicators .e-indicator-bars .e-indicator-bar .e-indicator div {
-  border: 1px solid rgba(27, 26, 25, 0.4);
+  border: 1px solid rgba(255, 255, 255, 0.4);
   border-radius: 50%;
   height: 12px;
   transition-duration: 0.6s;
@@ -2797,7 +2797,7 @@
 .e-carousel .e-carousel-navigators .e-previous .e-btn:not(:disabled) .e-btn-icon,
 .e-carousel .e-carousel-navigators .e-next .e-btn:not(:disabled) .e-btn-icon,
 .e-carousel .e-carousel-navigators .e-play-pause .e-btn:not(:disabled) .e-btn-icon {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-carousel .e-carousel-navigators .e-previous .e-btn:not(:disabled):active, .e-carousel .e-carousel-navigators .e-previous .e-btn:not(:disabled):focus, .e-carousel .e-carousel-navigators .e-previous .e-btn:not(:disabled):hover,
 .e-carousel .e-carousel-navigators .e-next .e-btn:not(:disabled):active,
@@ -2806,7 +2806,7 @@
 .e-carousel .e-carousel-navigators .e-play-pause .e-btn:not(:disabled):active,
 .e-carousel .e-carousel-navigators .e-play-pause .e-btn:not(:disabled):focus,
 .e-carousel .e-carousel-navigators .e-play-pause .e-btn:not(:disabled):hover {
-  background-color: rgba(27, 26, 25, 0.4);
+  background-color: rgba(255, 255, 255, 0.4);
   outline: none;
 }
 .e-carousel .e-carousel-indicators .e-indicator-bar .e-indicator {
@@ -2815,8 +2815,8 @@
   box-shadow: none;
 }
 .e-carousel .e-carousel-indicators .e-indicator-bar .e-indicator div {
-  background-color: #1b1a19;
-  border-color: #1b1a19;
+  background-color: #fff;
+  border-color: #fff;
 }
 .e-carousel .e-carousel-indicators .e-indicator-bar .e-indicator:active, .e-carousel .e-carousel-indicators .e-indicator-bar .e-indicator:focus, .e-carousel .e-carousel-indicators .e-indicator-bar .e-indicator:hover {
   background-color: transparent;
@@ -6421,20 +6421,20 @@
   border-radius: 0;
 }
 .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:hover .e-tab-text, .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:hover .e-tab-icon {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active .e-text-wrap {
   margin-top: 0;
 }
 .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active .e-tab-text,
 .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active .e-tab-icon {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active .e-close-icon {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-fill .e-tab-header .e-toolbar-item.e-active .e-close-icon:hover {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-fill .e-tab-header.e-horizontal-bottom {
   border-bottom: 0;
@@ -6501,7 +6501,7 @@
   background: inherit;
 }
 .e-tab.e-background .e-tab-header .e-indicator {
-  background: #1b1a19;
+  background: #fff;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item {
   border: 0;
@@ -6518,24 +6518,24 @@
   color: #004578;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap .e-close-icon:hover {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
   background: #005ba1;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap:hover .e-tab-text,
 .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap:hover .e-tab-icon {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap:hover .e-tab-text,
 .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap:hover .e-tab-icon,
 .e-tab.e-background .e-tab-header .e-toolbar-item .e-tab-wrap:hover .e-close-icon {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active {
   border: 0;
   margin: 0;
-  background: #1b1a19;
+  background: #fff;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
   background: none;
@@ -6548,7 +6548,7 @@
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:hover .e-tab-text,
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:hover .e-tab-icon {
-  color: #1b1a19;
+  color: #fff;
   color: #0078d4;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:focus {
@@ -6556,20 +6556,20 @@
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:focus .e-tab-text,
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:focus .e-tab-icon {
-  color: #1b1a19;
+  color: #fff;
   color: #0078d4;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-tab-text,
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-tab-icon {
-  color: #1b1a19;
+  color: #fff;
   color: #0078d4;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-close-icon {
-  color: #1b1a19;
+  color: #fff;
   color: #0078d4;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active .e-close-icon:hover {
-  color: #1b1a19;
+  color: #fff;
   color: #0078d4;
 }
 .e-tab.e-background .e-tab-header .e-toolbar-item.e-active.e-itop .e-tab-wrap, .e-tab.e-background .e-tab-header .e-toolbar-item.e-active.e-ibottom .e-tab-wrap {
@@ -6598,7 +6598,7 @@
 .e-tab.e-background .e-tab-header .e-toolbar-pop .e-toolbar-item .e-tab-wrap:hover .e-tab-text,
 .e-tab.e-background .e-tab-header .e-toolbar-pop .e-toolbar-item .e-tab-wrap:hover .e-tab-icon,
 .e-tab.e-background .e-tab-header .e-toolbar-pop .e-toolbar-item .e-tab-wrap:hover .e-close-icon {
-  color: #1b1a19;
+  color: #fff;
   color: #f3f2f1;
 }
 .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav,
@@ -6607,22 +6607,22 @@
 }
 .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav .e-nav-arrow,
 .e-tab.e-background .e-tab-header .e-scroll-nav .e-nav-arrow {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav .e-nav-arrow:hover,
 .e-tab.e-background .e-tab-header .e-scroll-nav .e-nav-arrow:hover {
   background: inherit;
   background: #005ba1;
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav:focus .e-nav-arrow,
 .e-tab.e-background .e-tab-header .e-scroll-nav:focus .e-nav-arrow {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav:focus .e-nav-arrow:hover,
 .e-tab.e-background .e-tab-header .e-scroll-nav:focus .e-nav-arrow:hover {
   background: inherit;
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav:active::after,
 .e-tab.e-background .e-tab-header .e-scroll-nav:active::after {
@@ -6630,7 +6630,7 @@
 }
 .e-tab.e-background .e-tab-header .e-hscroll:not(.e-scroll-device) .e-scroll-nav.e-overlay .e-nav-arrow,
 .e-tab.e-background .e-tab-header .e-scroll-nav.e-overlay .e-nav-arrow {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav),
 .e-tab.e-background .e-tab-header .e-hor-nav {
@@ -6640,21 +6640,21 @@
 .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav) .e-popup-down-icon,
 .e-tab.e-background .e-tab-header .e-hor-nav .e-popup-up-icon,
 .e-tab.e-background .e-tab-header .e-hor-nav .e-popup-down-icon {
-  color: #1b1a19;
-  color: #1b1a19;
+  color: #fff;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav) .e-popup-up-icon:hover,
 .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav) .e-popup-down-icon:hover,
 .e-tab.e-background .e-tab-header .e-hor-nav .e-popup-up-icon:hover,
 .e-tab.e-background .e-tab-header .e-hor-nav .e-popup-down-icon:hover {
   background: inherit;
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav):focus .e-popup-up-icon,
 .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav):focus .e-popup-down-icon,
 .e-tab.e-background .e-tab-header .e-hor-nav:focus .e-popup-up-icon,
 .e-tab.e-background .e-tab-header .e-hor-nav:focus .e-popup-down-icon {
-  color: #1b1a19;
+  color: #fff;
   background: #005ba1;
 }
 .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav):active::after,
@@ -6667,13 +6667,13 @@
 }
 .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav).e-nav-active .e-popup-up-icon,
 .e-tab.e-background .e-tab-header .e-hor-nav.e-nav-active .e-popup-up-icon {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav).e-nav-active .e-popup-up-icon,
 .e-tab.e-background .e-tab-header .e-hor-nav:not(.e-expended-nav).e-nav-active .e-popup-down-icon,
 .e-tab.e-background .e-tab-header .e-hor-nav.e-nav-active .e-popup-up-icon,
 .e-tab.e-background .e-tab-header .e-hor-nav.e-nav-active .e-popup-down-icon {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header.e-vertical .e-scroll-nav .e-nav-arrow {
   border: 0;
@@ -6685,7 +6685,7 @@
   background: none;
 }
 .e-tab.e-background .e-tab-header.e-vertical .e-scroll-nav:hover .e-nav-arrow {
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background .e-tab-header.e-vertical .e-hor-nav:focus .e-popup-up-icon,
 .e-tab.e-background .e-tab-header.e-vertical .e-hor-nav:focus .e-popup-down-icon {
@@ -6743,10 +6743,10 @@
 .e-tab.e-background.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus .e-tab-text,
 .e-tab.e-background.e-focused .e-tab-header .e-toolbar-item .e-tab-wrap:focus .e-close-icon {
   color: #004578;
-  color: #1b1a19;
+  color: #fff;
 }
 .e-tab.e-background.e-focused .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:focus {
-  background: #1b1a19;
+  background: #fff;
 }
 .e-tab.e-background.e-focused .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:focus .e-tab-text,
 .e-tab.e-background.e-focused .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:focus .e-tab-icon {
@@ -6754,7 +6754,7 @@
   color: #0078d4;
 }
 .e-tab.e-background.e-focused .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:hover {
-  background: #1b1a19;
+  background: #fff;
 }
 .e-tab.e-background.e-focused .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:focus .e-tab-text,
 .e-tab.e-background.e-focused .e-tab-header .e-toolbar-item.e-active .e-tab-wrap:focus .e-tab-icon,
@@ -7640,8 +7640,8 @@
 }
 .e-treeview.e-drag-item .e-drop-count {
   background-color: #0078d4;
-  border-color: #1b1a19;
-  color: #1b1a19;
+  border-color: #fff;
+  color: #fff;
 }
 .e-treeview.e-drag-item.e-rtl .e-sibling {
   border: 1px solid #0078d4;

package/styles/h-scroll/_all.scss

@@ -0,0 +1,2 @@
+@import 'layout.scss';
+@import 'theme.scss';

package/styles/h-scroll/_bootstrap-dark-definition.scss

@@ -0,0 +1,49 @@
+//default 
+$hscroll-skin: 'bootstrap' !default;
+$hscroll-default-bg: $grey-darker !default;
+$hscroll-nav-nrml-minheight: 40px !default;
+$hscroll-nav-bgr-minheight: 50px !default;
+$hscroll-mob-nav-nrml-width: 50px !default;
+$hscroll-device-arrow-width: 50px !default;
+$hscroll-device-arrow-size: 14px !default;
+$hscroll-device-arrow-size-bigger: 14px !default;
+$hscroll-overlay-opacity: .5 !default;
+$hscroll-device-arrow-border-color: $default-border-color !default;
+$hscroll-device-arrow-rtl-box-shadow: 4px 0 8px 0 rgba($shadow, .06) !default;
+$hscroll-device-arrow-bg: $hscroll-default-bg !default;
+$hscroll-device-arrow-border-size: 0 !default;
+$hscroll-device-arrow-box-shadow: -4px 0 8px 0 rgba($shadow , .6) !default;
+$hscroll-device-arrow-color: $default-icon-color !default;
+$hscroll-overlay-bg: $hscroll-default-bg !default;
+$hscroll-overlay-start: rgba($hscroll-overlay-bg, .0001) !default;
+$hscroll-overlay-end: rgba($hscroll-overlay-bg, $hscroll-overlay-opacity) !default;
+$hscroll-right-bg: linear-gradient(to right, $hscroll-overlay-start 0, $hscroll-overlay-end 100%) !default;
+$hscroll-left-bg: linear-gradient(to right, $hscroll-overlay-end 0, $hscroll-overlay-start 100%) !default;
+$hscroll-border-size: $border-size !default;
+$hscroll-border-type: solid !default;
+$hscroll-hover-font: $hover-font-color !default;
+$hscroll-active-font-color: $active-font-color !default;
+$hscroll-nav-nrml-width: 40px !default;
+$hscroll-nav-bgr-width: 50px !default;
+$hscroll-nrml-padding: 0 $hscroll-nav-nrml-width !default;
+$hscroll-bgr-padding: 0 $hscroll-nav-bgr-width !default;
+$hscroll-box-shadow: none !default;
+
+$hscroll-default-icon-color: $grey-dark-font !default;
+$hscroll-hover-bg: $grey-light !default;
+$hscroll-press-bg: $grey-dark !default;
+$hscroll-default-border: $grey-99 !default;
+$hscroll-focus-border: 0 !default;
+$hscroll-active-border: 0 !default;
+$hscroll-hover-border: 0 !default;
+$hscroll-hover-border-color: '' !default;
+$hscroll-active-box-shadow: inset 0 3px 5px rgba(0 , 0 , 0 , .125) !default;
+
+@mixin hscroll-btn-animation {
+  content: '';
+}
+
+@mixin hscroll-btn-animation-after {
+  content: '';
+}
+//enddefault

package/styles/h-scroll/_bootstrap-definition.scss

@@ -0,0 +1,50 @@
+/*! component's theme wise override definitions and variables */
+$hscroll-skin: 'bootstrap' !default;
+$hscroll-border-type: solid !default;
+$hscroll-border-size: $border-size !default;
+$hscroll-hover-font: $hover-font-color  !default;
+$hscroll-active-font-color: $active-font-color  !default;
+$hscroll-default-bg: $grey-f8 !default;
+$hscroll-nav-nrml-minheight: 40px !default;
+$hscroll-nav-bgr-minheight: 50px !default;
+$hscroll-mob-nav-nrml-width: 50px !default;
+$hscroll-nav-nrml-width: 40px !default;
+$hscroll-nav-bgr-width: 50px !default;
+$hscroll-nrml-padding: 0 $hscroll-nav-nrml-width !default;
+$hscroll-bgr-padding: 0 $hscroll-nav-bgr-width !default;
+$hscroll-box-shadow: none !default;
+$hscroll-overlay-opacity: .5 !default;
+$hscroll-overlay-bg: $grey-white !default;
+$hscroll-overlay-start: rgba($hscroll-overlay-bg, 0) !default;
+$hscroll-overlay-end: rgba($hscroll-overlay-bg, 1) !default;
+$hscroll-right-bg: linear-gradient(-270deg, $hscroll-overlay-start 0%, $hscroll-overlay-end 100%) !default;
+$hscroll-left-bg:  linear-gradient(-270deg, $hscroll-overlay-end 0%, $hscroll-overlay-start 100%) !default;
+
+$hscroll-device-arrow-box-shadow: -4px 0 8px 0 rgba($shadow, .06) !default;
+$hscroll-device-arrow-rtl-box-shadow: 4px 0 8px 0 rgba($shadow, .06) !default;
+$hscroll-device-arrow-bg: $grey-f8 !default;
+$hscroll-device-arrow-border-size: 1px !default;
+$hscroll-device-arrow-border-color: $grey-cc !default;
+$hscroll-device-arrow-color: $brand-primary !default;
+$hscroll-device-arrow-size: 14px !default;
+$hscroll-device-arrow-size-bigger: 14px !default;
+$hscroll-device-arrow-width: 52px !default;
+
+$hscroll-default-icon-color: $grey-light-font !default;
+$hscroll-hover-bg: $grey-e6 !default;
+$hscroll-press-bg: $grey-e6 !default;
+$hscroll-default-border: $grey-cc !default;
+$hscroll-focus-border: 0 !default;
+$hscroll-active-border: 0 !default;
+$hscroll-hover-border: 0 !default;
+$hscroll-hover-border-color: '' !default;
+$hscroll-active-box-shadow: inset 0 3px 5px rgba(0 , 0 , 0 , .125) !default;
+
+
+@mixin hscroll-btn-animation {
+  content: '';
+}
+
+@mixin hscroll-btn-animation-after {
+  content: '';
+}