adds preheader styles

diff --git a/scss/components/_typography.scss b/scss/components/_typography.scss
index 7b8250e012f6f9c4d5b835d3c98aa0dd25897274..b206b4ec9a5f4abfb9c951a779039583d985adf4 100755 (executable)
--- a/scss/components/_typography.scss
+++ b/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;
+}
+
 

diff --git a/test/visual/pages/alignment.html b/test/visual/pages/alignment.html
index 0340a550bb70abe7751c98e530fe2e07c45d2558..555d704e72efc4a50bfe57aee4a444af1cb8b0aa 100644 (file)
--- a/test/visual/pages/alignment.html
+++ b/test/visual/pages/alignment.html
@@ -49,22 +49,38 @@
   </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>