From 065740dff858cd53d5eef84119a277538ced977a Mon Sep 17 00:00:00 2001
From: Chris Nicola <chrisn@tictalking.com>
Date: Fri, 5 Oct 2012 16:21:52 -0700
Subject: [PATCH] Adjust grid typography and adjust grid demo for borders

The block-grid has been given consistent top and bottom padding to keep
it in rhythm. I'm not sure if this breaks a desired effect with the
smaller padding sizes as blocks became smaller.
---
 scss/foundation/common/_typography.scss |  2 +-
 scss/foundation/components/_grid.scss   | 10 +++++-----
 test/grid.html                          |  8 +++++---
 3 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/scss/foundation/common/_typography.scss b/scss/foundation/common/_typography.scss
index ada368ecc6..f3262f530f 100644
--- a/scss/foundation/common/_typography.scss
+++ b/scss/foundation/common/_typography.scss
@@ -5,7 +5,7 @@
   @include establish-baseline;
 
   /* Uncomment below to check vertical rhythm against a test background image */
-  /*body { @include debug-vertical-alignment; }*/
+  body { @include debug-vertical-alignment; }
 
   body { line-height: $baseLineHeight; }
 
diff --git a/scss/foundation/components/_grid.scss b/scss/foundation/components/_grid.scss
index c46cbbc913..9d3b9dccf6 100644
--- a/scss/foundation/components/_grid.scss
+++ b/scss/foundation/components/_grid.scss
@@ -111,29 +111,29 @@ that IE7/8 do not support :nth-child.
 
     &>li { display: block; height: auto; float: $defaultFloat; }
     &.one-up { margin: 0; 
-      &>li { width: 100%; padding: 0 0 15px; }
+      &>li { width: 100%; padding: $baseLineHeight / 2 0; }
     }
 
     &.two-up { margin: 0 -15px; 
-      &>li { width: 50%; padding: 0 15px 15px; 
+      &>li { width: 50%; padding: $baseLineHeight / 2 15px; 
         &:nth-child(2n+1) { clear: both; }
       }
     }
 
     &.three-up { margin: 0 -12px; 
-      &>li { width: 33.33%; padding: 0 12px 12px; 
+      &>li { width: 33.33%; padding: $baseLineHeight / 2 12px; 
         &:nth-child(3n+1) { clear: both; }
       }
     }
 
     &.four-up { margin: 0 -10px; 
-      &>li { width: 25%; padding: 0 10px 10px; 
+      &>li { width: 25%; padding: $baseLineHeight / 2 10px; 
         &:nth-child(4n+1) { clear: both; }
       }
     }
 
     &.five-up { margin: 0 -8px; 
-      &>li { width: 20%; padding: 0 8px 8px; 
+      &>li { width: 20%; padding: $baseLineHeight / 2 8px;
         &:nth-child(5n+1) { clear: both; }
       }
     }
diff --git a/test/grid.html b/test/grid.html
index 05749913bb..d3fa44daf4 100644
--- a/test/grid.html
+++ b/test/grid.html
@@ -19,14 +19,16 @@
       background: #F4F4F4;
       margin-bottom: 10px;
     }
-    .row.display .column, .row.display .columns, .block-grid li {
+    .row.display .column, .row.display .columns, .block-grid li{
       background: #E7E7E7;
       border: 1px solid #DDD;
       font-size: 11px;
       text-indent: 3px;
-      padding-top: 6px;
-      padding-bottom: 6px;
+      padding-top: 5px;
+      padding-bottom: 5px;
     }
+    .block-grid.five-up li,.block-grid.four-up li,  .block-grid.three-up li, .block-grid.two-up li, .block-grid.one-up li { padding-bottom: 10px; padding-top: 10px; }
+
   </style>
   <script src="../vendor/assets/javascripts/foundation/modernizr.foundation.js"></script>