feat: introduce global footer

Include a footer on each page which
links through to the global TWC page.

_includes/footer.html

@@ -0,0 +1,6 @@
+<footer class="footer">
+  <div class="footer-container">
+    <img alt="" role="presentation" aria-hidden="true" height="40" src="/assets/css/images/logo.svg" width="40" class="logo">
+    Proud to be part of the <a href="https://techworkerscoalition.org/">Tech Workers Coalition</a>
+  </div>
+</footer>

_includes/main.scss

@@ -10,6 +10,7 @@
 @import "structures/event";
 
 @import "header";
+@import "footer";
 
 @import "layouts/home";
 
@@ -105,6 +106,13 @@ input[type="submit"] {
   }
 }
 
+html, body { min-height: 100vh; }
+
+body > footer {
+  position: sticky;
+  top: 100vh;
+}
+
 blockquote,
 ol,
 p,

_layouts/default.html

@@ -8,6 +8,9 @@
     <main class="{{ page.templateClass }}">
       {{ content }}
     </main>
+
+    {% include footer.html %}
+
     <script type="text/javascript">{% include main.js %}</script>
   </body>
 </html>

_sass/_footer.scss

@@ -0,0 +1,49 @@
+@import 'variables';
+
+// https://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.html 
+//
+// grayscale      ex: filter: grayscale(100%);
+// sepia          ex: filter: sepia(100%);
+// saturate       ex: filter: saturate(0%);
+// hue-rotate     ex: filter: hue-rotate(45deg);
+// invert         ex: filter: invert(100%);
+// brightness     ex: filter: brightness(15%);
+// contrast       ex: filter: contrast(200%);
+// blur           ex: filter: blur(2px);
+
+@mixin filter($filter-type,$filter-amount) { 
+  -webkit-filter: $filter-type+unquote('(#{$filter-amount})');
+  -moz-filter: $filter-type+unquote('(#{$filter-amount})');
+  -ms-filter: $filter-type+unquote('(#{$filter-amount})');
+  -o-filter: $filter-type+unquote('(#{$filter-amount})');
+  filter: $filter-type+unquote('(#{$filter-amount})');
+}
+
+.footer {
+  border-top: 1px solid;
+  padding: 2em 2em;
+  background: #000;
+  color: #fff;
+  text-align: left;
+
+  a {
+    color: #fff;
+    display: inline-block;
+    margin-left: .25em;
+
+    &:hover {
+      color: #e6141b;
+    }
+  }
+
+  &-container {
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+  }
+
+  .logo {
+    @include filter(invert, 1);
+    margin-right: 10px;
+  }
+}