From b8751aa771d6cc200bb5b2009278dad4cc615f60 Mon Sep 17 00:00:00 2001
From: benjaminapetersen <admin@benjaminapetersen.me>
Date: Wed, 23 Mar 2016 16:27:53 -0400
Subject: [PATCH] Add _spacers.less to generate pad/mar utility classes

---
 app/styles/_spacers.less | 51 ++++++++++++++++++++++++++++++++++++++++
 app/styles/main.less     |  1 +
 2 files changed, 52 insertions(+)
 create mode 100644 app/styles/_spacers.less

diff --git a/app/styles/_spacers.less b/app/styles/_spacers.less
new file mode 100644
index 0000000000..8f1c8c93b2
--- /dev/null
+++ b/app/styles/_spacers.less
@@ -0,0 +1,51 @@
+// Spacing utility classes
+// creates:
+//  .pad-sm, .pad-md, .pad-lg, etc
+//  .mar-sm, .mar-md, .mar-lg, etc
+//  .pad-left-sm, .mar-left-sm, etc
+//
+@nil: none 0 e('!important');
+// @auto 0 auto; is built into the fn below
+@xs: xs 3px e('');
+@sm: sm 5px e('');
+@md: md 10px e('');
+@lg: lg 15px e('');
+@xl: xl 20px e('');
+@xxl: xxl 30px e('');
+
+@sizes: @nil, @xs, @sm, @md, @lg, @xl, @xxl;
+@sides: top, right, bottom, left;
+
+.spacer-side(@list, @size, @px, @mod, @i:1) when (@i <= length(@list)) {
+  @side: extract(@list, @i);
+  .pad-@{side}-@{size} {
+    padding-@{side}: @px @mod;
+  }
+  .mar-@{side}-@{size} {
+    margin-@{side}: @px @mod;
+  }
+  .spacer-side(@list, @size, @px, @mod, @i+1);
+}
+
+.spacers(@list, @i:1) when (@i <= length(@list)) {
+  @item: extract(@list, @i);
+  @key: extract(@item, 1);
+  @val: extract(@item, 2);
+  @mod: extract(@item, 3);
+  .pad-auto-@{key} {
+    padding: 0 auto;
+  }
+  .mar-auto-@{key} {
+    margin: 0 auto;
+  }
+  .pad-@{key} {
+    padding: @val @val * 1.5;
+  }
+  .mar-@{key} {
+    margin: @val @val * 1.5;
+  }
+  .spacer-side(@sides, @key, @val, @mod);
+  .spacers(@list, @i+1);
+}
+
+.spacers(@sizes);
diff --git a/app/styles/main.less b/app/styles/main.less
index 75ec05889a..45b0a585ad 100644
--- a/app/styles/main.less
+++ b/app/styles/main.less
@@ -103,5 +103,6 @@
 @import "_tile.less";
 @import "_topology.less";
 @import "_typography.less";
+@import "_spacers.less";
 @import "_log.less";
 @import "_settings.less";