foundation-rails 5.5.1.2 → 5.5.2.0

data/vendor/assets/stylesheets/foundation/components/_inline-lists.scss

@@ -2,7 +2,7 @@
 // foundation.zurb.com
 // Licensed under MIT Open Source
 
-@import "global";
+@import 'global';
 
 //
 // @variables
@@ -32,19 +32,19 @@ $inline-list-children-display: block !default;
 //
 // We use this mixin to create inline lists
 @mixin inline-list {
-  margin: $inline-list-top-margin auto $inline-list-bottom-margin auto;
+  list-style: none;
   margin-#{$default-float}: $inline-list-default-float-margin;
   margin-#{$opposite-direction}: $inline-list-opposite-margin;
-  padding: $inline-list-padding;
-  list-style: none;
+  margin: $inline-list-top-margin auto $inline-list-bottom-margin auto;
   overflow: $inline-list-overflow;
+  padding: $inline-list-padding;
 
-  & > li {
-    list-style: none;
+  > li {
+    display: $inline-list-display;
     float: $default-float;
+    list-style: none;
     margin-#{$default-float}: $inline-list-default-float-list-margin;
-    display: $inline-list-display;
-    &>* { display: $inline-list-children-display; }
+    > * { display: $inline-list-children-display; }
   }
 }
 

data/vendor/assets/stylesheets/foundation/components/_joyride.scss

@@ -2,7 +2,7 @@
 // foundation.zurb.com
 // Licensed under MIT Open Source
 
-@import "global";
+@import 'global';
 
 //
 // @variables
@@ -49,28 +49,27 @@ $joyride-screenfill: rgba(0,0,0,0.5) !default;
 
     /* Default styles for the container */
     .joyride-tip-guide {
-      display: none;
-      position: absolute;
       background: $joyride-tip-bg;
       color: $joyride-tip-font-color;
-      z-index: 101;
-      top: 0;
-      #{$default-float}: 2.5%;
+      display: none;
       font-family: inherit;
       font-weight: $font-weight-normal;
+      position: absolute;
+      top: 0;
       width: 95%;
+      z-index: 101;
+      #{$default-float}: 2.5%;
     }
 
     .lt-ie9 .joyride-tip-guide {
-      max-width:800px;
+      margin-#{$default-float}: -400px;
+      max-width: 800px;
       #{$default-float}: 50%;
-      margin-#{$default-float}:-400px;
     }
 
     .joyride-content-wrapper {
-      width: 100%;
-
       padding: $joyride-tip-padding;
+      width: 100%;
 
       .button { margin-bottom: 0 !important; }
 
@@ -80,25 +79,25 @@ $joyride-screenfill: rgba(0,0,0,0.5) !default;
     /* Add a little css triangle pip, older browser just miss out on the fanciness of it */
     .joyride-tip-guide {
       .joyride-nub {
+        border: $joyride-tip-nub-size solid $joyride-tip-bg;
         display: block;
+        height: 0;
         position: absolute;
-        #{$default-float}: $joyride-tip-position-offset;
         width: 0;
-        height: 0;
-        border: $joyride-tip-nub-size solid $joyride-tip-bg;
+        #{$default-float}: $joyride-tip-position-offset;
 
         &.top {
-          border-top-style: solid;
           border-color: $joyride-tip-bg;
           border-top-color: transparent !important;
+          border-top-style: solid;
           border-#{$default-float}-color: transparent !important;
           border-#{$opposite-direction}-color: transparent !important;
           top: -($joyride-tip-nub-size*2);
         }
         &.bottom {
-          border-bottom-style: solid;
           border-color: $joyride-tip-bg !important;
           border-bottom-color: transparent !important;
+          border-bottom-style: solid;
           border-#{$default-float}-color: transparent !important;
           border-#{$opposite-direction}-color: transparent !important;
           bottom: -($joyride-tip-nub-size*2);
@@ -116,74 +115,73 @@ $joyride-screenfill: rgba(0,0,0,0.5) !default;
     .joyride-tip-guide h4,
     .joyride-tip-guide h5,
     .joyride-tip-guide h6 {
+      color: $joyride-tip-font-color;
+      font-weight: $joyride-tip-header-weight;
       line-height: 1.25;
       margin: 0;
-      font-weight: $joyride-tip-header-weight;
-      color: $joyride-tip-font-color;
     }
     .joyride-tip-guide p {
-      margin: rem-calc(0 0 18 0);
       font-size: $joyride-tip-font-size;
       line-height: 1.3;
+      margin: rem-calc(0 0 18 0);
     }
 
     .joyride-timer-indicator-wrap {
-      width: $joyride-tip-timer-width;
-      height: $joyride-tip-timer-height;
       border: $joyride-tip-border;
+      bottom: rem-calc(16);
+      height: $joyride-tip-timer-height;
       position: absolute;
+      width: $joyride-tip-timer-width;
       #{$opposite-direction}: rem-calc(17);
-      bottom: rem-calc(16);
     }
     .joyride-timer-indicator {
+      background: $joyride-tip-timer-color;
       display: block;
-      width: 0;
       height: inherit;
-      background: $joyride-tip-timer-color;
+      width: 0;
     }
 
     .joyride-close-tip {
-      position: absolute;
-      #{$opposite-direction}: 12px;
-      top: 10px;
       color: $joyride-tip-close-color !important;
-      text-decoration: none;
       font-size: $joyride-tip-close-size;
       font-weight: $joyride-tip-close-weight;
       line-height: .5 !important;
+      position: absolute;
+      text-decoration: none;
+      top: 10px;
+      #{$opposite-direction}: 12px;
 
       &:hover,
       &:focus { color: $smoke !important; }
     }
 
     .joyride-modal-bg {
-      position: fixed;
-      height: 100%;
-      width: 100%;
-      background: transparent;
       background: $joyride-screenfill;
-      z-index: 100;
+      cursor: $cursor-pointer-value;
       display: none;
+      height: 100%;
+      position: fixed;
       top: 0;
+      width: 100%;
+      z-index: 100;
       #{$default-float}: 0;
-      cursor: $cursor-pointer-value;
     }
 
     .joyride-expose-wrapper {
       background-color: $white;
-      position: absolute;
       border-radius: 3px;
-      z-index: 102;
       box-shadow: 0 0 15px $white;
+      position: absolute;
+      z-index: 102;
     }
 
     .joyride-expose-cover {
       background: transparent;
       border-radius: 3px;
+      left: 0;
       position: absolute;
-      z-index: 9999;
       top: 0;
-      left: 0;
+      z-index: 9999;
     }
 
 
@@ -200,20 +198,20 @@ $joyride-screenfill: rgba(0,0,0,0.5) !default;
           }
           &.right {
             border-color: $joyride-tip-bg !important;
-            border-top-color: transparent !important;
             border-right-color: transparent !important; border-bottom-color: transparent !important;
-            top: $joyride-tip-position-offset;
+            border-top-color: transparent !important;
             left: auto;
             right: -($joyride-tip-nub-size*2);
+            top: $joyride-tip-position-offset;
           }
           &.left {
             border-color: $joyride-tip-bg !important;
-            border-top-color: transparent !important;
-            border-left-color: transparent !important;
             border-bottom-color: transparent !important;
-            top: $joyride-tip-position-offset;
+            border-left-color: transparent !important;
+            border-top-color: transparent !important;
             left: -($joyride-tip-nub-size*2);
             right: auto;
+            top: $joyride-tip-position-offset;
           }
         }
       }

data/vendor/assets/stylesheets/foundation/components/_keystrokes.scss

@@ -2,7 +2,7 @@
 // foundation.zurb.com
 // Licensed under MIT Open Source
 
-@import "global";
+@import 'global';
 
 //
 // @variables
@@ -34,7 +34,6 @@ $keystroke-radius: $global-radius !default;
 @mixin keystroke($bg:$keystroke-bg) {
   // This find the lightness percentage of the background color.
   $bg-lightness: lightness($bg);
-
   background-color: $bg;
   border-color: scale-color($bg, $lightness: $keystroke-function-factor);
 
@@ -44,9 +43,9 @@ $keystroke-radius: $global-radius !default;
 
   border-style: $keystroke-border-style;
   border-width: $keystroke-border-width;
-  margin: 0;
   font-family: $keystroke-font;
   font-size: $keystroke-font-size;
+  margin: 0;
   padding: $keystroke-padding;
 }
 

data/vendor/assets/stylesheets/foundation/components/_labels.scss

@@ -2,7 +2,7 @@
 // foundation.zurb.com
 // Licensed under MIT Open Source
 
-@import "global";
+@import 'global';
 
 //
 // @variables
@@ -25,15 +25,15 @@ $label-font-family: $body-font-family !default;
 //
 // We use this mixin to create a default label base.
 @mixin label-base {
-  font-weight: $label-font-weight;
+  display: inline-block;
   font-family: $label-font-family;
+  font-weight: $label-font-weight;
+  line-height: 1;
+  margin-bottom: auto;
+  position: relative;
   text-align: center;
   text-decoration: none;
-  line-height: 1;
   white-space: nowrap;
-  display: inline-block;
-  position: relative;
-  margin-bottom: auto;
 }
 
 // @mixins

data/vendor/assets/stylesheets/foundation/components/_magellan.scss

@@ -2,7 +2,7 @@
 // foundation.zurb.com
 // Licensed under MIT Open Source
 
-@import "global";
+@import 'global';
 
 //
 // @variables
@@ -17,9 +17,9 @@ $magellan-padding: 10px !default;
 
     #{data('magellan-expedition')}, #{data('magellan-expedition-clone')} {
       background: $magellan-bg;
-      z-index: 50;
       min-width: 100%;
       padding: $magellan-padding;
+      z-index: 50;
 
       .sub-nav {
         margin-bottom: 0;

data/vendor/assets/stylesheets/foundation/components/_offcanvas.scss

@@ -2,8 +2,8 @@
 // foundation.zurb.com
 // Licensed under MIT Open Source
 
-@import "global";
-@import "type";
+@import 'global';
+@import 'type';
 
 // Off Canvas Tab Bar Variables
 $include-html-off-canvas-classes: $include-html-classes !default;
@@ -30,9 +30,10 @@ $tabbar-header-margin: 0 !default;
 $off-canvas-width: rem-calc(250) !default;
 $off-canvas-bg: $oil !default;
 $off-canvas-bg-hover: scale-color($tabbar-bg, $lightness: -30%) !default;
+$off-canvas-bg-active: scale-color($tabbar-bg, $lightness: -30%) !default;
 
 // Off Canvas Menu List Variables
-$off-canvas-label-padding: 0.3rem rem-calc(15) !default;
+$off-canvas-label-padding: .3rem rem-calc(15) !default;
 $off-canvas-label-color: $aluminum !default;
 $off-canvas-label-text-transform: uppercase !default;
 $off-canvas-label-font-size: rem-calc(12) !default;
@@ -42,7 +43,7 @@ $off-canvas-label-border-top: 1px solid scale-color($off-canvas-label-bg, $light
 $off-canvas-label-border-bottom: none !default;
 $off-canvas-label-margin:0 !default;
 $off-canvas-link-padding: rem-calc(10, 15) !default;
-$off-canvas-link-color: rgba($white, 0.7) !default;
+$off-canvas-link-color: rgba($white, .7) !default;
 $off-canvas-link-border-bottom: 1px solid scale-color($off-canvas-bg, $lightness: -25%) !default;
 $off-canvas-back-bg: #444 !default;
 $off-canvas-back-border-top: $off-canvas-label-border-top !default;
@@ -69,9 +70,9 @@ $tabbar-hamburger-icon-gap: 6px !default;
 // Off Canvas Back-Link Overlay
 $off-canvas-overlay-transition: background 300ms ease !default;
 $off-canvas-overlay-cursor: pointer !default;
-$off-canvas-overlay-box-shadow: -4px 0 4px rgba($black, 0.5), 4px 0 4px rgba($black, 0.5) !default;
-$off-canvas-overlay-background: rgba($white, 0.2) !default;
-$off-canvas-overlay-background-hover: rgba($white, 0.05) !default;
+$off-canvas-overlay-box-shadow: -4px 0 4px rgba($black, .5), 4px 0 4px rgba($black, .5) !default;
+$off-canvas-overlay-background: rgba($white, .2) !default;
+$off-canvas-overlay-background-hover: rgba($white, .05) !default;
 
 // Transition Variables
 $menu-slide: "transform 500ms ease" !default;
@@ -90,31 +91,31 @@ $menu-slide: "transform 500ms ease" !default;
   width: 100%;
 }
 
-@mixin translate3d($tx,$ty,$tz) {
-      -ms-transform: translate($tx,$ty);
-  -webkit-transform: translate3d($tx,$ty,$tz);
-     -moz-transform: translate3d($tx,$ty,$tz);
-      -ms-transform: translate3d($tx,$ty,$tz);
-       -o-transform: translate3d($tx,$ty,$tz);
-          transform: translate3d($tx,$ty,$tz)
+@mixin translate3d($tx, $ty, $tz) {
+  -webkit-transform: translate3d($tx, $ty, $tz);
+     -moz-transform: translate3d($tx, $ty, $tz);
+      -ms-transform: translate($tx, $ty);
+      -ms-transform: translate3d($tx, $ty, $tz);
+       -o-transform: translate3d($tx, $ty, $tz);
+          transform: translate3d($tx, $ty, $tz)
 }
 
 // basic styles for off-canvas menu container
 @mixin off-canvas-menu($position) {
   @include kill-flicker;
   * { @include kill-flicker; }
-  width: $off-canvas-width;
-  top: 0;
-  bottom: 0;
-  position: absolute;
-  overflow-x: hidden;
-  overflow-y: auto;
   background: $off-canvas-bg;
-  z-index: 1001;
+  bottom: 0;
   box-sizing: content-box;
-  transition: transform 500ms ease 0s;
   -webkit-overflow-scrolling: touch;
   -ms-overflow-style: -ms-autohiding-scrollbar;
+  overflow-x: hidden;
+  overflow-y: auto;
+  position: absolute;
+  top: 0;
+  transition: transform 500ms ease 0s;
+  width: $off-canvas-width;
+  z-index: 1001;
 
   @if $position == left {
     @include translate3d(-100%,0,0);
@@ -166,22 +167,22 @@ $menu-slide: "transform 500ms ease" !default;
   // z-index: 999;
 
   // Typography
-  h1,h2,h3,h4,h5,h6 {
+  h1, h2, h3, h4, h5, h6 {
     color: $tabbar-header-color;
     font-weight: $tabbar-header-weight;
     line-height: $tabbar-header-line-height;
     margin: $tabbar-header-margin;
   }
-  h1,h2,h3,h4 { font-size: $h5-font-size; }
+  h1, h2, h3, h4 { font-size: $h5-font-size; }
 }
 
 // SMALL SECTIONS
 // These are small sections on the left and right that contain the off-canvas toggle buttons;
 @mixin tabbar-small-section($position) {
-  width: $tabbar-icon-width;
   height: $tabbar-height;
   position: absolute;
   top: 0;
+  width: $tabbar-icon-width;
   @if $position == left {
     border-right: $tabbar-left-section-border;
     // box-shadow: 1px 0 0 scale-color($tabbar-bg, $lightness: 13%);
@@ -195,15 +196,14 @@ $menu-slide: "transform 500ms ease" !default;
 }
 
 @mixin tab-bar-section {
+  height: $tabbar-height;
   padding: $tabbar-middle-padding;
   position: absolute;
   text-align: center;
-  height: $tabbar-height;
   top: 0;
-  @media #{$medium-up} {
     &.left { text-align: left; }
     &.right { text-align: right; }
-  }
+
 
   // still need to make these non-presentational
   &.left {
@@ -224,31 +224,34 @@ $menu-slide: "transform 500ms ease" !default;
 // This is the list of links in the off-canvas menu
 @mixin off-canvas-list {
   list-style-type: none;
-  padding:0;
   margin:0;
+  padding:0;
 
   li {
     label {
-      display: block;
-      padding: $off-canvas-label-padding;
+      background: $off-canvas-label-bg;
+      border-bottom: $off-canvas-label-border-bottom;
+      border-top: $off-canvas-label-border-top;
       color: $off-canvas-label-color;
-      text-transform: $off-canvas-label-text-transform;
+      display: block;
       font-size: $off-canvas-label-font-size;
       font-weight: $off-canvas-label-font-weight;
-      background: $off-canvas-label-bg;
-      border-top: $off-canvas-label-border-top;
-      border-bottom: $off-canvas-label-border-bottom;
       margin: $off-canvas-label-margin;
+      padding: $off-canvas-label-padding;
+      text-transform: $off-canvas-label-text-transform;
     }
     a {
+      border-bottom: $off-canvas-link-border-bottom;
+      color: $off-canvas-link-color;
       display: block;
       padding: $off-canvas-link-padding;
-      color: $off-canvas-link-color;
-      border-bottom: $off-canvas-link-border-bottom;
       transition: background 300ms ease;
       &:hover {
         background: $off-canvas-bg-hover;
       }
+      &:active {
+        background: $off-canvas-bg-active;
+      }
     }
   }
 
@@ -257,28 +260,121 @@ $menu-slide: "transform 500ms ease" !default;
 // BACK LINK
 // This is an overlay that, when clicked, will toggle off the off canvas menu
 @mixin back-link {
-    @include kill-flicker;
-
-    transition: $off-canvas-overlay-transition;
-    cursor: $off-canvas-overlay-cursor;
-    box-shadow: $off-canvas-overlay-box-shadow;
-
-    // fill the screen
-    display: block;
-    position: absolute;
-    background: $off-canvas-overlay-background;
-    top: 0;
-    bottom: 0;
-    left:0;
-    right:0;
-    z-index: 1002;
-    -webkit-tap-highlight-color: rgba(0,0,0,0);
+  @include kill-flicker;
 
-    @media #{$medium-up} {
-      &:hover {
-        background: $off-canvas-overlay-background-hover;
+  box-shadow: $off-canvas-overlay-box-shadow;
+  cursor: $off-canvas-overlay-cursor;
+  transition: $off-canvas-overlay-transition;
+
+  // fill the screen
+  -webkit-tap-highlight-color: rgba(0,0,0,0);
+  background: $off-canvas-overlay-background;
+  bottom: 0;
+  display: block;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+  z-index: 1002;
+
+  @media #{$medium-up} {
+    &:hover {
+      background: $off-canvas-overlay-background-hover;
+    }
+  }
+}
+
+//
+// Off-Canvas Submenu Classes
+//
+@mixin off-canvas-submenu($position) {
+  @include kill-flicker;
+  * { @include kill-flicker; }
+  -webkit-overflow-scrolling: touch;
+  background: $off-canvas-bg;
+  bottom: 0;
+  box-sizing: content-box;
+  margin: 0;
+  overflow-x: hidden;
+  overflow-y: auto;
+  position: absolute;
+  top: 0;
+  width: $off-canvas-width;
+  z-index: 1002;
+  @if $position == left {
+    @include translate3d(-100%,0,0);
+    left: 0;
+  }
+  @if $position == right {
+    @include translate3d(100%,0,0);
+    right: 0;
+  }
+  -webkit-transition: -webkit-#{$menu-slide};
+  -moz-transition: -moz-#{$menu-slide};
+  -ms-transition: -ms-#{$menu-slide};
+  -o-transition: -o-#{$menu-slide};
+  transition: #{$menu-slide};
+
+  //back button style like label
+  .back > a {
+    background: $off-canvas-back-bg;
+    border-bottom: $off-canvas-back-border-bottom;
+    border-top: $off-canvas-back-border-top;
+    color: $off-canvas-label-color;
+    font-weight: $off-canvas-label-font-weight;
+    padding: $off-canvas-label-padding;
+    text-transform: $off-canvas-label-text-transform;
+
+    &:hover {
+      background: $off-canvas-back-hover-bg;
+      border-bottom: $off-canvas-back-hover-border-bottom;
+      border-top: $off-canvas-back-hover-border-top;
+    }
+
+    margin: $off-canvas-label-margin;
+    @if $position == right {
+      @if $text-direction == rtl {
+        &:before {
+          @include icon-double-arrows($position: left);
+        }
+      } @else {
+        &:after {
+          @include icon-double-arrows($position: right);
+        }
+      }
+    }
+    @if $position == left {
+      @if $text-direction == rtl {
+        &:after {
+          @include icon-double-arrows($position: right);
+        }
+      } @else {
+        &:before {
+          @include icon-double-arrows($position: left);
+        }
       }
     }
+  }
+}
+//Left double angle quote or Right double angle quote chars
+@mixin icon-double-arrows ($position) {
+  @if $position == left {
+    content: "\AB";
+    @if $text-direction == rtl {
+      margin-left: .5rem;
+    } @else {
+      margin-right: .5rem;
+    }
+  }
+  @if $position == right {
+    content: "\BB";
+    @if $text-direction == rtl {
+      margin-right: .5rem;
+    } @else {
+      margin-left: .5rem;
+    }
+  }
+  display: inline;
 }
 
 //
@@ -300,14 +396,14 @@ $menu-slide: "transform 500ms ease" !default;
     // MENU BUTTON
     // This is a little bonus. You don't need it for off canvas to work. Mixins to be written in the future.
     .tab-bar .menu-icon {
-      text-indent: $tabbar-menu-icon-text-indent;
-      width: $tabbar-menu-icon-width;
-      height: $tabbar-menu-icon-height;
+      color: $tabbar-menu-icon-color;
       display: block;
+      height: $tabbar-menu-icon-height;
       padding: $tabbar-menu-icon-padding;
-      color: $tabbar-menu-icon-color;
       position: relative;
+      text-indent: $tabbar-menu-icon-text-indent;
       transform: translate3d(0,0,0);
+      width: $tabbar-menu-icon-width;
 
       // @include for the hamburger menu-icon
       //
@@ -388,128 +484,35 @@ $menu-slide: "transform 500ms ease" !default;
       .move-right > .inner-wrap { left: $off-canvas-width; }
     }
 
-  }
-}
-
-//
-// Off-Canvas Submenu Classes
-//
-@mixin off-canvas-submenu($position) {
-  @include kill-flicker;
-  * { @include kill-flicker; }
-  width: $off-canvas-width;
-  top: 0;
-  bottom: 0;
-  position: absolute;
-  margin: 0;
-  overflow-x: hidden;
-  overflow-y: auto;
-  background: $off-canvas-bg;
-  z-index: 1002;
-  box-sizing: content-box;
-  -webkit-overflow-scrolling: touch;
-  @if $position == left {
-    @include translate3d(-100%,0,0);
-    left: 0;
-  }
-  @if $position == right {
-    @include translate3d(100%,0,0);
-    right: 0;
-  }
-  -webkit-transition: -webkit-#{$menu-slide};
-  -moz-transition: -moz-#{$menu-slide};
-  -ms-transition: -ms-#{$menu-slide};
-  -o-transition: -o-#{$menu-slide};
-  transition: #{$menu-slide};
-
-  //back button style like label
-  .back > a {
-    padding: $off-canvas-label-padding;
-    color: $off-canvas-label-color;
-    text-transform: $off-canvas-label-text-transform;
-    font-weight: $off-canvas-label-font-weight;
-    background: $off-canvas-back-bg;
-    border-top: $off-canvas-back-border-top;
-    border-bottom: $off-canvas-back-border-bottom;
-    &:hover {
-    	background: $off-canvas-back-hover-bg;
-    	border-top: $off-canvas-back-hover-border-top;
-    	border-bottom: $off-canvas-back-hover-border-bottom;
-    }
-    margin: $off-canvas-label-margin;
-    @if $position == right {
-      @if $text-direction == rtl {
-        &:before {
-          @include icon-double-arrows($position: left);
-        }
-      } @else {
-        &:after {
-          @include icon-double-arrows($position: right);
-        }
+    .left-submenu {
+      @include off-canvas-submenu($position: left);
+      &.move-right, &.offcanvas-overlap-right, &.offcanvas-overlap {
+        @include translate3d(0%,0,0);
       }
     }
-    @if $position == left {
-      @if $text-direction == rtl {
-        &:after {
-          @include icon-double-arrows($position: right);
-        }
-      } @else {
-        &:before {
-          @include icon-double-arrows($position: left);
-        }
+
+    .right-submenu {
+      @include off-canvas-submenu($position: right);
+      &.move-left, &.offcanvas-overlap-left, &.offcanvas-overlap {
+        @include translate3d(0%,0,0);
       }
     }
-  }
-}
-//Left double angle quote or Right double angle quote chars
-@mixin icon-double-arrows ($position){
-  @if $position == left {
-    content: "\AB";
-    @if $text-direction == rtl {
-      margin-left: 0.5rem;
-    } @else {
-      margin-right: 0.5rem;
-    }
-  }
-  @if $position == right {
-    content: "\BB";
+
     @if $text-direction == rtl {
-      margin-right: 0.5rem;
+      .left-off-canvas-menu ul.off-canvas-list li.has-submenu > a:before {
+        @include icon-double-arrows($position: left);
+      }
+      .right-off-canvas-menu ul.off-canvas-list li.has-submenu > a:after {
+        @include icon-double-arrows($position: right);
+      }
     } @else {
-      margin-left: 0.5rem;
-    }
-  }
-  display: inline;
-}
-
-@if $include-html-off-canvas-classes {
-  .left-submenu {
-    @include off-canvas-submenu($position: left);
-    &.move-right, &.offcanvas-overlap-right, &.offcanvas-overlap {
-      @include translate3d(0%,0,0);
-    }
-  }
-
-  .right-submenu {
-    @include off-canvas-submenu($position: right);
-    &.move-left, &.offcanvas-overlap-left, &.offcanvas-overlap {
-      @include translate3d(0%,0,0);
+      .left-off-canvas-menu ul.off-canvas-list li.has-submenu > a:after {
+        @include icon-double-arrows($position: right);
+      }
+      .right-off-canvas-menu ul.off-canvas-list li.has-submenu > a:before {
+        @include icon-double-arrows($position: left);
+      }
     }
-  }
 
-  @if $text-direction == rtl {
-    .left-off-canvas-menu ul.off-canvas-list li.has-submenu > a:before {
-      @include icon-double-arrows($position: left);
-    }
-    .right-off-canvas-menu ul.off-canvas-list li.has-submenu > a:after {
-      @include icon-double-arrows($position: right);
-    }
-  } @else {
-    .left-off-canvas-menu ul.off-canvas-list li.has-submenu > a:after {
-       @include icon-double-arrows($position: right);
-    }
-    .right-off-canvas-menu ul.off-canvas-list li.has-submenu > a:before {
-       @include icon-double-arrows($position: left);
-    }
   }
 }