add footer

imports/ui/components/AccountPageFooter/AccountPageFooter.scss

@@ -1,7 +1,7 @@
 @import '../../stylesheets/colors';
 
 .AccountPageFooter {
-  margin-top: 25px;
+  margin: 25px 0 0;
   padding-top: 20px;
   border-top: 1px solid $gray-lighter;
 }

imports/ui/components/Footer/Footer.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { year } from '@cleverbeagle/dates';
+import { Link } from 'react-router-dom';
+import { Grid } from 'react-bootstrap';
+
+import './Footer.scss';
+
+const copyrightYear = () => {
+  const currentYear = year();
+  return currentYear === '2017' ? '2017' : `2017-${currentYear}`;
+};
+
+const Footer = () => (
+  <div className="Footer">
+    <Grid>
+      <p className="pull-left">&copy; {copyrightYear()} Application Name</p>
+      <ul className="pull-right">
+        <li><Link to="/terms">Terms<span className="hidden-xs"> of Service</span></Link></li>
+        <li><Link to="/privacy">Privacy<span className="hidden-xs"> Policy</span></Link></li>
+      </ul>
+    </Grid>
+  </div>
+);
+
+Footer.propTypes = {};
+
+export default Footer;

imports/ui/components/Footer/Footer.scss

@@ -0,0 +1,53 @@
+@import '../../stylesheets/mixins';
+@import '../../stylesheets/colors';
+
+html {
+  position: relative;
+  min-height: 100%;
+}
+
+body {
+  margin-bottom: 80px;
+}
+
+.Footer {
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  height: 60px;
+  background-color: #fff;
+  border-top: 1px solid $gray-lighter;
+  padding: 20px 0;
+
+  p {
+    color: $gray-light;
+  }
+
+  ul {
+    list-style: none;
+    padding: 0;
+  }
+
+  ul li {
+    float: left;
+
+    &:first-child {
+      margin-right: 15px;
+    }
+
+    a {
+      color: $gray-light;
+    }
+
+    a:hover {
+      text-decoration: none;
+      color: $gray;
+    }
+  }
+}
+
+@include breakpoint(tablet) {
+  .Footer ul li:first-child {
+    margin-right: 30px;
+  }
+}