Merge pull request #43 from mikejacobson/bs4-mobile

mikejacobson · web-flow · commit 3c3a441b4f5e · 2017-10-25T06:32:58.000-07:00
Add small device support when using Bootstrap 4
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "jquery-bootstrap-scrolling-tabs",
-  "version": "2.1.1",
+  "version": "2.2.1",
   "main": [
     "./dist/jquery.scrolling-tabs.js",
     "./dist/jquery.scrolling-tabs.css"
diff --git a/dist/jquery.scrolling-tabs.css b/dist/jquery.scrolling-tabs.css
@@ -1,6 +1,6 @@
 /**
  * jquery-bootstrap-scrolling-tabs
- * @version v2.1.1
+ * @version v2.2.1
  * @link https://github.com/mikejacobson/jquery-bootstrap-scrolling-tabs
  * @author Mike Jacobson <michaeljjacobson1@gmail.com>
  * @license MIT License, http://www.opensource.org/licenses/MIT
@@ -13,6 +13,10 @@
   .scrtabs-tab-container .tab-content {
     clear: left; }
 
+.scrtabs-tab-container.scrtabs-bootstrap4 .scrtabs-tabs-movable-container > .navbar-nav {
+  -ms-flex-direction: row;
+  flex-direction: row; }
+
 .scrtabs-tabs-fixed-container {
   float: left;
   height: 42px;
diff --git a/dist/jquery.scrolling-tabs.js b/dist/jquery.scrolling-tabs.js
@@ -1,6 +1,6 @@
 /**
  * jquery-bootstrap-scrolling-tabs
- * @version v2.1.1
+ * @version v2.2.1
  * @link https://github.com/mikejacobson/jquery-bootstrap-scrolling-tabs
  * @author Mike Jacobson <michaeljjacobson1@gmail.com>
  * @license MIT License, http://www.opensource.org/licenses/MIT
@@ -248,6 +248,7 @@
     DATA_KEY_IS_MOUSEDOWN: 'scrtabsismousedown',
   
     CSS_CLASSES: {
+      BOOTSTRAP4: 'scrtabs-bootstrap4',
       RTL: 'scrtabs-rtl',
       SCROLL_ARROW_DISABLE: 'scrtabs-disable'
     },
@@ -434,6 +435,10 @@
           $tabsContainer.addClass(CONSTANTS.CSS_CLASSES.RTL);
         }
   
+        if (stc.usingBootstrap4) {
+          $tabsContainer.addClass(CONSTANTS.CSS_CLASSES.BOOTSTRAP4);
+        }
+  
         stc.$fixedContainer = $tabsContainer.find('.scrtabs-tabs-fixed-container');
         $leftArrow = stc.$fixedContainer.prev();
         $rightArrow = stc.$fixedContainer.next();
@@ -941,8 +946,6 @@
           minPos = smv.getMinPos(),
           leftOrRightVal;
   
-      var leftOrRight = stc.rtl ? 'right' : 'left';
-  
       if (stc.movableContainerLeftPos > 0) {
         stc.movableContainerLeftPos = 0;
       } else if (stc.movableContainerLeftPos < minPos) {
diff --git a/dist/jquery.scrolling-tabs.min.css b/dist/jquery.scrolling-tabs.min.css
diff --git a/dist/jquery.scrolling-tabs.min.js b/dist/jquery.scrolling-tabs.min.js
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "jquery-bootstrap-scrolling-tabs",
-  "version": "2.1.1",
+  "version": "2.2.1",
   "description": "jQuery plugin for scrollable Bootstrap Tabs",
   "homepage": "https://github.com/mikejacobson/jquery-bootstrap-scrolling-tabs",
   "bugs": "https://github.com/mikejacobson/jquery-bootstrap-scrolling-tabs/issues",
diff --git a/src/js/constants.js b/src/js/constants.js
@@ -10,6 +10,7 @@ var CONSTANTS = {
   DATA_KEY_IS_MOUSEDOWN: 'scrtabsismousedown',
 
   CSS_CLASSES: {
+    BOOTSTRAP4: 'scrtabs-bootstrap4',
     RTL: 'scrtabs-rtl',
     SCROLL_ARROW_DISABLE: 'scrtabs-disable'
   },
diff --git a/src/js/elementsHandler.js b/src/js/elementsHandler.js
@@ -130,6 +130,10 @@ function ElementsHandler(scrollingTabsControl) {
         $tabsContainer.addClass(CONSTANTS.CSS_CLASSES.RTL);
       }
 
+      if (stc.usingBootstrap4) {
+        $tabsContainer.addClass(CONSTANTS.CSS_CLASSES.BOOTSTRAP4);
+      }
+
       stc.$fixedContainer = $tabsContainer.find('.scrtabs-tabs-fixed-container');
       $leftArrow = stc.$fixedContainer.prev();
       $rightArrow = stc.$fixedContainer.next();
diff --git a/src/js/header.js b/src/js/header.js
@@ -1,6 +1,6 @@
 /**
  * jquery-bootstrap-scrolling-tabs
- * @version v2.1.1
+ * @version v2.2.1
  * @link https://github.com/mikejacobson/jquery-bootstrap-scrolling-tabs
  * @author Mike Jacobson <michaeljjacobson1@gmail.com>
  * @license MIT License, http://www.opensource.org/licenses/MIT
diff --git a/src/js/scrollMovement.js b/src/js/scrollMovement.js
@@ -277,8 +277,6 @@ function ScrollMovement(scrollingTabsControl) {
         minPos = smv.getMinPos(),
         leftOrRightVal;
 
-    var leftOrRight = stc.rtl ? 'right' : 'left';
-
     if (stc.movableContainerLeftPos > 0) {
       stc.movableContainerLeftPos = 0;
     } else if (stc.movableContainerLeftPos < minPos) {
diff --git a/src/scss/jquery.scrolling-tabs.scss b/src/scss/jquery.scrolling-tabs.scss
@@ -21,6 +21,11 @@ $scrtabs-background-color-hover: rgb(238, 238, 238) !default;
   }
 }
 
+.scrtabs-tab-container.scrtabs-bootstrap4 .scrtabs-tabs-movable-container > .navbar-nav {
+  -ms-flex-direction: row;
+  flex-direction: row;
+}
+
 .scrtabs-tabs-fixed-container {
   float: left;
   height: $scrtabs-tabs-height;

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "jquery-bootstrap-scrolling-tabs",`
`3`		`- "version": "2.1.1",`
	`3`	`+ "version": "2.2.1",`
`4`	`4`	`"main": [`
`5`	`5`	`"./dist/jquery.scrolling-tabs.js",`
`6`	`6`	`"./dist/jquery.scrolling-tabs.css"`