add static pages

imports/ui/pages/Index/Index.js

@@ -15,6 +15,9 @@ const Index = () => (
       <Button href="https://pup.cleverbeagle.com">Read the Docs</Button>
       <Button href="https://github.com/cleverbeagle/pup"><i className="fa fa-star" /> Star on GitHub</Button>
     </div>
+    <footer>
+      <p>Need help and want to stay accountable building your product? <a href="https://cleverbeagle.com?utm_source=pupappindex&utm_campaign=oss">Check out Clever Beagle</a>.</p>
+    </footer>
   </div>
 );
 

imports/ui/pages/Index/Index.scss

@@ -33,14 +33,23 @@
     .btn {
       border: none;
     }
+  }
 
-    .btn:last-child {
-      background: darken($cb-blue, 20%);
-      color: lighten($cb-blue, 30%);
+  footer {
+    margin: 20px -20px -20px;
+    border-top: 1px solid darken($cb-blue, 10%);
+    padding: 20px;
 
-      &:hover {
-        color: #fff;
-      }
+    p {
+      font-size: 14px;
+      line-height: 22px;
+      color: lighten($cb-blue, 35%);
+      margin: 0;
+    }
+
+    p a {
+      color: lighten($cb-blue, 35%);
+      text-decoration: underline;
     }
   }
 }
@@ -48,11 +57,19 @@
 @include breakpoint(tablet) {
   .Index {
     padding: 30px;
+
+    footer {
+      margin: 30px -30px -30px;
+    }
   }
 }
 
 @include breakpoint(desktop) {
   .Index {
     padding: 40px;
+
+    footer {
+      margin: 40px -40px -40px;
+    }
   }
 }

imports/ui/pages/Page/Page.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Meteor } from 'meteor/meteor';
+import { createContainer } from 'meteor/react-meteor-data';
+import { ReactiveVar } from 'meteor/reactive-var';
+import PageHeader from '../../components/PageHeader/PageHeader';
+import Content from '../../components/Content/Content';
+
+import './Page.scss';
+
+const Page = ({ title, subtitle, content }) => (
+  <div className="Page">
+    <PageHeader title={title} subtitle={subtitle} />
+    <Content content={content} />
+  </div>
+);
+
+Page.defaultProps = {
+  subtitle: '',
+};
+
+Page.propTypes = {
+  title: PropTypes.string.isRequired,
+  subtitle: PropTypes.string,
+  content: PropTypes.string.isRequired,
+};
+
+const pageContent = new ReactiveVar('');
+
+export default createContainer(({ content, page }) => {
+  window.scrollTo(0, 0); // Force window to top of page.
+
+  Meteor.call('utility.getPage', page, (error, response) => {
+    if (error) {
+      console.warn(error);
+    } else {
+      pageContent.set(response);
+    }
+  });
+
+  return {
+    content: content || pageContent.get(),
+  };
+}, Page);

imports/ui/pages/Page/Page.scss

@@ -0,0 +1,11 @@
+@import '../../stylesheets/mixins';
+
+.Page {
+  margin-bottom: 0px;
+}
+
+@include breakpoint(tablet) {
+  .Page {
+    margin-bottom: 30px;
+  }
+}

imports/ui/pages/Privacy/Privacy.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import Page from '../Page/Page';
+
+const Privacy = () => (
+  <div className="Privacy">
+    <Page
+      title="Privacy Policy"
+      subtitle="Last updated May 29th, 2017"
+      page="privacy"
+    />
+  </div>
+);
+
+export default Privacy;

imports/ui/pages/Terms/Terms.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import Page from '../Page/Page';
+
+const Terms = () => (
+  <div className="Terms">
+    <Page
+      title="Terms of Service"
+      subtitle="Last updated May 29th, 2017"
+      page="terms"
+    />
+  </div>
+);
+
+export default Terms;