Update vertical-align docs page with deleted content.

Author: mrmrs

docs/typography/vertical-align/index.html

@@ -42,7 +42,7 @@
 </header>
 
     <main class="">
-      <article class="bg-near-white bt b--black-10 ph3 pt3 ph5-ns">
+      <article class="bg-near-white bt b--black-10 pa3 ph5-ns">
         <h4 class="f4 mv0 fw6 dib mr4">tachyons-vertical-align</h4>
         <span class="f4 b dib pl0 ml0 mr4">v2.0.2</span>
         <span class="f4 b dib pl0 ml0 mr4">242 B</span>
@@ -64,11 +64,19 @@ <h4 class="f4 mv0 fw6 dib mr4">tachyons-vertical-align</h4>
               <dd class="db pl0 ml0 f4 f2-ns b">1</dd>
             </dl>
         </div>
+        <p class="measure f4 f3-ns lh-copy">
+          Use vertical align to set typography just right. Vertical align
+          works on text and on table cells.
+        </p>
+        <p class="measure f5 f4-ns lh-copy">
+          This documents how vertical align affects text elements. If you'd
+          like to see how to vertically align elements - checkout the layout documentation.
+        </p>
       </article>
 <div class="ph3 ph5-ns pt4 pb5">
-  <h2 class="f3 bold">Examples</h2>
+  <h2 class="f4 bold">Examples</h2>
   <h3 class="f5 book sans-serif pt4 caps">Inline Alignment</h3>
-  <p class="f3 measure">
+  <p class="f4 measure">
     Lorem ipsum dolor sit amet, consetetur sadipscing
     <span class="v-sub bg-lightest-red">Sub aligned text (v-sub)</span>
 elitr, sed diam nonumy eirmod

src/templates/docs/vertical-align/index.html

@@ -15,7 +15,7 @@
 
     <%= siteHeader %>
     <main class="">
-      <article class="bg-near-white bt b--black-10 ph3 pt3 ph5-ns">
+      <article class="bg-near-white bt b--black-10 pa3 ph5-ns">
         <h4 class="f4 mv0 fw6 dib mr4"><%= name %></h4>
         <span class="f4 b dib pl0 ml0 mr4">v<%= moduleVersion %></span>
         <span class="f4 b dib pl0 ml0 mr4"><%= moduleSize %></span>
@@ -37,11 +37,19 @@ <h4 class="f4 mv0 fw6 dib mr4"><%= name %></h4>
               <dd class="db pl0 ml0 f4 f2-ns b"><%= moduleObj.rules.size.average %></dd>
             </dl>
         </div>
+        <p class="measure f4 f3-ns lh-copy">
+          Use vertical align to set typography just right. Vertical align
+          works on text and on table cells.
+        </p>
+        <p class="measure f5 f4-ns lh-copy">
+          This documents how vertical align affects text elements. If you'd
+          like to see how to vertically align elements - checkout the layout documentation.
+        </p>
       </article>
 <div class="ph3 ph5-ns pt4 pb5">
-  <h2 class="f3 bold">Examples</h2>
+  <h2 class="f4 bold">Examples</h2>
   <h3 class="f5 book sans-serif pt4 caps">Inline Alignment</h3>
-  <p class="f3 measure">
+  <p class="f4 measure">
     Lorem ipsum dolor sit amet, consetetur sadipscing
     <span class="v-sub bg-lightest-red">Sub aligned text (v-sub)</span>
 elitr, sed diam nonumy eirmod

src/templates/index.html

@@ -233,6 +233,18 @@ <h1 class="f5 fw6 ttu tracked">Testimonials</h1>
               </footer>
             </blockquote>
           </div>
+          <div class="cf w-100">
+            <blockquote class="fl w-100 w-50-ns mh0 mb2 mb5-ns pr0 pr3-ns border-box">
+              <p class="f6 f5-ns measure lh-copy">
+                I never understood how people did font ratios and table layouts nicely with CSS until @mrmrs showed me the light.
+              </p>
+              <footer>
+                <p>
+                  <span class="b">Nat</span> - <i>Ops</i>
+                </p>
+              </footer>
+            </blockquote>
+          </div>
         </div>
       </section>
       <section class="bg-white dt h-100 navy pv5 pv6-ns" id="npm">