Skip to content

Commit

Permalink
Use pull request foundation#10927 from ncoden/fix/xy-grid-responsive-…
Browse files Browse the repository at this point in the history
…modifiers-reset-10891 for v6.5.0

8347330 fix: add missing flex reset in XY Grid responsive cell widths foundation#10891
16e18da tests: add visual test for XY Grid reponsive widths foundation#10891

Signed-off-by: Nicolas Coden <nicolas@ncoden.fr>
  • Loading branch information
ncoden committed Jun 16, 2018
1 parent 44274a8 commit 620632e
Show file tree
Hide file tree
Showing 2 changed files with 23 additions and 0 deletions.
1 change: 1 addition & 0 deletions scss/xy-grid/_classes.scss
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,7 @@
@for $i from 1 through $grid-columns {
// Sizing (percentage)
.grid-x > .#{$-zf-size}-#{$i} {
@include xy-cell-base(shrink);
@include xy-cell-static($i, false, $gutter-type: padding);
}
}
Expand Down
22 changes: 22 additions & 0 deletions test/visual/xy-grid/combo-grids.html
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,28 @@ <h2>Auto and Shrink</h2>
<div class="cell medium-auto"><div class="demo">Auto on medium</div></div>
</div>

<h2>Auto/Shrink with static widths</h2>

<div class="grid-x grid-padding-x">
<div class="cell shrink medium-6 large-12"><div class="demo">Shrink, medium:6, large:12</div></div>
<div class="cell auto medium-4 large-12"><div class="demo">Auto, medium:4, large:12</div></div>
</div>

<br>

<div class="grid-x grid-padding-x">
<div class="cell shrink medium-auto large-7"><div class="demo">Shrink, medium:auto, large:7</div></div>
<div class="cell auto medium-shrink large-5"><div class="demo">Auto, medium:shrink, large:5</div></div>
</div>

<br>

<p>The following example must be tested without paddings/margins. See <a href"https://github.com/zurb/foundation-sites/issues/10891">#10891</a></p>
<div class="grid-x">
<div class="cell medium-auto large-12"><div class="demo">medium:auto, large:12</div></div>
<div class="cell medium-shrink large-12"><div class="demo">medium:shrink, large:12</div></div>
</div>

<h2>Collapse</h2>

<div class="grid-x grid-margin-x large-margin-collapse">
Expand Down

0 comments on commit 620632e

Please sign in to comment.