Add helper classes for adding top/bottom margin

dlech · dlech · commit 61be08acc0a7 · 2016-10-16T15:14:09.000-05:00
diff --git a/stylesheets/site-structure.scss b/stylesheets/site-structure.scss
@@ -144,4 +144,17 @@ ul + p, ol + p {
 // Font size on large buttons
 .xl-button-text {
     font-size: 22px;
-}
+}
+
+// thanks http://stackoverflow.com/a/32490429/1976323
+$margins: (xs: 0.5rem, sm: 1rem, md: 1.5rem, lg: 2rem, xl: 2.5rem);
+
+@each $name, $value in $margins {
+  .margin-top-#{$name} {
+    margin-top: $value;
+  }
+
+  .margin-bottom-#{$name} {
+    margin-bottom: $value;
+  }
+}
