Generate all margin / padding helper classes

Author: kylegordy

assets/_sass/utilities/_spacing.scss

@@ -2,6 +2,36 @@
 // Spacing
 ////////////////////
 
-.m-0 {
-    margin: 0 !important;
+$spacer: 1em;
+
+$spacers: (
+    0: 0,
+    1: ($spacer * .25),
+    2: ($spacer * .5),
+    3: $spacer,
+    4: ($spacer * 2),
+    5: ($spacer * 3),
+    6: ($spacer * 4),
+    7: ($spacer * 6)
+);
+
+$xy-border: (
+    top: t,
+    bottom: b,
+    left: l,
+    right: r
+);
+
+@each $prop, $letter in (margin: m, padding: p) {
+    .#{$letter}-#{0} {
+        #{$prop}: 0;
+    }
+
+    @each $direction, $d in $xy-border {
+        @each $unit, $em in $spacers {
+            .#{$letter}#{$d}-#{$unit} {
+                #{$prop}-#{$direction}: #{$em};
+            }
+        }
+    }
 }

projects.html

@@ -10,7 +10,7 @@
 ---
 
 <div class="container">
-    <h2>Open Source Projects</h2>
+    <h2 class="mb-3">Open Source Projects</h2>
 
     <ul class="card-grid">
         {% assign public_repositories = site.github.public_repositories | where:'archived', false | where:'fork', false | sort: 'stargazers_count' | reverse %}