Add lead class for ps and imgs

hydecorp · Sep 29, 2016 · aad8799 · aad8799
1 parent 0707241
commit aad8799
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 10 deletions.
diff --git a/_posts/2012-02-07-example-content.md b/_posts/2012-02-07-example-content.md
@@ -76,7 +76,7 @@ Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Morbi leo r
 
 Quisque consequat sapien eget quam rhoncus, sit amet laoreet diam tempus. Aliquam aliquam metus erat, a pulvinar turpis suscipit at.
 
-![placeholder](http://placehold.it/800x400 "Large example image")
+![placeholder](http://placehold.it/800x400 "Large example image"){:.lead}
 ![placeholder](http://placehold.it/400x200 "Medium example image")
 ![placeholder](http://placehold.it/200x200 "Small example image")
 

diff --git a/_sass/pooleparty/_base.scss b/_sass/pooleparty/_base.scss
@@ -48,4 +48,11 @@ img {
   margin: 0 0 1rem;
   // No border radius to be consistent with code/math
   // border-radius: 5px;
+
+  &.lead {
+    max-width: calc(100% + 2rem);
+    width: calc(100% + 2rem);
+    margin-left: calc(-1rem);
+    margin-right: calc(-1rem);
+  }
 }
diff --git a/_sass/pooleparty/_type-essential.scss b/_sass/pooleparty/_type-essential.scss
@@ -22,6 +22,11 @@ h2 {
 p {
   margin-top: 0;
   margin-bottom: 1rem;
+
+  &.lead {
+    font-size: 1.25rem;
+    font-weight: 300;
+  }
 }
 
 ul, ol, dl {
@@ -36,12 +41,3 @@ hr {
   border-top: 1px solid #eee;
   border-bottom: 1px solid #fff;
 }
-
-// Custom type
-//
-// Extend paragraphs with `.lead` for larger introductory text.
-
-.lead {
-  font-size: 1.25rem;
-  font-weight: 300;
-}