Orbit elements hide for small

3 new variables to control if various elements will be shown on mobile.

$orbit-nav-hide-for-small: true;
$orbit-bullet-hide-for-small: true;
$orbit-timer-hide-for-small: true;

diff --git a/scss/foundation/_settings.scss b/scss/foundation/_settings.scss
index 0a6197e443171d41d099a5c0b4b80a1202afdd06..339489d2c24e8a5aec5aa5b8c2f55ca60e1a9a15 100644 (file)
--- a/scss/foundation/_settings.scss
+++ b/scss/foundation/_settings.scss
@@ -736,6 +736,11 @@
 // $orbit-animation-speed: 500ms;
 // $orbit-animation-ease: ease-in-out;
 
+// Hide controls on small
+// $orbit-nav-hide-for-small: true;
+// $orbit-bullet-hide-for-small: true;
+// $orbit-timer-hide-for-small: true;
+
 // Graceful Loading Wrapper and preloader
 // $wrapper-class: "slideshow-wrapper";
 // $preloader-class: "preloader";

diff --git a/scss/foundation/components/_orbit.scss b/scss/foundation/components/_orbit.scss
index 549d1b90ae8502ee84aedfdb9f4ab60a5dc325a6..f01831c13b04fa94e65e720bac9073400c168dae 100644 (file)
--- a/scss/foundation/components/_orbit.scss
+++ b/scss/foundation/components/_orbit.scss
@@ -45,6 +45,11 @@ $orbit-animation-ease: ease-in-out !default;
 $wrapper-class: "slideshow-wrapper" !default;
 $preloader-class: "preloader" !default;
 
+// Hide controls on small
+$orbit-nav-hide-for-small: true !default;
+$orbit-bullet-hide-for-small: true !default;
+$orbit-timer-hide-for-small: true !default;
+
 // CSS Transform 
 // This function is needed in order to put in all of the browser prefixes. 
 // The normal tranform attribute still does not work properly across all browsers. 
@@ -382,10 +387,16 @@ $preloader-class: "preloader" !default;
                 transform:none !important;
                 transition:none !important;
             }
-            .orbit-timer,
-            .orbit-next,
-            .orbit-prev,
-            .orbit-bullets {display: none;}
+
+            @if $orbit-timer-hide-for-small {
+                .orbit-timer{display: none;}
+            }
+            @if $orbit-nav-hide-for-small {
+                .orbit-next,.orbit-prev{display: none;}
+            }
+            @if $orbit-bullet-hide-for-small {
+                .orbit-bullets{display: none;}
+            }
         }
     }