Upgrade to Susy 3 and replace grid mixins with new span and gutter functions

Most of Susy's mixins have been deprecated, `@include container()`, `@include full()`, `@include span()`, `@include prefix()`, `@include suffix()`, `@include gallery()`, etc.

Fixes #1114

Author: mmistakes

_sass/minimal-mistakes/_archive.scss

@@ -6,12 +6,13 @@
   margin-bottom: 2em;
 
   @include breakpoint($medium) {
-    @include span(12 of 12);
+    width: span(12 of 12);
   }
 
   @include breakpoint($large) {
-    @include span(10 of 12 last);
-    @include prefix(0.5 of 12);
+    float: right;
+    padding-left: gutter(0.5 of 12);
+    width: span(10 of 12);
   }
 
   a {
@@ -108,6 +109,50 @@
 .grid__item {
   margin-bottom: 2em;
 
+  @include breakpoint($small) {
+    float: left;
+    width: span(5 of 10);
+
+    &:nth-child(2n+1) {
+      clear: both;
+      margin-left: 0;
+    }
+
+    &:nth-child(2n+2) {
+      clear: none;
+      margin-left: gutter(of 10);
+    }
+  }
+
+  @include breakpoint($medium) {
+    margin-left: 0; /* override margin*/
+    margin-right: 0; /* override margin*/
+    width: span(3 of 12);
+
+    &:nth-child(2n+1) {
+      clear: none;
+    }
+
+    &:nth-child(4n+1) {
+      clear: both;
+    }
+
+    &:nth-child(4n+2) {
+      clear: none;
+      margin-left: gutter(1 of 12);
+    }
+
+    &:nth-child(4n+3) {
+      clear: none;
+      margin-left: gutter(1 of 12);
+    }
+
+    &:nth-child(4n+4) {
+      clear: none;
+      margin-left: gutter(1 of 12);
+    }
+  }
+
   .page__meta {
     margin: 0 0 4px;
   }
@@ -119,27 +164,21 @@
 
   .archive__item-excerpt {
     display: none;
-  }
 
-  @include breakpoint($small) {
-    @include gallery(5 of 10);
-    .archive__item-teaser {
-      max-height: 200px;
+    @include breakpoint($medium) {
+      display: block;
+      font-size: $type-size-6;
     }
   }
 
-  @include breakpoint($medium) {
-    margin-left: 0; /* reset before mixin does its thing*/
-    margin-right: 0; /* reset before mixin does its thing*/
-    @include gallery(2.5 of 10);
+  .archive__item-teaser {
 
-    .archive__item-teaser {
-      max-height: 120px;
+    @include breakpoint($small) {
+      max-height: 200px;
     }
 
-    .archive__item-excerpt {
-      display: block;
-      font-size: $type-size-6;
+    @include breakpoint($medium) {
+      max-height: 120px;
     }
   }
 }
@@ -160,8 +199,24 @@
   font-size: 1.25rem;
 
   @include breakpoint($small) {
+    float: left;
     margin-bottom: 0;
-    @include gallery(4 of 12);
+    width: span(4 of 12);
+
+    &:nth-child(3n+1) {
+      clear: both;
+      margin-left: 0;
+    }
+
+    &:nth-child(3n+2) {
+      clear: none;
+      margin-left: gutter(of 12);
+    }
+
+    &:nth-child(3n+3) {
+      clear: none;
+      margin-left: gutter(of 12);
+    }
 
     .feature__item-teaser {
       max-height: 200px;
@@ -170,28 +225,39 @@
   }
 
   &--left {
-    @include full();
+    float: left;
+    margin-left: 0;
+    margin-right: 0;
+    width: 100%;
+    clear: both;
     font-size: 1.25rem;
 
     .archive__item-teaser {
       margin-bottom: 2em;
     }
 
     @include breakpoint($small) {
+
       .archive__item-teaser {
-        @include span(5 of 12);
+        float: left;
+        width: span(5 of 12);
       }
 
       .archive__item-body {
-        @include span(7 of 12 last);
-        @include prefix(0.5 of 12);
-        @include suffix(1 of 12);
+        float: right;
+        padding-left: gutter(0.5 of 12);
+        padding-right: gutter(1 of 12);
+        width: span(7 of 12);
       }
     }
   }
 
   &--right {
-    @include full();
+    float: left;
+    margin-left: 0;
+    margin-right: 0;
+    width: 100%;
+    clear: both;
     font-size: 1.25rem;
 
     .archive__item-teaser {
@@ -202,19 +268,25 @@
       text-align: right;
 
       .archive__item-teaser {
-        @include span(5 of 12 rtl);
+        float: right;
+        width: span(5 of 12);
       }
 
       .archive__item-body {
-        @include span(7 of 12 last rtl);
-        @include prefix(0.5 of 12);
-        @include suffix(1 of 12);
+        float: right;
+        width: span(7 of 12);
+        padding-left: gutter(0.5 of 12);
+        padding-right: gutter(1 of 12);
       }
     }
   }
 
   &--center {
-    @include full();
+    float: left;
+    margin-left: 0;
+    margin-right: 0;
+    width: 100%;
+    clear: both;
     font-size: 1.25rem;
 
     .archive__item-teaser {

_sass/minimal-mistakes/_footer.scss

@@ -3,13 +3,15 @@
    ========================================================================== */
 
 .page__footer {
-  @include full();
   @include clearfix;
+  float: left;
+  margin-left: 0;
+  margin-right: 0;
+  width: 100%;
+  clear: both;
   /* sticky footer fix start */
   position: absolute;
   bottom: 0;
-  width: 100%;
-  clear: both;
   height: auto;
   /* sticky footer fix end */
   margin-top: 3em;
@@ -22,9 +24,11 @@
   border-top: 1px solid $light-gray;
 
   footer {
-    @include container;
     @include clearfix;
+    margin-left: auto;
+    margin-right: auto;
     margin-top: 2em;
+    max-width: 100%;
     padding: 0 1em 2em;
 
     @include breakpoint($x-large) {