From: Geoff Kimball <geoff@zurb.com>
Date: Fri, 15 Jan 2016 01:28:01 +0000 (-0800)
Subject: Add grid-layout-center-last() mixin to center last items in block grid, closes #7807
X-Git-Tag: v6.2.0-rc.1~78
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=f2528364469b42b31170e23a22b177fee6443a67;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

Add grid-layout-center-last() mixin to center last items in block grid, closes #7807
---

diff --git a/scss/grid/_layout.scss b/scss/grid/_layout.scss
index e88d8cd87..9f5da07c2 100644
--- a/scss/grid/_layout.scss
+++ b/scss/grid/_layout.scss
@@ -31,3 +31,21 @@
     }
   }
 }
+
+/// Adds extra CSS to block grid children so the last items in the row center automatically. Apply this to the columns, not the row.
+///
+/// @param {Number} $n - Number of items that appear in each row.
+@mixin grid-layout-center-last($n) {
+  @for $i from 1 to $n {
+    @if $i == 1 {
+      &:nth-child(#{$n}n+1):last-child {
+        margin-left: (100 - 100/$n * $i) / 2 * 1%;
+      }
+    }
+    @else {
+      &:nth-child(#{$n}n+1):nth-last-child(#{$i}) {
+        margin-left: (100 - 100/$n * $i) / 2 * 1%;
+      }
+    }
+  }
+}