From: Nicolas Coden Date: Tue, 10 Jul 2018 18:52:57 +0000 (+0200) Subject: fix: add missing flex reset in XY Grid responsive vertical cell widths X-Git-Tag: v6.6.0~3^2~129^2 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=refs%2Fpull%2F11397%2Fhead;p=thirdparty%2Ffoundation%2Ffoundation-sites.git fix: add missing flex reset in XY Grid responsive vertical cell widths Apply #10891 with optimizations introduced by 7e34dc3b5 to vertical cells. See https://github.com/zurb/foundation-sites/issues/10891 --- diff --git a/scss/xy-grid/_classes.scss b/scss/xy-grid/_classes.scss index fddf6b0de..eccf9986a 100644 --- a/scss/xy-grid/_classes.scss +++ b/scss/xy-grid/_classes.scss @@ -76,14 +76,14 @@ } } - %-xy-cell-base-shrink-#{$-zf-size} { + %-xy-cell-base-shrink-horizontal-#{$-zf-size} { @include xy-cell-base(shrink); } // Responsive "shrink" modifier @if not($-zf-size == small) { .grid-x > .#{$-zf-size}-shrink { - @extend %-xy-cell-base-shrink-#{$-zf-size}; + @extend %-xy-cell-base-shrink-horizontal-#{$-zf-size}; @include xy-cell-static(shrink, false); } } @@ -92,7 +92,7 @@ @for $i from 1 through $grid-columns { // Sizing (percentage) .grid-x > .#{$-zf-size}-#{$i} { - @extend %-xy-cell-base-shrink-#{$-zf-size}; + @extend %-xy-cell-base-shrink-horizontal-#{$-zf-size}; @include xy-cell-static($i, false, $gutter-type: padding); } } @@ -305,21 +305,31 @@ } @include -zf-each-breakpoint() { + // Responsive "auto" modifier @if not($-zf-size == small) { > .#{$-zf-size}-auto { @include xy-cell-base(auto); @include xy-cell-static(auto, false, $breakpoint: $-zf-size, $vertical: true); } + } + + %-xy-cell-base-shrink-vertical-#{$-zf-size} { + @include xy-cell-base(shrink); + } + // Responsive "shrink" modifier + @if not($-zf-size == small) { > .#{$-zf-size}-shrink { + @extend %-xy-cell-base-shrink-vertical-#{$-zf-size}; @include xy-cell-static(shrink, false, $breakpoint: $-zf-size, $vertical: true); } - } + // Responsive width modifiers @for $i from 1 through $grid-columns { // Sizing (percentage) > .#{$-zf-size}-#{$i} { + @extend %-xy-cell-base-shrink-vertical-#{$-zf-size}; @include xy-cell-static($i, false, $vertical: true, $gutter-type: padding); } }