From: Nicolas Coden <nicolas@ncoden.fr>
Date: Tue, 26 Dec 2017 21:20:19 +0000 (+0100)
Subject: fix: prevent side-effect from .stack-for in media-object
X-Git-Tag: v6.6.0~3^2~334^2
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=refs%2Fpull%2F10679%2Fhead;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

fix: prevent side-effect from .stack-for in media-object

Prevent a parent component with `.stack-for-*` to have side effects on `.media-object-section`.

This is a part of a PR and the selector specificity is revert to the one before the PR (0.3.0).
---

diff --git a/scss/components/_media-object.scss b/scss/components/_media-object.scss
index 0ae8c51a6..1f6d44b3d 100644
--- a/scss/components/_media-object.scss
+++ b/scss/components/_media-object.scss
@@ -38,6 +38,12 @@ $mediaobject-image-width-stacked: 100% !default;
       }
     }
   }
+
+  &.stack-for-#{$-zf-zero-breakpoint} .media-object-section {
+    @include breakpoint($-zf-zero-breakpoint only) {
+      @include media-object-stack;
+    }
+  }
 }
 
 /// Adds styles for sections within a media object.
@@ -63,12 +69,6 @@ $mediaobject-image-width-stacked: 100% !default;
     margin-bottom: 0;
   }
 
-  .stack-for-#{$-zf-zero-breakpoint} & {
-    @include breakpoint($-zf-zero-breakpoint only) {
-      @include media-object-stack;
-    }
-  }
-
   @if $global-flexbox {
     &.main-section {
       flex: 1 1 0px; // sass-lint:disable-line zero-unit