From: SassNinja <kai.falkowski@gmail.com>
Date: Sat, 5 Aug 2017 16:47:31 +0000 (+0200)
Subject: Fix off-canvas sizes map interation in off-canvas-reveal mixin
X-Git-Tag: v6.4.2~1^2^2~1
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=51471d8993ebaa0bd25d6a8422a61e97fd18adb2;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

Fix off-canvas sizes map interation in off-canvas-reveal mixin

Since it's problematic to include the breakpoint mixin in another breakpoint mixin the breakpoint name of reveal-for-x is now piped through and used to get the appropriate size.
---

diff --git a/scss/components/_off-canvas.scss b/scss/components/_off-canvas.scss
index 336bcd237..03a12155d 100644
--- a/scss/components/_off-canvas.scss
+++ b/scss/components/_off-canvas.scss
@@ -380,7 +380,8 @@ $maincontent-class: 'off-canvas-content' !default;
 @mixin off-canvas-reveal(
 $position: left,
 $zindex: $offcanvas-reveal-zindex,
-$content: $maincontent-class
+$content: $maincontent-class,
+$breakpoint: small
 ) {
   transform: none;
   z-index: $zindex;
@@ -401,20 +402,12 @@ $content: $maincontent-class
   }
 
   @at-root .#{$content}.has-reveal-#{$position} {
-    @each $name, $size in $offcanvas-sizes {
-      @include breakpoint($name) {
-        margin-#{$position}: $size;
-      }
-    }
+    margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);
   }
 
   // backwards compatibility (prior to v6.4)
   & ~ .#{$content} {
-    @each $name, $size in $offcanvas-sizes {
-      @include breakpoint($name) {
-        margin-#{$position}: $size;
-      }
-    }
+    margin-#{$position}: -zf-get-bp-val($offcanvas-sizes, $breakpoint);
   }
 }
 
@@ -481,19 +474,19 @@ $content: $maincontent-class
     @if $name != $-zf-zero-breakpoint {
       @include breakpoint($name) {
         .position-left.reveal-for-#{$name} {
-          @include off-canvas-reveal(left);
+          @include off-canvas-reveal(left, $offcanvas-reveal-zindex, $maincontent-class, $name);
         }
 
         .position-right.reveal-for-#{$name} {
-          @include off-canvas-reveal(right);
+          @include off-canvas-reveal(right, $offcanvas-reveal-zindex, $maincontent-class, $name);
         }
 
         .position-top.reveal-for-#{$name} {
-          @include off-canvas-reveal(top);
+          @include off-canvas-reveal(top, $offcanvas-reveal-zindex, $maincontent-class, $name);
         }
 
         .position-bottom.reveal-for-#{$name} {
-          @include off-canvas-reveal(bottom);
+          @include off-canvas-reveal(bottom, $offcanvas-reveal-zindex, $maincontent-class, $name);
         }
       }
     }