adds preheader styles

Author: RafiBomb

scss/components/_typography.scss

@@ -321,4 +321,18 @@ hr {
   }
 }
 
+// preheader styles
+span.preheader {
+  display:none !important;
+  visibility:hidden;
+  mso-hide:all !important;
+  font-size:1px;
+  color: $body-background; // needs to match background color
+  line-height:1px;
+  max-height:0px;
+  max-width:0px;
+  opacity:0;
+  overflow:hidden;
+}
+
 

test/visual/pages/alignment.html

@@ -49,22 +49,38 @@ <h4 class="text-left">Left Text</h4>
   </row>
 
   <center>
-    <button href="some-place">Center</button>
+    <button href="#">Center</button>
   </center>
 
   <row>
     <columns small="6" large="6">
       <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repudiandae error nam, sequi culpa deleniti aperiam saepe, similique laborum corrupti vitae iste mollitia reiciendis corporis qui, quae possimus eos quidem nostrum.</p>
       <center>
-        <button href="some-place">Center</button>
+        <button href="#">Center</button>
       </center>
     </columns>
     <columns small="6" large="6">
       <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repudiandae error nam, sequi culpa deleniti aperiam saepe, similique laborum corrupti vitae iste mollitia reiciendis corporis qui, quae possimus eos quidem nostrum.</p>
       <center>
-        <button href="some-place">Center</button>
+        <button href="#">Center</button>
       </center>
     </columns>
   </row>
 
+  <row>
+    <columns small="12" large="4">
+      <callout>
+        <h3 class="small-text-center">Presentations<span>8</span></h3>
+        <spacer size="35"></spacer>
+        <center>
+          <img src="http://placehold.it/74x50">
+        </center>
+        <spacer size="40"></spacer>
+      </callout>
+    </columns>
+    <columns small="12" large="8">
+      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum sapiente quis at fuga reprehenderit, velit iure fugiat debitis repellat assumenda perspiciatis? Commodi minus labore sit dolorem reprehenderit eveniet porro asperiores.</p>
+    </columns>
+  </row>
+
 </container>