From 42ed9616b5b8593f8f61ece3386aed37d1c83bf4 Mon Sep 17 00:00:00 2001
From: Jori Lallo <jtlallo@gmail.com>
Date: Wed, 11 Oct 2017 00:14:45 -0700
Subject: [PATCH 01/10] Added cookie to indicate logged in status

---
 frontend/stores/AuthStore.js |  2 ++
 frontend/utils/ApiClient.js  |  1 +
 package.json                 |  3 ++-
 server/api/auth.js           |  8 ++++++++
 server/routes.js             | 29 ++++++++++++++++++++---------
 yarn.lock                    | 26 +++++++++++++++-----------
 6 files changed, 48 insertions(+), 21 deletions(-)

diff --git a/frontend/stores/AuthStore.js b/frontend/stores/AuthStore.js
index c0c7800e9..99c8305bd 100644
--- a/frontend/stores/AuthStore.js
+++ b/frontend/stores/AuthStore.js
@@ -1,6 +1,7 @@
 // @flow
 import { observable, action, computed, autorunAsync } from 'mobx';
 import invariant from 'invariant';
+import Cookie from 'js-cookie';
 import { client } from 'utils/ApiClient';
 import type { User, Team } from 'types';
 
@@ -33,6 +34,7 @@ class AuthStore {
   @action logout = () => {
     this.user = null;
     this.token = null;
+    Cookie.remove('loggedId', { path: '/' });
   };
 
   @action getOauthState = () => {
diff --git a/frontend/utils/ApiClient.js b/frontend/utils/ApiClient.js
index 3c7ff2bea..c94ed2f24 100644
--- a/frontend/utils/ApiClient.js
+++ b/frontend/utils/ApiClient.js
@@ -52,6 +52,7 @@ class ApiClient {
       body,
       headers,
       redirect: 'follow',
+      credentials: 'include',
     });
 
     // Handle request promises and return a new promise
diff --git a/package.json b/package.json
index 11e75b1e5..e391dc57a 100644
--- a/package.json
+++ b/package.json
@@ -77,7 +77,7 @@
     "babel-preset-react": "6.11.1",
     "babel-preset-react-hmre": "1.1.1",
     "babel-regenerator-runtime": "6.5.0",
-    "bcrypt": "^0.8.7",
+    "bcrypt": "1.0.3",
     "boundless-arrow-key-navigation": "^1.0.4",
     "boundless-popover": "^1.0.4",
     "bugsnag": "^1.7.0",
@@ -107,6 +107,7 @@
     "imports-loader": "0.6.5",
     "invariant": "^2.2.2",
     "isomorphic-fetch": "2.2.1",
+    "js-cookie": "^2.1.4",
     "js-search": "^1.4.2",
     "js-tree": "1.1.0",
     "json-loader": "0.5.4",
diff --git a/server/api/auth.js b/server/api/auth.js
index 42752b477..e41890d5e 100644
--- a/server/api/auth.js
+++ b/server/api/auth.js
@@ -47,6 +47,14 @@ router.post('auth.slack', async ctx => {
     await team.createFirstCollection(user.id);
   }
 
+  // Signal to backend that the user is logged in.
+  // This is only used to signal SSR rendering, not
+  // used for auth.
+  ctx.cookies.set('loggedId', 'true', {
+    httpOnly: false,
+    expires: new Date('2100'),
+  });
+
   ctx.body = {
     data: {
       user: await presentUser(ctx, user),
diff --git a/server/routes.js b/server/routes.js
index 5d1987a02..2a4c5bc0b 100644
--- a/server/routes.js
+++ b/server/routes.js
@@ -1,21 +1,22 @@
 import path from 'path';
+import fs from 'fs';
 import httpErrors from 'http-errors';
 import Koa from 'koa';
 import Router from 'koa-router';
 import sendfile from 'koa-sendfile';
-
 import subdomainRedirect from './middlewares/subdomainRedirect';
 
 const koa = new Koa();
 const router = new Router();
 
-router.get('/service-worker.js', async ctx => {
-  ctx.set('Content-Type', 'application/javascript');
-  if (process.env.NODE_ENV === 'production')
-    ctx.set('Cache-Control', `max-age=${30}`);
-  await sendfile(ctx, path.join(__dirname, './static/service-worker.js'));
-  if (!ctx.status) ctx.throw(httpErrors.NotFound());
-});
+const readFile = src => {
+  return new Promise((resolve, reject) => {
+    fs.readFile(src, { encoding: 'utf8' }, (err, data) => {
+      if (err) return reject(err);
+      resolve(data);
+    });
+  });
+};
 
 router.get('/_health', ctx => (ctx.body = 'OK'));
 
@@ -31,6 +32,13 @@ if (process.env.NODE_ENV === 'production') {
     );
   });
 
+  router.get('/', async ctx => {
+    const html = await readFile(path.join(__dirname, '../dist/index.html'));
+    ctx.body = html;
+
+    if (!ctx.status) ctx.throw(httpErrors.NotFound());
+  });
+
   router.get('*', async ctx => {
     await sendfile(ctx, path.join(__dirname, '../dist/index.html'));
     if (!ctx.status) ctx.throw(httpErrors.NotFound());
@@ -39,7 +47,10 @@ if (process.env.NODE_ENV === 'production') {
   koa.use(subdomainRedirect());
 } else {
   router.get('*', async ctx => {
-    await sendfile(ctx, path.join(__dirname, './static/dev.html'));
+    console.log(ctx.cookies.get('loggedIn'));
+    const html = await readFile(path.join(__dirname, './static/dev.html'));
+    ctx.body = html;
+
     if (!ctx.status) ctx.throw(httpErrors.NotFound());
   });
 }
diff --git a/yarn.lock b/yarn.lock
index 8afd54995..294344d8d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1041,12 +1041,12 @@ bcrypt-pbkdf@^1.0.0:
   dependencies:
     tweetnacl "^0.14.3"
 
-bcrypt@^0.8.7:
-  version "0.8.7"
-  resolved "https://registry.yarnpkg.com/bcrypt/-/bcrypt-0.8.7.tgz#bc3875a9afd0a7b2cd231a6a7f218a5ce156b093"
+bcrypt@1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/bcrypt/-/bcrypt-1.0.3.tgz#b02ddc6c0b52ea16b8d3cf375d5a32e780dab548"
   dependencies:
-    bindings "1.2.1"
-    nan "2.3.5"
+    nan "2.6.2"
+    node-pre-gyp "0.6.36"
 
 beeper@^1.0.0:
   version "1.1.1"
@@ -1067,10 +1067,6 @@ binary-extensions@^1.0.0:
     buffers "~0.1.1"
     chainsaw "~0.1.0"
 
-bindings@1.2.1:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/bindings/-/bindings-1.2.1.tgz#14ad6113812d2d37d72e67b4cacb4bb726505f11"
-
 block-stream@*:
   version "0.0.9"
   resolved "https://registry.yarnpkg.com/block-stream/-/block-stream-0.0.9.tgz#13ebfe778a03205cfe03751481ebb4b3300c126a"
@@ -4858,6 +4854,10 @@ js-beautify@^1.6.11:
     mkdirp "~0.5.0"
     nopt "~3.0.1"
 
+js-cookie@^2.1.4:
+  version "2.1.4"
+  resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-2.1.4.tgz#da4ec503866f149d164cf25f579ef31015025d8d"
+
 js-search@^1.4.2:
   version "1.4.2"
   resolved "https://registry.yarnpkg.com/js-search/-/js-search-1.4.2.tgz#59a91e117d6badb20bf0d7643ba7577d5a81d7e2"
@@ -6030,7 +6030,11 @@ mz@2:
     object-assign "^4.0.1"
     thenify-all "^1.0.0"
 
-nan@2.3.5, nan@^2.3.0:
+nan@2.6.2:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/nan/-/nan-2.6.2.tgz#e4ff34e6c95fdfb5aecc08de6596f43605a7db45"
+
+nan@^2.3.0:
   version "2.3.5"
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.3.5.tgz#822a0dc266290ce4cd3a12282ca3e7e364668a08"
 
@@ -6185,7 +6189,7 @@ node-notifier@^5.0.2:
     shellwords "^0.1.0"
     which "^1.2.12"
 
-node-pre-gyp@^0.6.36:
+node-pre-gyp@0.6.36, node-pre-gyp@^0.6.36:
   version "0.6.36"
   resolved "https://registry.yarnpkg.com/node-pre-gyp/-/node-pre-gyp-0.6.36.tgz#db604112cb74e0d477554e9b505b17abddfab786"
   dependencies:

From aceaf261d258a4c045924da35bd477a9525f377e Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Sun, 22 Oct 2017 16:33:10 -0700
Subject: [PATCH 02/10] Working on 'static' pages

---
 frontend/components/Layout/Layout.js          | 19 ++---
 frontend/components/PageTitle/PageTitle.js    |  6 +-
 .../components/SlackAuthLink/SlackAuthLink.js |  8 +-
 package.json                                  |  3 +-
 server/api/auth.js                            |  2 +-
 server/pages/Home.js                          | 40 +++++++++
 server/pages/components/Layout.js             | 26 ++++++
 server/routes.js                              | 74 ++++++++++++-----
 server/static/home.html                       | 64 ++++++++++++++
 yarn.lock                                     | 83 +++++++++++--------
 10 files changed, 249 insertions(+), 76 deletions(-)
 create mode 100644 server/pages/Home.js
 create mode 100644 server/pages/components/Layout.js
 create mode 100644 server/static/home.html

diff --git a/frontend/components/Layout/Layout.js b/frontend/components/Layout/Layout.js
index 22dc66b93..a49b21b18 100644
--- a/frontend/components/Layout/Layout.js
+++ b/frontend/components/Layout/Layout.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import { withRouter } from 'react-router-dom';
-import Helmet from 'react-helmet';
+import { Helmet } from 'react-helmet';
 import styled from 'styled-components';
 import { observer, inject } from 'mobx-react';
 import keydown from 'react-keydown';
@@ -99,18 +99,15 @@ type Props = {
 
     return (
       <Container column auto>
-        <Helmet
-          title="Atlas"
-          meta={[
-            {
-              name: 'viewport',
-              content: 'width=device-width, initial-scale=1.0',
-            },
-          ]}
-        />
+        <Helmet>
+          <title>Atlas</title>
+          <meta
+            name="viewport"
+            content="width=device-width, initial-scale=1.0"
+          />
+        </Helmet>
 
         {this.props.ui.progressBarVisible && <LoadingIndicatorBar />}
-
         {this.props.notifications}
 
         <Flex auto>
diff --git a/frontend/components/PageTitle/PageTitle.js b/frontend/components/PageTitle/PageTitle.js
index 1b3526a89..deb763670 100644
--- a/frontend/components/PageTitle/PageTitle.js
+++ b/frontend/components/PageTitle/PageTitle.js
@@ -1,11 +1,13 @@
 // @flow
 import React from 'react';
-import Helmet from 'react-helmet';
+import { Helmet } from 'react-helmet';
 
 type Props = {
   title: string,
 };
 
-const PageTitle = ({ title }: Props) => <Helmet title={`${title} - Atlas`} />;
+const PageTitle = ({ title }: Props) => (
+  <Helmet><title>{`${title} - Atlas`}</title></Helmet>
+);
 
 export default PageTitle;
diff --git a/frontend/components/SlackAuthLink/SlackAuthLink.js b/frontend/components/SlackAuthLink/SlackAuthLink.js
index d8225c679..3bf9e164f 100644
--- a/frontend/components/SlackAuthLink/SlackAuthLink.js
+++ b/frontend/components/SlackAuthLink/SlackAuthLink.js
@@ -4,8 +4,8 @@ import { observer, inject } from 'mobx-react';
 import AuthStore from 'stores/AuthStore';
 
 type Props = {
-  children: React.Element<any>,
-  scopes?: Array<string>,
+  children: React$Element<*>,
+  scopes?: string[],
   auth: AuthStore,
   redirectUri: string,
 };
@@ -32,9 +32,7 @@ type Props = {
     };
 
     const urlParams = Object.keys(params)
-      .map(key => {
-        return `${key}=${encodeURIComponent(params[key])}`;
-      })
+      .map(key => `${key}=${encodeURIComponent(params[key])}`)
       .join('&');
 
     return `${baseUrl}?${urlParams}`;
diff --git a/package.json b/package.json
index dc878af4e..0206a7219 100644
--- a/package.json
+++ b/package.json
@@ -142,7 +142,7 @@
     "react-addons-css-transition-group": "15.3.2",
     "react-dom": "^15.6.1",
     "react-dropzone": "3.6.0",
-    "react-helmet": "3.1.0",
+    "react-helmet": "^5.2.0",
     "react-keydown": "^1.7.3",
     "react-modal": "^2.2.1",
     "react-portal": "^3.1.0",
@@ -166,6 +166,7 @@
     "string-hash": "^1.1.0",
     "style-loader": "^0.18.2",
     "styled-components": "^2.0.0",
+    "styled-components-grid": "^1.0.0-preview.15",
     "url-loader": "0.5.7",
     "uuid": "2.0.2",
     "validator": "5.2.0",
diff --git a/server/api/auth.js b/server/api/auth.js
index 8be7d0269..01bc6f1ad 100644
--- a/server/api/auth.js
+++ b/server/api/auth.js
@@ -50,7 +50,7 @@ router.post('auth.slack', async ctx => {
   // Signal to backend that the user is logged in.
   // This is only used to signal SSR rendering, not
   // used for auth.
-  ctx.cookies.set('loggedId', 'true', {
+  ctx.cookies.set('loggedIn', 'true', {
     httpOnly: false,
     expires: new Date('2100'),
   });
diff --git a/server/pages/Home.js b/server/pages/Home.js
new file mode 100644
index 000000000..147a93bd7
--- /dev/null
+++ b/server/pages/Home.js
@@ -0,0 +1,40 @@
+// @flow
+import React from 'react';
+import styled from 'styled-components';
+import Grid from 'styled-components-grid';
+
+const Unit = Grid.Unit;
+
+const Header = styled.div`
+  width: 100%;
+  padding: 3em;
+  text-align: center;
+`;
+
+export default function Home() {
+  return (
+    <Grid>
+      <Header>
+        <h1>Your team’s knowledge base</h1>
+        <p>
+          Documentation, meeting notes, playbooks, onboarding, work logs, brainstorming, decisions, & more…
+        </p>
+        <a href="">Sign In</a>
+      </Header>
+      <Unit size={{ desktop: 1 / 2 }} />
+      <Unit size={{ desktop: 1 / 2 }}>
+        <h2>Blazing Fast</h2>
+        <p>
+          Atlas is fast, really fast. We’ve trimmed 100ms and 50ms there to make sure that documents load instantly, search is speedy and there are keyboard shortcuts for everything.
+        </p>
+      </Unit>
+      <Unit size={{ desktop: 1 / 2 }}>
+        <h2>Markdown Support</h2>
+        <p>
+          Documents are stored in Markdown and you can export them at any time. Markdown shortcuts are also built right into the editor so you can easily format using markdown syntax or our GUI.
+        </p>
+      </Unit>
+      <Unit size={{ desktop: 1 / 2 }} />
+    </Grid>
+  );
+}
diff --git a/server/pages/components/Layout.js b/server/pages/components/Layout.js
new file mode 100644
index 000000000..6fe9d56fc
--- /dev/null
+++ b/server/pages/components/Layout.js
@@ -0,0 +1,26 @@
+// @flow
+import React from 'react';
+import { Helmet } from 'react-helmet';
+
+type Props = {
+  children?: React$Element<*>,
+};
+
+export default function Layout({ children }: Props) {
+  return (
+    <html lang="en">
+      <head>
+        <Helmet>
+          <title>Atlas</title>
+          <meta name="viewport" content="width=device-width, initial-scale=1" />
+        </Helmet>
+
+        {'{{HEAD}}'}
+        {'{{CSS}}'}
+      </head>
+      <body>
+        {children}
+      </body>
+    </html>
+  );
+}
diff --git a/server/routes.js b/server/routes.js
index 2a4c5bc0b..2d94fd097 100644
--- a/server/routes.js
+++ b/server/routes.js
@@ -1,13 +1,22 @@
+import React from 'react';
 import path from 'path';
 import fs from 'fs';
 import httpErrors from 'http-errors';
 import Koa from 'koa';
 import Router from 'koa-router';
 import sendfile from 'koa-sendfile';
+import ReactDOMServer from 'react-dom/server';
 import subdomainRedirect from './middlewares/subdomainRedirect';
+import { Helmet } from 'react-helmet';
 
+import { ServerStyleSheet, StyleSheetManager } from 'styled-components';
+import Layout from './pages/components/Layout';
+import Home from './pages/Home';
+
+const isProduction = process.env.NODE_ENV === 'production';
 const koa = new Koa();
 const router = new Router();
+const sheet = new ServerStyleSheet();
 
 const readFile = src => {
   return new Promise((resolve, reject) => {
@@ -18,6 +27,25 @@ const readFile = src => {
   });
 };
 
+const renderPage = children => {
+  const html = ReactDOMServer.renderToString(
+    <StyleSheetManager sheet={sheet.instance}>
+      <Layout>
+        {children}
+      </Layout>
+    </StyleSheetManager>
+  );
+
+  // helmet returns an object of meta tags with toString methods, urgh.
+  const helmet = Helmet.renderStatic();
+  let head = '';
+  Object.keys(helmet).forEach(key => (head += helmet[key].toString()));
+
+  return html
+    .replace('{{CSS}}', sheet.getStyleTags())
+    .replace('{{HEAD}}', head);
+};
+
 router.get('/_health', ctx => (ctx.body = 'OK'));
 
 if (process.env.NODE_ENV === 'production') {
@@ -31,30 +59,32 @@ if (process.env.NODE_ENV === 'production') {
       path.join(__dirname, '../dist/', ctx.path.substring(8))
     );
   });
-
-  router.get('/', async ctx => {
-    const html = await readFile(path.join(__dirname, '../dist/index.html'));
-    ctx.body = html;
-
-    if (!ctx.status) ctx.throw(httpErrors.NotFound());
-  });
-
-  router.get('*', async ctx => {
-    await sendfile(ctx, path.join(__dirname, '../dist/index.html'));
-    if (!ctx.status) ctx.throw(httpErrors.NotFound());
-  });
-
-  koa.use(subdomainRedirect());
-} else {
-  router.get('*', async ctx => {
-    console.log(ctx.cookies.get('loggedIn'));
-    const html = await readFile(path.join(__dirname, './static/dev.html'));
-    ctx.body = html;
-
-    if (!ctx.status) ctx.throw(httpErrors.NotFound());
-  });
 }
 
+router.get('/', async ctx => {
+  if (ctx.cookies.get('loggedIn')) {
+    if (isProduction) {
+      ctx.body = await readFile(path.join(__dirname, '../dist/index.html'));
+    } else {
+      ctx.body = await readFile(path.join(__dirname, './static/dev.html'));
+    }
+  } else {
+    ctx.body = await renderPage(<Home />);
+  }
+
+  if (!ctx.status) ctx.throw(httpErrors.NotFound());
+});
+
+router.get('*', async ctx => {
+  if (isProduction) {
+    ctx.body = await readFile(path.join(__dirname, '../dist/index.html'));
+  } else {
+    ctx.body = await readFile(path.join(__dirname, './static/dev.html'));
+  }
+  if (!ctx.status) ctx.throw(httpErrors.NotFound());
+});
+
+koa.use(subdomainRedirect());
 koa.use(router.routes());
 
 // 404 handler
diff --git a/server/static/home.html b/server/static/home.html
new file mode 100644
index 000000000..35a36c02e
--- /dev/null
+++ b/server/static/home.html
@@ -0,0 +1,64 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <title>Atlas</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" href="https://unpkg.com/tachyons@4.8.1/css/tachyons.min.css">
+  </head>
+  </head>
+  <body class="sans-serif dark-gray">
+    <section class="fl w-100 pa6 tc">
+      <h1 class="f2">Your team’s knowledge base</h1>
+      <p class="f4 mid-gray">Documentation, meeting notes, playbooks, onboarding, work logs, brainstorming, decisions, &amp; more…</p>
+      <a href="" class="bg-dark-gray br2 pa2 white no-underline">Sign In</a>
+    </section>
+
+    <section class="fl w-100">
+      <div class="fl w-50-l pa6">
+      </div>
+      <div class="fl w-50-l pa6 bg-light-gray">
+        <h2 class="f3">Blazing Fast</h2>
+        <p>Atlas is fast, really fast. We’ve trimmed 100ms and 50ms there to make sure that documents load instantly, search is speedy and there are keyboard shortcuts for everything.</p>
+      </div>
+    </section>
+
+    <section class="fl w-100">
+      <div class="fl w-50-l pa6 bg-light-gray">
+        <h2 class="f3">Markdown Support</h2>
+        <p>Documents are stored in Markdown and you can export them at any time. Markdown shortcuts are also built right into the editor so you can easily format using markdown syntax or our GUI.</p>
+      </div>
+      <div class="fl w-50-l pa6">
+      </div>
+    </section>
+
+    <section class="fl w-100">
+      <div class="fl w-50-l pa6">
+      </div>
+      <div class="fl w-50-l pa6 bg-light-gray">
+        <h2 class="f3">Beautiful Editor</h2>
+        <p>We built a custom editor from the ground up to be great looking, extensible, and a pleasure to use whether you're typing up quick notes or pages of documentation.</p>
+      </div>
+    </section>
+
+    <div class="fl w-33-l pa5">
+      <h2 class="f4">Powerful Search</h2>
+      <p>Built-in search makes that one document easy to find in a large knowledgebase.</p>
+    </div>
+    <div class="fl w-33-l pa5">
+      <h2 class="f4">API &amp; Integrations</h2>
+      <p>Atlas is built on it's own API, treat Atlas as a CMS or automatically great documents from outside events.</p>
+    </div>
+    <div class="fl w-33-l pa5">
+      <h2 class="f4">Open Source</h2>
+      <p>Want to contribute or host Atlas yourself? All of the code is on GitHub.</p>
+    </div>
+
+    <footer class="fl w-100">
+      <ul>
+        <li>About Us</li>
+        <li>Pricing</li>
+        <li>Contact</li>
+      </ul>
+    </footer>
+  </body>
+</html>
diff --git a/yarn.lock b/yarn.lock
index 3baf998b0..16383256b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2223,7 +2223,7 @@ decompress-response@^3.2.0:
   dependencies:
     mimic-response "^1.0.0"
 
-deep-equal@1.0.1, deep-equal@~1.0.1:
+deep-equal@^1.0.1, deep-equal@~1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/deep-equal/-/deep-equal-1.0.1.tgz#f5d260292b660e084eff4cdbc9f08ad3247448b5"
 
@@ -2967,7 +2967,7 @@ execa@^0.7.0:
     signal-exit "^3.0.0"
     strip-eof "^1.0.0"
 
-exenv@^1.2.0:
+exenv@^1.2.0, exenv@^1.2.1:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/exenv/-/exenv-1.2.2.tgz#2ae78e85d9894158670b03d47bec1f03bd91bb9d"
 
@@ -3096,14 +3096,6 @@ fbemitter@^2.1.1:
   dependencies:
     fbjs "^0.8.4"
 
-fbjs@0.1.0-alpha.10:
-  version "0.1.0-alpha.10"
-  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.1.0-alpha.10.tgz#46e457c09cbefb51fc752a3e030e7b67fcc384c8"
-  dependencies:
-    core-js "^1.0.0"
-    promise "^7.0.3"
-    whatwg-fetch "^0.9.0"
-
 fbjs@^0.8.4, fbjs@^0.8.5, fbjs@^0.8.9:
   version "0.8.14"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.14.tgz#d1dbe2be254c35a91e09f31f9cd50a40b2a0ed1c"
@@ -5538,7 +5530,7 @@ lodash.isstring@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/lodash.isstring/-/lodash.isstring-4.0.1.tgz#d527dfb5456eca7cc9bb95d5daeaf88ba54a5451"
 
-lodash.keys@^3.0.0, lodash.keys@^3.1.2:
+lodash.keys@^3.0.0:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/lodash.keys/-/lodash.keys-3.1.2.tgz#4dbc0472b156be50a0b286855d1bd0b0c656098a"
   dependencies:
@@ -7124,7 +7116,7 @@ progress@^1.1.8:
   version "1.1.8"
   resolved "https://registry.yarnpkg.com/progress/-/progress-1.1.8.tgz#e260c78f6161cdd9b0e56cc3e0a85de17c7a57be"
 
-promise@7.x, promise@^7.0.3, promise@^7.1.1:
+promise@7.x, promise@^7.1.1:
   version "7.3.1"
   resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
   dependencies:
@@ -7291,6 +7283,13 @@ react-addons-test-utils@^15.3.1:
   version "15.6.0"
   resolved "https://registry.yarnpkg.com/react-addons-test-utils/-/react-addons-test-utils-15.6.0.tgz#062d36117fe8d18f3ba5e06eb33383b0b85ea5b9"
 
+react-create-component-from-tag-prop@^1.2.1:
+  version "1.3.1"
+  resolved "https://registry.npmjs.org/react-create-component-from-tag-prop/-/react-create-component-from-tag-prop-1.3.1.tgz#5389407d99f88ba2b36351780a6094470b44a7c7"
+  dependencies:
+    lodash "^4.17.4"
+    react "^15.5.4"
+
 react-deep-force-update@^1.0.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/react-deep-force-update/-/react-deep-force-update-1.1.1.tgz#bcd31478027b64b3339f108921ab520b4313dc2c"
@@ -7314,15 +7313,14 @@ react-dropzone@3.6.0:
   dependencies:
     attr-accept "^1.0.3"
 
-react-helmet@3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/react-helmet/-/react-helmet-3.1.0.tgz#63486194682f33004826f3687dc49a138b557050"
+react-helmet@^5.2.0:
+  version "5.2.0"
+  resolved "https://registry.npmjs.org/react-helmet/-/react-helmet-5.2.0.tgz#a81811df21313a6d55c5f058c4aeba5d6f3d97a7"
   dependencies:
-    deep-equal "1.0.1"
-    object-assign "^4.0.1"
-    react-side-effect "1.0.2"
-    shallowequal "0.2.2"
-    warning "2.1.0"
+    deep-equal "^1.0.1"
+    object-assign "^4.1.1"
+    prop-types "^15.5.4"
+    react-side-effect "^1.1.0"
 
 react-keydown@^1.7.3:
   version "1.9.4"
@@ -7374,11 +7372,12 @@ react-router@^4.2.0:
     prop-types "^15.5.4"
     warning "^3.0.0"
 
-react-side-effect@1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/react-side-effect/-/react-side-effect-1.0.2.tgz#98e354decdbf0281e4223d87852d33e345eda561"
+react-side-effect@^1.1.0:
+  version "1.1.3"
+  resolved "https://registry.npmjs.org/react-side-effect/-/react-side-effect-1.1.3.tgz#512c25abe0dec172834c4001ec5c51e04d41bc5c"
   dependencies:
-    fbjs "0.1.0-alpha.10"
+    exenv "^1.2.1"
+    shallowequal "^1.0.1"
 
 react-test-renderer@^15.3.1:
   version "15.6.1"
@@ -7398,6 +7397,16 @@ react-transform-hmr@^1.0.3:
     global "^4.3.0"
     react-proxy "^1.1.7"
 
+react@^15.5.4:
+  version "15.6.2"
+  resolved "https://registry.npmjs.org/react/-/react-15.6.2.tgz#dba0434ab439cfe82f108f0f511663908179aa72"
+  dependencies:
+    create-react-class "^15.6.0"
+    fbjs "^0.8.9"
+    loose-envify "^1.1.0"
+    object-assign "^4.1.0"
+    prop-types "^15.5.10"
+
 react@^15.6.1:
   version "15.6.1"
   resolved "https://registry.yarnpkg.com/react/-/react-15.6.1.tgz#baa8434ec6780bde997cdc380b79cd33b96393df"
@@ -7999,11 +8008,9 @@ sha.js@^2.4.0, sha.js@^2.4.8:
   dependencies:
     inherits "^2.0.1"
 
-shallowequal@0.2.2:
-  version "0.2.2"
-  resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-0.2.2.tgz#1e32fd5bcab6ad688a4812cb0cc04efc75c7014e"
-  dependencies:
-    lodash.keys "^3.1.2"
+shallowequal@^1.0.1:
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/shallowequal/-/shallowequal-1.0.2.tgz#1561dbdefb8c01408100319085764da3fcf83f8f"
 
 shebang-command@^1.2.0:
   version "1.2.0"
@@ -8402,6 +8409,18 @@ style-loader@^0.18.2:
     loader-utils "^1.0.2"
     schema-utils "^0.3.0"
 
+styled-components-breakpoint@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.npmjs.org/styled-components-breakpoint/-/styled-components-breakpoint-1.0.1.tgz#51fb474d9449e228b6f3f2cd232631ec65c149bc"
+
+styled-components-grid@^1.0.0-preview.15:
+  version "1.0.0-preview.15"
+  resolved "https://registry.npmjs.org/styled-components-grid/-/styled-components-grid-1.0.0-preview.15.tgz#90c6a4caa22292f7a2d80f055395f3fa18cd6720"
+  dependencies:
+    prop-types "^15.5.8"
+    react-create-component-from-tag-prop "^1.2.1"
+    styled-components-breakpoint "^1.0.1"
+
 styled-components@^2.0.0:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-2.1.2.tgz#bb419978e1287c5d0d88fa9106b2dd75f66a324c"
@@ -9023,7 +9042,7 @@ walker@~1.0.5:
   dependencies:
     makeerror "1.0.x"
 
-warning@2.1.0, warning@^2.0.0:
+warning@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/warning/-/warning-2.1.0.tgz#21220d9c63afc77a8c92111e011af705ce0c6901"
   dependencies:
@@ -9118,10 +9137,6 @@ whatwg-fetch@>=0.10.0:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz#9c84ec2dcf68187ff00bc64e1274b442176e1c84"
 
-whatwg-fetch@^0.9.0:
-  version "0.9.0"
-  resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz#0e3684c6cb9995b43efc9df03e4c365d95fd9cc0"
-
 whatwg-url@^4.3.0:
   version "4.8.0"
   resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-4.8.0.tgz#d2981aa9148c1e00a41c5a6131166ab4683bbcc0"

From 802ce10f14f1e69852a6fd1eb26f6bd63a2377f6 Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Sun, 22 Oct 2017 17:16:57 -0700
Subject: [PATCH 03/10] POC

---
 flow-typed/npm/react-helmet_v3.x.x.js | 37 ---------------
 server/index.js                       |  2 +-
 server/pages/About.js                 | 27 +++++++++++
 server/pages/Home.js                  | 28 +++++++++++
 server/pages/Pricing.js               | 27 +++++++++++
 server/pages/components/Layout.js     |  2 +
 server/pages/components/Navigation.js | 14 ++++++
 server/routes.js                      | 67 ++++++++-------------------
 server/static/home.html               | 64 -------------------------
 server/utils/renderpage.js            | 27 +++++++++++
 10 files changed, 146 insertions(+), 149 deletions(-)
 delete mode 100644 flow-typed/npm/react-helmet_v3.x.x.js
 create mode 100644 server/pages/About.js
 create mode 100644 server/pages/Pricing.js
 create mode 100644 server/pages/components/Navigation.js
 delete mode 100644 server/static/home.html
 create mode 100644 server/utils/renderpage.js

diff --git a/flow-typed/npm/react-helmet_v3.x.x.js b/flow-typed/npm/react-helmet_v3.x.x.js
deleted file mode 100644
index 06a1432e1..000000000
--- a/flow-typed/npm/react-helmet_v3.x.x.js
+++ /dev/null
@@ -1,37 +0,0 @@
-// flow-typed signature: 7ee00cf01ba33eeba35dee9d286ece86
-// flow-typed version: 0d0440f3d3/react-helmet_v3.x.x/flow_>=v0.26.x
-
-declare module 'react-helmet' {
-  declare type Props = {
-    htmlAttributes?: Object,
-    title?: string,
-    defaultTitle?: string,
-    titleTemplate?: string,
-    base?: Object,
-    meta?: Array<Object>,
-    link?: Array<Object>,
-    script?: Array<Object>,
-    noscript?: Array<Object>,
-    style?: Array<Object>,
-    onChangeClientState?: (newState: Object, addedTags: Object, removeTags: Object) => void | mixed,
-  };
-  declare interface HeadAttribute {
-    toString(): string;
-    toComponent(): React$Element<*>;
-  }
-  declare interface Head {
-    htmlAttributes: HeadAttribute;
-    title: HeadAttribute;
-    base: HeadAttribute;
-    meta: HeadAttribute;
-    link: HeadAttribute;
-    script: HeadAttribute;
-    style: HeadAttribute;
-  }
-
-  declare class Helmet extends React$Component {
-    static rewind(): Head;
-    props: Props;
-  }
-  declare var exports: typeof Helmet;
-}
diff --git a/server/index.js b/server/index.js
index 10c7bb925..92eb0738e 100644
--- a/server/index.js
+++ b/server/index.js
@@ -46,7 +46,7 @@ if (process.env.NODE_ENV === 'development') {
         // use the same as in webpack
         publicPath: config.output.publicPath,
 
-        // options for formating the statistics
+        // options for formatting the statistics
         stats: {
           colors: true,
         },
diff --git a/server/pages/About.js b/server/pages/About.js
new file mode 100644
index 000000000..5d7c43d24
--- /dev/null
+++ b/server/pages/About.js
@@ -0,0 +1,27 @@
+// @flow
+import React from 'react';
+import styled from 'styled-components';
+import Grid from 'styled-components-grid';
+import { Helmet } from 'react-helmet';
+
+const Header = styled.div`
+  width: 100%;
+  padding: 3em;
+  text-align: center;
+`;
+
+export default function About() {
+  return (
+    <Grid>
+      <Helmet>
+        <title>About</title>
+      </Helmet>
+      <Header>
+        <h1>About Atlas</h1>
+        <p>
+          Just a proof of concept for multiple pages.
+        </p>
+      </Header>
+    </Grid>
+  );
+}
diff --git a/server/pages/Home.js b/server/pages/Home.js
index 147a93bd7..4eb54c01c 100644
--- a/server/pages/Home.js
+++ b/server/pages/Home.js
@@ -28,6 +28,7 @@ export default function Home() {
           Atlas is fast, really fast. We’ve trimmed 100ms and 50ms there to make sure that documents load instantly, search is speedy and there are keyboard shortcuts for everything.
         </p>
       </Unit>
+
       <Unit size={{ desktop: 1 / 2 }}>
         <h2>Markdown Support</h2>
         <p>
@@ -35,6 +36,33 @@ export default function Home() {
         </p>
       </Unit>
       <Unit size={{ desktop: 1 / 2 }} />
+
+      <Unit size={{ desktop: 1 / 2 }} />
+      <Unit size={{ desktop: 1 / 2 }}>
+        <h2>Markdown Support</h2>
+        <p>
+          Documents are stored in Markdown and you can export them at any time. Markdown shortcuts are also built right into the editor so you can easily format using markdown syntax or our GUI.
+        </p>
+      </Unit>
+
+      <Unit size={{ desktop: 1 / 3 }}>
+        <h2>Powerful Search</h2>
+        <p>
+          Built-in search makes that one document easy to find in a large knowledgebase.
+        </p>
+      </Unit>
+      <Unit size={{ desktop: 1 / 3 }}>
+        <h2>API & Integrations</h2>
+        <p>
+          Atlas is built on it’s own API, treat Atlas as a CMS or automatically great documents from outside events.
+        </p>
+      </Unit>
+      <Unit size={{ desktop: 1 / 3 }}>
+        <h2>Open Source</h2>
+        <p>
+          Want to contribute or host Atlas yourself? All of the code is on GitHub.
+        </p>
+      </Unit>
     </Grid>
   );
 }
diff --git a/server/pages/Pricing.js b/server/pages/Pricing.js
new file mode 100644
index 000000000..15e861c00
--- /dev/null
+++ b/server/pages/Pricing.js
@@ -0,0 +1,27 @@
+// @flow
+import React from 'react';
+import styled from 'styled-components';
+import Grid from 'styled-components-grid';
+import { Helmet } from 'react-helmet';
+
+const Header = styled.div`
+  width: 100%;
+  padding: 3em;
+  text-align: center;
+`;
+
+export default function Pricing() {
+  return (
+    <Grid>
+      <Helmet>
+        <title>Pricing</title>
+      </Helmet>
+      <Header>
+        <h1>Pricing</h1>
+        <p>
+          Just a proof of concept for multiple pages.
+        </p>
+      </Header>
+    </Grid>
+  );
+}
diff --git a/server/pages/components/Layout.js b/server/pages/components/Layout.js
index 6fe9d56fc..177381526 100644
--- a/server/pages/components/Layout.js
+++ b/server/pages/components/Layout.js
@@ -1,6 +1,7 @@
 // @flow
 import React from 'react';
 import { Helmet } from 'react-helmet';
+import Navigation from './Navigation';
 
 type Props = {
   children?: React$Element<*>,
@@ -19,6 +20,7 @@ export default function Layout({ children }: Props) {
         {'{{CSS}}'}
       </head>
       <body>
+        <Navigation />
         {children}
       </body>
     </html>
diff --git a/server/pages/components/Navigation.js b/server/pages/components/Navigation.js
new file mode 100644
index 000000000..7aefe5fc7
--- /dev/null
+++ b/server/pages/components/Navigation.js
@@ -0,0 +1,14 @@
+// @flow
+import React from 'react';
+
+export default function Navigation() {
+  return (
+    <nav>
+      <a href="/">Atlas</a>
+      <ul>
+        <li><a href="/about">About</a></li>
+        <li><a href="/pricing">Pricing</a></li>
+      </ul>
+    </nav>
+  );
+}
diff --git a/server/routes.js b/server/routes.js
index 2d94fd097..2f88a4b20 100644
--- a/server/routes.js
+++ b/server/routes.js
@@ -1,49 +1,27 @@
+// @flow
 import React from 'react';
 import path from 'path';
-import fs from 'fs';
 import httpErrors from 'http-errors';
 import Koa from 'koa';
 import Router from 'koa-router';
 import sendfile from 'koa-sendfile';
-import ReactDOMServer from 'react-dom/server';
 import subdomainRedirect from './middlewares/subdomainRedirect';
-import { Helmet } from 'react-helmet';
+import renderpage from './utils/renderpage';
 
-import { ServerStyleSheet, StyleSheetManager } from 'styled-components';
-import Layout from './pages/components/Layout';
 import Home from './pages/Home';
+import About from './pages/About';
+import Pricing from './pages/Pricing';
 
 const isProduction = process.env.NODE_ENV === 'production';
 const koa = new Koa();
 const router = new Router();
-const sheet = new ServerStyleSheet();
 
-const readFile = src => {
-  return new Promise((resolve, reject) => {
-    fs.readFile(src, { encoding: 'utf8' }, (err, data) => {
-      if (err) return reject(err);
-      resolve(data);
-    });
-  });
-};
-
-const renderPage = children => {
-  const html = ReactDOMServer.renderToString(
-    <StyleSheetManager sheet={sheet.instance}>
-      <Layout>
-        {children}
-      </Layout>
-    </StyleSheetManager>
-  );
-
-  // helmet returns an object of meta tags with toString methods, urgh.
-  const helmet = Helmet.renderStatic();
-  let head = '';
-  Object.keys(helmet).forEach(key => (head += helmet[key].toString()));
-
-  return html
-    .replace('{{CSS}}', sheet.getStyleTags())
-    .replace('{{HEAD}}', head);
+const renderapp = async ctx => {
+  if (isProduction) {
+    await sendfile(ctx, path.join(__dirname, '../dist/index.html'));
+  } else {
+    await sendfile(ctx, path.join(__dirname, './static/dev.html'));
+  }
 };
 
 router.get('/_health', ctx => (ctx.body = 'OK'));
@@ -61,33 +39,28 @@ if (process.env.NODE_ENV === 'production') {
   });
 }
 
+// static pages
+router.get('/about', ctx => renderpage(ctx, <About />));
+router.get('/pricing', ctx => renderpage(ctx, <Pricing />));
+
+// home page
 router.get('/', async ctx => {
   if (ctx.cookies.get('loggedIn')) {
-    if (isProduction) {
-      ctx.body = await readFile(path.join(__dirname, '../dist/index.html'));
-    } else {
-      ctx.body = await readFile(path.join(__dirname, './static/dev.html'));
-    }
+    await renderapp(ctx);
   } else {
-    ctx.body = await renderPage(<Home />);
+    await renderpage(ctx, <Home />);
   }
-
-  if (!ctx.status) ctx.throw(httpErrors.NotFound());
 });
 
+// catch all for react app
 router.get('*', async ctx => {
-  if (isProduction) {
-    ctx.body = await readFile(path.join(__dirname, '../dist/index.html'));
-  } else {
-    ctx.body = await readFile(path.join(__dirname, './static/dev.html'));
-  }
+  await renderapp(ctx);
   if (!ctx.status) ctx.throw(httpErrors.NotFound());
 });
 
+// middleware
 koa.use(subdomainRedirect());
 koa.use(router.routes());
-
-// 404 handler
 koa.use(async () => {
   throw httpErrors.NotFound();
 });
diff --git a/server/static/home.html b/server/static/home.html
deleted file mode 100644
index 35a36c02e..000000000
--- a/server/static/home.html
+++ /dev/null
@@ -1,64 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <title>Atlas</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" href="https://unpkg.com/tachyons@4.8.1/css/tachyons.min.css">
-  </head>
-  </head>
-  <body class="sans-serif dark-gray">
-    <section class="fl w-100 pa6 tc">
-      <h1 class="f2">Your team’s knowledge base</h1>
-      <p class="f4 mid-gray">Documentation, meeting notes, playbooks, onboarding, work logs, brainstorming, decisions, &amp; more…</p>
-      <a href="" class="bg-dark-gray br2 pa2 white no-underline">Sign In</a>
-    </section>
-
-    <section class="fl w-100">
-      <div class="fl w-50-l pa6">
-      </div>
-      <div class="fl w-50-l pa6 bg-light-gray">
-        <h2 class="f3">Blazing Fast</h2>
-        <p>Atlas is fast, really fast. We’ve trimmed 100ms and 50ms there to make sure that documents load instantly, search is speedy and there are keyboard shortcuts for everything.</p>
-      </div>
-    </section>
-
-    <section class="fl w-100">
-      <div class="fl w-50-l pa6 bg-light-gray">
-        <h2 class="f3">Markdown Support</h2>
-        <p>Documents are stored in Markdown and you can export them at any time. Markdown shortcuts are also built right into the editor so you can easily format using markdown syntax or our GUI.</p>
-      </div>
-      <div class="fl w-50-l pa6">
-      </div>
-    </section>
-
-    <section class="fl w-100">
-      <div class="fl w-50-l pa6">
-      </div>
-      <div class="fl w-50-l pa6 bg-light-gray">
-        <h2 class="f3">Beautiful Editor</h2>
-        <p>We built a custom editor from the ground up to be great looking, extensible, and a pleasure to use whether you're typing up quick notes or pages of documentation.</p>
-      </div>
-    </section>
-
-    <div class="fl w-33-l pa5">
-      <h2 class="f4">Powerful Search</h2>
-      <p>Built-in search makes that one document easy to find in a large knowledgebase.</p>
-    </div>
-    <div class="fl w-33-l pa5">
-      <h2 class="f4">API &amp; Integrations</h2>
-      <p>Atlas is built on it's own API, treat Atlas as a CMS or automatically great documents from outside events.</p>
-    </div>
-    <div class="fl w-33-l pa5">
-      <h2 class="f4">Open Source</h2>
-      <p>Want to contribute or host Atlas yourself? All of the code is on GitHub.</p>
-    </div>
-
-    <footer class="fl w-100">
-      <ul>
-        <li>About Us</li>
-        <li>Pricing</li>
-        <li>Contact</li>
-      </ul>
-    </footer>
-  </body>
-</html>
diff --git a/server/utils/renderpage.js b/server/utils/renderpage.js
new file mode 100644
index 000000000..7a8c73998
--- /dev/null
+++ b/server/utils/renderpage.js
@@ -0,0 +1,27 @@
+// @flow
+import React from 'react';
+import ReactDOMServer from 'react-dom/server';
+import { Helmet } from 'react-helmet';
+import { ServerStyleSheet, StyleSheetManager } from 'styled-components';
+import Layout from '../pages/components/Layout';
+
+const sheet = new ServerStyleSheet();
+
+export default function renderpage(ctx: Object, children: React$Element<*>) {
+  const html = ReactDOMServer.renderToString(
+    <StyleSheetManager sheet={sheet.instance}>
+      <Layout>
+        {children}
+      </Layout>
+    </StyleSheetManager>
+  );
+
+  // helmet returns an object of meta tags with toString methods, urgh.
+  const helmet = Helmet.renderStatic();
+  let head = '';
+  Object.keys(helmet).forEach(key => (head += helmet[key].toString()));
+
+  ctx.body = html
+    .replace('{{CSS}}', sheet.getStyleTags())
+    .replace('{{HEAD}}', head);
+}

From 524afd8b44635329252bd3684a2d639d3cfdccdf Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Sun, 22 Oct 2017 20:29:27 -0700
Subject: [PATCH 04/10] SignIn / SignOut working

---
 frontend/menus/AccountMenu.js          |  2 +-
 frontend/scenes/SlackAuth/SlackAuth.js |  8 +++++--
 frontend/stores/AuthStore.js           |  2 +-
 frontend/utils/routeHelpers.js         | 25 ++++++++++++++++++++++
 server/pages/About.js                  | 12 +++--------
 server/pages/Home.js                   | 29 +++++++++++++-------------
 server/pages/Pricing.js                | 14 ++++---------
 server/pages/components/Hero.js        | 10 +++++++++
 server/static/index.html               |  4 ++--
 9 files changed, 66 insertions(+), 40 deletions(-)
 create mode 100644 server/pages/components/Hero.js

diff --git a/frontend/menus/AccountMenu.js b/frontend/menus/AccountMenu.js
index 77ca6cb2d..4a701da9b 100644
--- a/frontend/menus/AccountMenu.js
+++ b/frontend/menus/AccountMenu.js
@@ -24,7 +24,7 @@ import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
 
   handleLogout = () => {
     this.props.auth.logout();
-    this.props.history.push('/');
+    window.location.href = BASE_URL;
   };
 
   render() {
diff --git a/frontend/scenes/SlackAuth/SlackAuth.js b/frontend/scenes/SlackAuth/SlackAuth.js
index 2846b75ad..87a0ff7f1 100644
--- a/frontend/scenes/SlackAuth/SlackAuth.js
+++ b/frontend/scenes/SlackAuth/SlackAuth.js
@@ -5,6 +5,7 @@ import queryString from 'query-string';
 import { observable } from 'mobx';
 import { observer, inject } from 'mobx-react';
 import { client } from 'utils/ApiClient';
+import { slackAuth } from 'utils/routeHelpers';
 
 import AuthStore from 'stores/AuthStore';
 
@@ -33,7 +34,7 @@ type Props = {
       } else {
         this.redirectTo = '/auth/error';
       }
-    } else {
+    } else if (code) {
       if (this.props.location.pathname === '/auth/slack/commands') {
         // User adding webhook integrations
         try {
@@ -43,7 +44,7 @@ type Props = {
           this.redirectTo = '/auth/error';
         }
       } else {
-        // Regular Slack authentication
+        // Slack authentication
         const redirectTo = sessionStorage.getItem('redirectTo');
         sessionStorage.removeItem('redirectTo');
 
@@ -52,6 +53,9 @@ type Props = {
           ? (this.redirectTo = redirectTo || '/dashboard')
           : (this.redirectTo = '/auth/error');
       }
+    } else {
+      // Sign In
+      window.location.href = slackAuth(this.props.auth.getOauthState());
     }
   }
 
diff --git a/frontend/stores/AuthStore.js b/frontend/stores/AuthStore.js
index 99c8305bd..d165de33c 100644
--- a/frontend/stores/AuthStore.js
+++ b/frontend/stores/AuthStore.js
@@ -34,7 +34,7 @@ class AuthStore {
   @action logout = () => {
     this.user = null;
     this.token = null;
-    Cookie.remove('loggedId', { path: '/' });
+    Cookie.remove('loggedIn', { path: '/' });
   };
 
   @action getOauthState = () => {
diff --git a/frontend/utils/routeHelpers.js b/frontend/utils/routeHelpers.js
index 4db4200f7..b1e5f16ab 100644
--- a/frontend/utils/routeHelpers.js
+++ b/frontend/utils/routeHelpers.js
@@ -22,6 +22,31 @@ export function documentUrl(doc: Document): string {
   return doc.url;
 }
 
+export function slackAuth(
+  state: string,
+  scopes: string[] = [
+    'identity.email',
+    'identity.basic',
+    'identity.avatar',
+    'identity.team',
+  ],
+  redirectUri: string = `${BASE_URL}/auth/slack`
+): string {
+  const baseUrl = 'https://slack.com/oauth/authorize';
+  const params = {
+    client_id: SLACK_KEY,
+    scope: scopes ? scopes.join(' ') : '',
+    redirect_uri: redirectUri,
+    state,
+  };
+
+  const urlParams = Object.keys(params)
+    .map(key => `${key}=${encodeURIComponent(params[key])}`)
+    .join('&');
+
+  return `${baseUrl}?${urlParams}`;
+}
+
 export function documentNewUrl(doc: Document): string {
   const newUrl = `${doc.collection.url}/new`;
   if (doc.parentDocumentId) {
diff --git a/server/pages/About.js b/server/pages/About.js
index 5d7c43d24..281ff9197 100644
--- a/server/pages/About.js
+++ b/server/pages/About.js
@@ -1,14 +1,8 @@
 // @flow
 import React from 'react';
-import styled from 'styled-components';
 import Grid from 'styled-components-grid';
 import { Helmet } from 'react-helmet';
-
-const Header = styled.div`
-  width: 100%;
-  padding: 3em;
-  text-align: center;
-`;
+import Hero from './components/Hero';
 
 export default function About() {
   return (
@@ -16,12 +10,12 @@ export default function About() {
       <Helmet>
         <title>About</title>
       </Helmet>
-      <Header>
+      <Hero>
         <h1>About Atlas</h1>
         <p>
           Just a proof of concept for multiple pages.
         </p>
-      </Header>
+      </Hero>
     </Grid>
   );
 }
diff --git a/server/pages/Home.js b/server/pages/Home.js
index 4eb54c01c..149e4139e 100644
--- a/server/pages/Home.js
+++ b/server/pages/Home.js
@@ -2,25 +2,24 @@
 import React from 'react';
 import styled from 'styled-components';
 import Grid from 'styled-components-grid';
+import Hero from './components/Hero';
 
 const Unit = Grid.Unit;
 
-const Header = styled.div`
-  width: 100%;
+const Feature = styled(Unit)`
   padding: 3em;
-  text-align: center;
 `;
 
 export default function Home() {
   return (
     <Grid>
-      <Header>
+      <Hero>
         <h1>Your team’s knowledge base</h1>
         <p>
           Documentation, meeting notes, playbooks, onboarding, work logs, brainstorming, decisions, & more…
         </p>
-        <a href="">Sign In</a>
-      </Header>
+        <a href="/auth/slack">Sign In</a>
+      </Hero>
       <Unit size={{ desktop: 1 / 2 }} />
       <Unit size={{ desktop: 1 / 2 }}>
         <h2>Blazing Fast</h2>
@@ -39,30 +38,30 @@ export default function Home() {
 
       <Unit size={{ desktop: 1 / 2 }} />
       <Unit size={{ desktop: 1 / 2 }}>
-        <h2>Markdown Support</h2>
+        <h2>Beautiful Editor</h2>
         <p>
           Documents are stored in Markdown and you can export them at any time. Markdown shortcuts are also built right into the editor so you can easily format using markdown syntax or our GUI.
         </p>
       </Unit>
 
-      <Unit size={{ desktop: 1 / 3 }}>
+      <Feature size={{ desktop: 1 / 3 }}>
         <h2>Powerful Search</h2>
         <p>
           Built-in search makes that one document easy to find in a large knowledgebase.
         </p>
-      </Unit>
-      <Unit size={{ desktop: 1 / 3 }}>
+      </Feature>
+      <Feature size={{ desktop: 1 / 3 }}>
         <h2>API & Integrations</h2>
         <p>
-          Atlas is built on it’s own API, treat Atlas as a CMS or automatically great documents from outside events.
+          Atlas is built on it’s own API, treat Atlas as a CMS or automatically create documents from outside events.
         </p>
-      </Unit>
-      <Unit size={{ desktop: 1 / 3 }}>
+      </Feature>
+      <Feature size={{ desktop: 1 / 3 }}>
         <h2>Open Source</h2>
         <p>
-          Want to contribute or host Atlas yourself? All of the code is on GitHub.
+          Want to contribute or host Atlas yourself? All of the code is available on GitHub.
         </p>
-      </Unit>
+      </Feature>
     </Grid>
   );
 }
diff --git a/server/pages/Pricing.js b/server/pages/Pricing.js
index 15e861c00..d8d76ec66 100644
--- a/server/pages/Pricing.js
+++ b/server/pages/Pricing.js
@@ -1,14 +1,8 @@
 // @flow
 import React from 'react';
-import styled from 'styled-components';
 import Grid from 'styled-components-grid';
 import { Helmet } from 'react-helmet';
-
-const Header = styled.div`
-  width: 100%;
-  padding: 3em;
-  text-align: center;
-`;
+import Hero from './components/Hero';
 
 export default function Pricing() {
   return (
@@ -16,12 +10,12 @@ export default function Pricing() {
       <Helmet>
         <title>Pricing</title>
       </Helmet>
-      <Header>
+      <Hero>
         <h1>Pricing</h1>
         <p>
-          Just a proof of concept for multiple pages.
+          Explore Atlas with a 14 day trial, free forever for teams smaller than 5.
         </p>
-      </Header>
+      </Hero>
     </Grid>
   );
 }
diff --git a/server/pages/components/Hero.js b/server/pages/components/Hero.js
new file mode 100644
index 000000000..2da5efdbf
--- /dev/null
+++ b/server/pages/components/Hero.js
@@ -0,0 +1,10 @@
+// @flow
+import styled from 'styled-components';
+
+const Hero = styled.div`
+  width: 100%;
+  padding: 4em 3em;
+  text-align: center;
+`;
+
+export default Hero;
diff --git a/server/static/index.html b/server/static/index.html
index 3613c5c07..612e83c83 100644
--- a/server/static/index.html
+++ b/server/static/index.html
@@ -25,7 +25,7 @@
 
 <body>
   <div id="root"></div>
+  <script src="//d2wy8f7a9ursnm.cloudfront.net/bugsnag-3.min.js" data-apikey="<%= BUGSNAG_KEY %>"></script>
 </body>
-<script src="//d2wy8f7a9ursnm.cloudfront.net/bugsnag-3.min.js" data-apikey="<%= BUGSNAG_KEY %>"></script>
 
-</html>
\ No newline at end of file
+</html>

From 1956cd0739e3ff9dfb8d3e6e1735768e390f8272 Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Sun, 22 Oct 2017 20:43:02 -0700
Subject: [PATCH 05/10] Remove old homepage

---
 frontend/scenes/Home/Home.js | 70 +++---------------------------------
 1 file changed, 5 insertions(+), 65 deletions(-)

diff --git a/frontend/scenes/Home/Home.js b/frontend/scenes/Home/Home.js
index a65b665d0..37ef49dc0 100644
--- a/frontend/scenes/Home/Home.js
+++ b/frontend/scenes/Home/Home.js
@@ -2,76 +2,16 @@
 import React from 'react';
 import { observer, inject } from 'mobx-react';
 import { Redirect } from 'react-router';
-import Flex from 'components/Flex';
-import styled from 'styled-components';
-
 import AuthStore from 'stores/AuthStore';
 
-import CenteredContent from 'components/CenteredContent';
-import SlackAuthLink from 'components/SlackAuthLink';
-import Alert from 'components/Alert';
-
 type Props = {
   auth: AuthStore,
-  location: Object,
 };
 
-@observer class Home extends React.Component {
-  props: Props;
-
-  get notifications(): React.Element<any>[] {
-    const notifications = [];
-    const { state } = this.props.location;
-
-    if (state && state.nextPathname) {
-      sessionStorage.removeItem('redirectTo');
-      sessionStorage.setItem('redirectTo', state.nextPathname);
-      notifications.push(<Alert key="login">Please login to continue</Alert>);
-    }
-
-    return notifications;
-  }
-
-  render() {
-    const showLandingPageCopy = DEPLOYMENT === 'hosted';
-
-    return (
-      <Flex auto>
-        {this.props.auth.authenticated && <Redirect to="/dashboard" />}
-
-        <CenteredContent>
-          {showLandingPageCopy &&
-            <div>
-              <Title>Simple, fast, markdown.</Title>
-              <Copy>
-                We're building a modern wiki for engineering teams.
-              </Copy>
-            </div>}
-          <div>
-            <SlackAuthLink redirectUri={`${BASE_URL}/auth/slack`}>
-              <img
-                alt="Sign in with Slack"
-                height="40"
-                width="172"
-                src="https://platform.slack-edge.com/img/sign_in_with_slack.png"
-                srcSet="https://platform.slack-edge.com/img/sign_in_with_slack.png 1x, https://platform.slack-edge.com/img/sign_in_with_slack@2x.png 2x"
-              />
-            </SlackAuthLink>
-          </div>
-        </CenteredContent>
-      </Flex>
-    );
-  }
-}
-
-const Title = styled.h1`
-  font-size: 36px;
-  margin-bottom: 24px;
-}`;
-
-const Copy = styled.p`
-  font-size: 20px;
-  margin-bottom: 36px;
-}`;
+const Home = observer((props: Props) => {
+  if (props.auth.authenticated) return <Redirect to="/dashboard" />;
+  window.location.href = BASE_URL;
+  return null;
+});
 
 export default inject('auth')(Home);

From 4863680d8617dcc423d34e1d2903954ee67806a2 Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Wed, 25 Oct 2017 22:49:04 -0700
Subject: [PATCH 06/10] frontend > app

---
 .flowconfig                                         |   4 ++--
 {frontend => app}/components/Alert/Alert.js         |   0
 {frontend => app}/components/Alert/index.js         |   0
 {frontend => app}/components/Avatar/Avatar.js       |   0
 {frontend => app}/components/Avatar/index.js        |   0
 {frontend => app}/components/Button/Button.js       |   0
 {frontend => app}/components/Button/index.js        |   0
 .../components/CenteredContent/CenteredContent.js   |   0
 .../components/CenteredContent/index.js             |   0
 .../components/Collaborators/Collaborators.js       |   0
 {frontend => app}/components/Collaborators/index.js |   0
 .../components/CopyToClipboard/CopyToClipboard.js   |   0
 .../components/CopyToClipboard/index.js             |   0
 {frontend => app}/components/Divider/Divider.js     |   0
 {frontend => app}/components/Divider/index.js       |   0
 .../components/DocumentList/DocumentList.js         |   0
 {frontend => app}/components/DocumentList/index.js  |   0
 .../components/DocumentPreview/DocumentPreview.js   |   0
 .../DocumentPreview/components/PublishingInfo.js    |   0
 .../components/DocumentPreview/index.js             |   0
 .../DocumentViews/DocumentViewersStore.js           |   0
 .../components/DocumentViews/DocumentViews.js       |   0
 .../components/DocumentViewers/DocumentViewers.js   |   0
 .../components/DocumentViewers/index.js             |   0
 {frontend => app}/components/DocumentViews/index.js |   0
 .../components/DropToImport/DropToImport.js         |   0
 {frontend => app}/components/DropToImport/index.js  |   0
 .../components/DropdownMenu/DropdownMenu.js         |   0
 .../components/DropdownMenu/DropdownMenuItem.js     |   0
 {frontend => app}/components/DropdownMenu/index.js  |   0
 {frontend => app}/components/Editor/Editor.js       |   0
 .../components/Editor/components/BlockInsert.js     |   0
 .../components/ClickablePadding/ClickablePadding.js |   0
 .../Editor/components/ClickablePadding/index.js     |   0
 .../components/Editor/components/Code.js            |   0
 .../components/Editor/components/Contents.js        |   0
 .../components/Editor/components/CopyButton.js      |   0
 .../components/Editor/components/Heading.js         |   0
 .../components/Editor/components/HorizontalRule.js  |   0
 .../components/Editor/components/Image.js           |   0
 .../components/Editor/components/InlineCode.js      |   0
 .../components/Editor/components/Link.js            |   0
 .../components/Editor/components/ListItem.js        |   0
 .../components/Editor/components/Paragraph.js       |   0
 .../components/Editor/components/Placeholder.js     |   0
 .../components/Editor/components/TodoItem.js        |   0
 .../components/Editor/components/TodoList.js        |   0
 .../components/Editor/components/Toolbar/Toolbar.js |   0
 .../components/Toolbar/components/DocumentResult.js |   0
 .../Toolbar/components/FormattingToolbar.js         |   0
 .../components/Toolbar/components/LinkToolbar.js    |   0
 .../components/Toolbar/components/ToolbarButton.js  |   0
 .../components/Editor/components/Toolbar/index.js   |   0
 .../components/Editor/headingToSlug.js              |   0
 {frontend => app}/components/Editor/index.js        |   0
 {frontend => app}/components/Editor/insertImage.js  |   0
 {frontend => app}/components/Editor/plugins.js      |   0
 .../components/Editor/plugins/EditList.js           |   0
 .../components/Editor/plugins/KeyboardShortcuts.js  |   0
 .../components/Editor/plugins/MarkdownShortcuts.js  |   0
 {frontend => app}/components/Editor/schema.js       |   0
 {frontend => app}/components/Editor/serializer.js   |   0
 {frontend => app}/components/Editor/types.js        |   0
 {frontend => app}/components/Empty/Empty.js         |   0
 {frontend => app}/components/Empty/index.js         |   0
 {frontend => app}/components/Flex/Flex.js           |   0
 {frontend => app}/components/Flex/index.js          |   0
 {frontend => app}/components/HelpText/HelpText.js   |   0
 {frontend => app}/components/HelpText/index.js      |   0
 {frontend => app}/components/Icon/BackIcon.js       |   0
 {frontend => app}/components/Icon/BoldIcon.js       |   0
 .../components/Icon/BulletedListIcon.js             |   0
 {frontend => app}/components/Icon/CheckboxIcon.js   |   0
 {frontend => app}/components/Icon/CloseIcon.js      |   0
 {frontend => app}/components/Icon/CodeIcon.js       |   0
 {frontend => app}/components/Icon/CollapsedIcon.js  |   0
 {frontend => app}/components/Icon/CollectionIcon.js |   0
 {frontend => app}/components/Icon/DocumentIcon.js   |   0
 {frontend => app}/components/Icon/EditIcon.js       |   0
 {frontend => app}/components/Icon/GoToIcon.js       |   0
 {frontend => app}/components/Icon/Heading1Icon.js   |   0
 {frontend => app}/components/Icon/Heading2Icon.js   |   0
 {frontend => app}/components/Icon/HomeIcon.js       |   0
 .../components/Icon/HorizontalRuleIcon.js           |   0
 {frontend => app}/components/Icon/Icon.js           |   0
 {frontend => app}/components/Icon/ImageIcon.js      |   0
 {frontend => app}/components/Icon/ItalicIcon.js     |   0
 {frontend => app}/components/Icon/LinkIcon.js       |   0
 {frontend => app}/components/Icon/MoreIcon.js       |   0
 .../components/Icon/NewDocumentIcon.js              |   0
 {frontend => app}/components/Icon/NextIcon.js       |   0
 {frontend => app}/components/Icon/OpenIcon.js       |   0
 .../components/Icon/OrderedListIcon.js              |   0
 {frontend => app}/components/Icon/PlusIcon.js       |   0
 {frontend => app}/components/Icon/SearchIcon.js     |   0
 {frontend => app}/components/Icon/StarredIcon.js    |   0
 .../components/Icon/StrikethroughIcon.js            |   0
 {frontend => app}/components/Icon/TableIcon.js      |   0
 {frontend => app}/components/Icon/TodoListIcon.js   |   0
 {frontend => app}/components/Icon/TrashIcon.js      |   0
 {frontend => app}/components/Icon/index.js          |   0
 {frontend => app}/components/Input/Input.js         |   0
 {frontend => app}/components/Input/index.js         |   0
 {frontend => app}/components/Key/index.js           |   0
 {frontend => app}/components/Key/key.js             |   0
 {frontend => app}/components/Labeled/Labeled.js     |   0
 {frontend => app}/components/Labeled/index.js       |   0
 {frontend => app}/components/Layout/Layout.js       |   0
 .../components/Layout/components/HeaderBlock.js     |   0
 .../components/Layout/components/Modals.js          |   0
 .../Layout/components/SidebarCollections.js         |   0
 .../components/Layout/components/SidebarLink.js     |   0
 .../components/Layout/components/Title.js           |   0
 {frontend => app}/components/Layout/index.js        |   0
 .../components/LoadingIndicator/LoadingIndicator.js |   0
 .../LoadingIndicator/LoadingIndicatorBar.js         |   0
 .../components/LoadingIndicator/index.js            |   0
 .../LoadingListPlaceholder.js                       |   0
 .../components/LoadingListPlaceholder/index.js      |   0
 .../LoadingPlaceholder/ListPlaceholder.js           |   0
 .../LoadingPlaceholder/LoadingPlaceholder.js        |   0
 .../LoadingPlaceholder/components/Mask.js           |   0
 .../components/LoadingPlaceholder/index.js          |   0
 {frontend => app}/components/Modal/Modal.js         |   0
 {frontend => app}/components/Modal/index.js         |   0
 {frontend => app}/components/PageTitle/PageTitle.js |   0
 {frontend => app}/components/PageTitle/index.js     |   0
 {frontend => app}/components/Popover/Popover.js     |   0
 {frontend => app}/components/Popover/index.js       |   0
 .../RouteSidebarHidden/RouteSidebarHidden.js        |   0
 .../components/RouteSidebarHidden/index.js          |   0
 .../components/ScrollToTop/ScrollToTop.js           |   0
 {frontend => app}/components/ScrollToTop/index.js   |   0
 .../components/Scrollable/Scrollable.js             |   0
 {frontend => app}/components/Scrollable/index.js    |   0
 .../components/SlackAuthLink/SlackAuthLink.js       |   0
 .../components/SlackAuthLink/assets/slack_icon.svg  |   0
 {frontend => app}/components/SlackAuthLink/index.js |   0
 {frontend => app}/components/Toasts/Toasts.js       |   0
 .../components/Toasts/components/Toast.js           |   0
 {frontend => app}/components/Toasts/index.js        |   0
 {frontend => app}/components/Tooltip/index.js       |   0
 .../fonts/atlas/AtlasGrotesk-Black-Web.woff         | Bin
 .../fonts/atlas/AtlasGrotesk-BlackItalic-Web.woff   | Bin
 .../fonts/atlas/AtlasGrotesk-Bold-Web.woff          | Bin
 .../fonts/atlas/AtlasGrotesk-BoldItalic-Web.woff    | Bin
 .../fonts/atlas/AtlasGrotesk-Light-Web.woff         | Bin
 .../fonts/atlas/AtlasGrotesk-LightItalic-Web.woff   | Bin
 .../fonts/atlas/AtlasGrotesk-Medium-Web.woff        | Bin
 .../fonts/atlas/AtlasGrotesk-MediumItalic-Web.woff  | Bin
 .../fonts/atlas/AtlasGrotesk-Regular-Web.woff       | Bin
 .../fonts/atlas/AtlasGrotesk-RegularItalic-Web.woff | Bin
 .../fonts/atlas/AtlasGrotesk-Thin-Web.woff          | Bin
 .../fonts/atlas/AtlasGrotesk-ThinItalic-Web.woff    | Bin
 .../fonts/atlas/AtlasTypewriterMedium.woff          | Bin
 .../fonts/atlas/AtlasTypewriterRegular.woff         | Bin
 {frontend => app}/index.js                          |   0
 {frontend => app}/menus/AccountMenu.js              |   0
 {frontend => app}/menus/BlockMenu.js                |   0
 {frontend => app}/menus/CollectionMenu.js           |   0
 {frontend => app}/menus/DocumentMenu.js             |   0
 {frontend => app}/models/BaseModel.js               |   0
 {frontend => app}/models/Collection.js              |   0
 {frontend => app}/models/Collection.test.js         |   0
 {frontend => app}/models/Document.js                |   0
 {frontend => app}/models/Document.test.js           |   0
 {frontend => app}/scenes/Collection/Collection.js   |   0
 {frontend => app}/scenes/Collection/index.js        |   0
 .../scenes/CollectionDelete/CollectionDelete.js     |   0
 {frontend => app}/scenes/CollectionDelete/index.js  |   0
 .../scenes/CollectionEdit/CollectionEdit.js         |   0
 {frontend => app}/scenes/CollectionEdit/index.js    |   0
 .../scenes/CollectionNew/CollectionNew.js           |   0
 {frontend => app}/scenes/CollectionNew/index.js     |   0
 {frontend => app}/scenes/Dashboard/Dashboard.js     |   0
 {frontend => app}/scenes/Dashboard/index.js         |   0
 {frontend => app}/scenes/Document/Document.js       |   0
 .../components/DocumentMove/DocumentMove.js         |   0
 .../DocumentMove/components/PathToDocument.js       |   0
 .../Document/components/DocumentMove/index.js       |   0
 .../LoadingPlaceholder/LoadingPlaceholder.js        |   0
 .../Document/components/LoadingPlaceholder/index.js |   0
 .../Document/components/SaveAction/SaveAction.js    |   0
 .../scenes/Document/components/SaveAction/index.js  |   0
 {frontend => app}/scenes/Document/index.js          |   0
 .../scenes/DocumentDelete/DocumentDelete.js         |   0
 {frontend => app}/scenes/DocumentDelete/index.js    |   0
 {frontend => app}/scenes/Error404/Error404.js       |   0
 {frontend => app}/scenes/Error404/index.js          |   0
 {frontend => app}/scenes/ErrorAuth/ErrorAuth.js     |   0
 {frontend => app}/scenes/ErrorAuth/index.js         |   0
 {frontend => app}/scenes/Flatpage/Flatpage.js       |   0
 {frontend => app}/scenes/Flatpage/index.js          |   0
 {frontend => app}/scenes/Home/Home.js               |   0
 {frontend => app}/scenes/Home/index.js              |   0
 .../scenes/KeyboardShortcuts/KeyboardShortcuts.js   |   0
 {frontend => app}/scenes/KeyboardShortcuts/index.js |   0
 {frontend => app}/scenes/Search/Search.js           |   0
 .../Search/components/SearchField/SearchField.js    |   0
 .../scenes/Search/components/SearchField/index.js   |   0
 {frontend => app}/scenes/Search/index.js            |   0
 {frontend => app}/scenes/Settings/Settings.js       |   0
 {frontend => app}/scenes/Settings/SettingsStore.js  |   0
 .../Settings/components/ApiKeyRow/ApiKeyRow.js      |   0
 .../scenes/Settings/components/ApiKeyRow/index.js   |   0
 {frontend => app}/scenes/Settings/index.js          |   0
 {frontend => app}/scenes/SlackAuth/SlackAuth.js     |   0
 {frontend => app}/scenes/SlackAuth/index.js         |   0
 {frontend => app}/scenes/Starred/Starred.js         |   0
 {frontend => app}/scenes/Starred/index.js           |   0
 {frontend => app}/static/flatpages/api.md           |   0
 {frontend => app}/static/flatpages/index.js         |   0
 {frontend => app}/stores/AuthStore.js               |   0
 {frontend => app}/stores/BaseStore.js               |   0
 {frontend => app}/stores/CacheStore.js              |   0
 {frontend => app}/stores/CollectionsStore.js        |   0
 {frontend => app}/stores/CollectionsStore.test.js   |   0
 {frontend => app}/stores/DocumentsStore.js          |   0
 {frontend => app}/stores/ErrorsStore.js             |   0
 {frontend => app}/stores/ErrorsStore.test.js        |   0
 {frontend => app}/stores/UiStore.js                 |   0
 {frontend => app}/stores/index.js                   |   0
 {frontend => app}/styles/animations.js              |   0
 {frontend => app}/styles/base.css                   |   0
 {frontend => app}/styles/constants.js               |   0
 {frontend => app}/styles/fonts.css                  |   0
 {frontend => app}/styles/prism.css                  |   0
 {frontend => app}/styles/transitions.css            |   0
 {frontend => app}/types/index.js                    |   0
 {frontend => app}/utils/ApiClient.js                |   0
 {frontend => app}/utils/__mocks__/ApiClient.js      |   0
 {frontend => app}/utils/getDataTransferFiles.js     |   0
 {frontend => app}/utils/random.js                   |   0
 {frontend => app}/utils/routeHelpers.js             |   0
 {frontend => app}/utils/uploadFile.js               |   0
 package.json                                        |  10 +++++-----
 webpack.config.dev.js                               |   2 +-
 webpack.config.js                                   |   4 ++--
 webpack.config.prod.js                              |   2 +-
 239 files changed, 11 insertions(+), 11 deletions(-)
 rename {frontend => app}/components/Alert/Alert.js (100%)
 rename {frontend => app}/components/Alert/index.js (100%)
 rename {frontend => app}/components/Avatar/Avatar.js (100%)
 rename {frontend => app}/components/Avatar/index.js (100%)
 rename {frontend => app}/components/Button/Button.js (100%)
 rename {frontend => app}/components/Button/index.js (100%)
 rename {frontend => app}/components/CenteredContent/CenteredContent.js (100%)
 rename {frontend => app}/components/CenteredContent/index.js (100%)
 rename {frontend => app}/components/Collaborators/Collaborators.js (100%)
 rename {frontend => app}/components/Collaborators/index.js (100%)
 rename {frontend => app}/components/CopyToClipboard/CopyToClipboard.js (100%)
 rename {frontend => app}/components/CopyToClipboard/index.js (100%)
 rename {frontend => app}/components/Divider/Divider.js (100%)
 rename {frontend => app}/components/Divider/index.js (100%)
 rename {frontend => app}/components/DocumentList/DocumentList.js (100%)
 rename {frontend => app}/components/DocumentList/index.js (100%)
 rename {frontend => app}/components/DocumentPreview/DocumentPreview.js (100%)
 rename {frontend => app}/components/DocumentPreview/components/PublishingInfo.js (100%)
 rename {frontend => app}/components/DocumentPreview/index.js (100%)
 rename {frontend => app}/components/DocumentViews/DocumentViewersStore.js (100%)
 rename {frontend => app}/components/DocumentViews/DocumentViews.js (100%)
 rename {frontend => app}/components/DocumentViews/components/DocumentViewers/DocumentViewers.js (100%)
 rename {frontend => app}/components/DocumentViews/components/DocumentViewers/index.js (100%)
 rename {frontend => app}/components/DocumentViews/index.js (100%)
 rename {frontend => app}/components/DropToImport/DropToImport.js (100%)
 rename {frontend => app}/components/DropToImport/index.js (100%)
 rename {frontend => app}/components/DropdownMenu/DropdownMenu.js (100%)
 rename {frontend => app}/components/DropdownMenu/DropdownMenuItem.js (100%)
 rename {frontend => app}/components/DropdownMenu/index.js (100%)
 rename {frontend => app}/components/Editor/Editor.js (100%)
 rename {frontend => app}/components/Editor/components/BlockInsert.js (100%)
 rename {frontend => app}/components/Editor/components/ClickablePadding/ClickablePadding.js (100%)
 rename {frontend => app}/components/Editor/components/ClickablePadding/index.js (100%)
 rename {frontend => app}/components/Editor/components/Code.js (100%)
 rename {frontend => app}/components/Editor/components/Contents.js (100%)
 rename {frontend => app}/components/Editor/components/CopyButton.js (100%)
 rename {frontend => app}/components/Editor/components/Heading.js (100%)
 rename {frontend => app}/components/Editor/components/HorizontalRule.js (100%)
 rename {frontend => app}/components/Editor/components/Image.js (100%)
 rename {frontend => app}/components/Editor/components/InlineCode.js (100%)
 rename {frontend => app}/components/Editor/components/Link.js (100%)
 rename {frontend => app}/components/Editor/components/ListItem.js (100%)
 rename {frontend => app}/components/Editor/components/Paragraph.js (100%)
 rename {frontend => app}/components/Editor/components/Placeholder.js (100%)
 rename {frontend => app}/components/Editor/components/TodoItem.js (100%)
 rename {frontend => app}/components/Editor/components/TodoList.js (100%)
 rename {frontend => app}/components/Editor/components/Toolbar/Toolbar.js (100%)
 rename {frontend => app}/components/Editor/components/Toolbar/components/DocumentResult.js (100%)
 rename {frontend => app}/components/Editor/components/Toolbar/components/FormattingToolbar.js (100%)
 rename {frontend => app}/components/Editor/components/Toolbar/components/LinkToolbar.js (100%)
 rename {frontend => app}/components/Editor/components/Toolbar/components/ToolbarButton.js (100%)
 rename {frontend => app}/components/Editor/components/Toolbar/index.js (100%)
 rename {frontend => app}/components/Editor/headingToSlug.js (100%)
 rename {frontend => app}/components/Editor/index.js (100%)
 rename {frontend => app}/components/Editor/insertImage.js (100%)
 rename {frontend => app}/components/Editor/plugins.js (100%)
 rename {frontend => app}/components/Editor/plugins/EditList.js (100%)
 rename {frontend => app}/components/Editor/plugins/KeyboardShortcuts.js (100%)
 rename {frontend => app}/components/Editor/plugins/MarkdownShortcuts.js (100%)
 rename {frontend => app}/components/Editor/schema.js (100%)
 rename {frontend => app}/components/Editor/serializer.js (100%)
 rename {frontend => app}/components/Editor/types.js (100%)
 rename {frontend => app}/components/Empty/Empty.js (100%)
 rename {frontend => app}/components/Empty/index.js (100%)
 rename {frontend => app}/components/Flex/Flex.js (100%)
 rename {frontend => app}/components/Flex/index.js (100%)
 rename {frontend => app}/components/HelpText/HelpText.js (100%)
 rename {frontend => app}/components/HelpText/index.js (100%)
 rename {frontend => app}/components/Icon/BackIcon.js (100%)
 rename {frontend => app}/components/Icon/BoldIcon.js (100%)
 rename {frontend => app}/components/Icon/BulletedListIcon.js (100%)
 rename {frontend => app}/components/Icon/CheckboxIcon.js (100%)
 rename {frontend => app}/components/Icon/CloseIcon.js (100%)
 rename {frontend => app}/components/Icon/CodeIcon.js (100%)
 rename {frontend => app}/components/Icon/CollapsedIcon.js (100%)
 rename {frontend => app}/components/Icon/CollectionIcon.js (100%)
 rename {frontend => app}/components/Icon/DocumentIcon.js (100%)
 rename {frontend => app}/components/Icon/EditIcon.js (100%)
 rename {frontend => app}/components/Icon/GoToIcon.js (100%)
 rename {frontend => app}/components/Icon/Heading1Icon.js (100%)
 rename {frontend => app}/components/Icon/Heading2Icon.js (100%)
 rename {frontend => app}/components/Icon/HomeIcon.js (100%)
 rename {frontend => app}/components/Icon/HorizontalRuleIcon.js (100%)
 rename {frontend => app}/components/Icon/Icon.js (100%)
 rename {frontend => app}/components/Icon/ImageIcon.js (100%)
 rename {frontend => app}/components/Icon/ItalicIcon.js (100%)
 rename {frontend => app}/components/Icon/LinkIcon.js (100%)
 rename {frontend => app}/components/Icon/MoreIcon.js (100%)
 rename {frontend => app}/components/Icon/NewDocumentIcon.js (100%)
 rename {frontend => app}/components/Icon/NextIcon.js (100%)
 rename {frontend => app}/components/Icon/OpenIcon.js (100%)
 rename {frontend => app}/components/Icon/OrderedListIcon.js (100%)
 rename {frontend => app}/components/Icon/PlusIcon.js (100%)
 rename {frontend => app}/components/Icon/SearchIcon.js (100%)
 rename {frontend => app}/components/Icon/StarredIcon.js (100%)
 rename {frontend => app}/components/Icon/StrikethroughIcon.js (100%)
 rename {frontend => app}/components/Icon/TableIcon.js (100%)
 rename {frontend => app}/components/Icon/TodoListIcon.js (100%)
 rename {frontend => app}/components/Icon/TrashIcon.js (100%)
 rename {frontend => app}/components/Icon/index.js (100%)
 rename {frontend => app}/components/Input/Input.js (100%)
 rename {frontend => app}/components/Input/index.js (100%)
 rename {frontend => app}/components/Key/index.js (100%)
 rename {frontend => app}/components/Key/key.js (100%)
 rename {frontend => app}/components/Labeled/Labeled.js (100%)
 rename {frontend => app}/components/Labeled/index.js (100%)
 rename {frontend => app}/components/Layout/Layout.js (100%)
 rename {frontend => app}/components/Layout/components/HeaderBlock.js (100%)
 rename {frontend => app}/components/Layout/components/Modals.js (100%)
 rename {frontend => app}/components/Layout/components/SidebarCollections.js (100%)
 rename {frontend => app}/components/Layout/components/SidebarLink.js (100%)
 rename {frontend => app}/components/Layout/components/Title.js (100%)
 rename {frontend => app}/components/Layout/index.js (100%)
 rename {frontend => app}/components/LoadingIndicator/LoadingIndicator.js (100%)
 rename {frontend => app}/components/LoadingIndicator/LoadingIndicatorBar.js (100%)
 rename {frontend => app}/components/LoadingIndicator/index.js (100%)
 rename {frontend => app}/components/LoadingListPlaceholder/LoadingListPlaceholder.js (100%)
 rename {frontend => app}/components/LoadingListPlaceholder/index.js (100%)
 rename {frontend => app}/components/LoadingPlaceholder/ListPlaceholder.js (100%)
 rename {frontend => app}/components/LoadingPlaceholder/LoadingPlaceholder.js (100%)
 rename {frontend => app}/components/LoadingPlaceholder/components/Mask.js (100%)
 rename {frontend => app}/components/LoadingPlaceholder/index.js (100%)
 rename {frontend => app}/components/Modal/Modal.js (100%)
 rename {frontend => app}/components/Modal/index.js (100%)
 rename {frontend => app}/components/PageTitle/PageTitle.js (100%)
 rename {frontend => app}/components/PageTitle/index.js (100%)
 rename {frontend => app}/components/Popover/Popover.js (100%)
 rename {frontend => app}/components/Popover/index.js (100%)
 rename {frontend => app}/components/RouteSidebarHidden/RouteSidebarHidden.js (100%)
 rename {frontend => app}/components/RouteSidebarHidden/index.js (100%)
 rename {frontend => app}/components/ScrollToTop/ScrollToTop.js (100%)
 rename {frontend => app}/components/ScrollToTop/index.js (100%)
 rename {frontend => app}/components/Scrollable/Scrollable.js (100%)
 rename {frontend => app}/components/Scrollable/index.js (100%)
 rename {frontend => app}/components/SlackAuthLink/SlackAuthLink.js (100%)
 rename {frontend => app}/components/SlackAuthLink/assets/slack_icon.svg (100%)
 rename {frontend => app}/components/SlackAuthLink/index.js (100%)
 rename {frontend => app}/components/Toasts/Toasts.js (100%)
 rename {frontend => app}/components/Toasts/components/Toast.js (100%)
 rename {frontend => app}/components/Toasts/index.js (100%)
 rename {frontend => app}/components/Tooltip/index.js (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-Black-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-BlackItalic-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-Bold-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-BoldItalic-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-Light-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-LightItalic-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-Medium-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-MediumItalic-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-Regular-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-RegularItalic-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-Thin-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasGrotesk-ThinItalic-Web.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasTypewriterMedium.woff (100%)
 rename {frontend => app}/fonts/atlas/AtlasTypewriterRegular.woff (100%)
 rename {frontend => app}/index.js (100%)
 rename {frontend => app}/menus/AccountMenu.js (100%)
 rename {frontend => app}/menus/BlockMenu.js (100%)
 rename {frontend => app}/menus/CollectionMenu.js (100%)
 rename {frontend => app}/menus/DocumentMenu.js (100%)
 rename {frontend => app}/models/BaseModel.js (100%)
 rename {frontend => app}/models/Collection.js (100%)
 rename {frontend => app}/models/Collection.test.js (100%)
 rename {frontend => app}/models/Document.js (100%)
 rename {frontend => app}/models/Document.test.js (100%)
 rename {frontend => app}/scenes/Collection/Collection.js (100%)
 rename {frontend => app}/scenes/Collection/index.js (100%)
 rename {frontend => app}/scenes/CollectionDelete/CollectionDelete.js (100%)
 rename {frontend => app}/scenes/CollectionDelete/index.js (100%)
 rename {frontend => app}/scenes/CollectionEdit/CollectionEdit.js (100%)
 rename {frontend => app}/scenes/CollectionEdit/index.js (100%)
 rename {frontend => app}/scenes/CollectionNew/CollectionNew.js (100%)
 rename {frontend => app}/scenes/CollectionNew/index.js (100%)
 rename {frontend => app}/scenes/Dashboard/Dashboard.js (100%)
 rename {frontend => app}/scenes/Dashboard/index.js (100%)
 rename {frontend => app}/scenes/Document/Document.js (100%)
 rename {frontend => app}/scenes/Document/components/DocumentMove/DocumentMove.js (100%)
 rename {frontend => app}/scenes/Document/components/DocumentMove/components/PathToDocument.js (100%)
 rename {frontend => app}/scenes/Document/components/DocumentMove/index.js (100%)
 rename {frontend => app}/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js (100%)
 rename {frontend => app}/scenes/Document/components/LoadingPlaceholder/index.js (100%)
 rename {frontend => app}/scenes/Document/components/SaveAction/SaveAction.js (100%)
 rename {frontend => app}/scenes/Document/components/SaveAction/index.js (100%)
 rename {frontend => app}/scenes/Document/index.js (100%)
 rename {frontend => app}/scenes/DocumentDelete/DocumentDelete.js (100%)
 rename {frontend => app}/scenes/DocumentDelete/index.js (100%)
 rename {frontend => app}/scenes/Error404/Error404.js (100%)
 rename {frontend => app}/scenes/Error404/index.js (100%)
 rename {frontend => app}/scenes/ErrorAuth/ErrorAuth.js (100%)
 rename {frontend => app}/scenes/ErrorAuth/index.js (100%)
 rename {frontend => app}/scenes/Flatpage/Flatpage.js (100%)
 rename {frontend => app}/scenes/Flatpage/index.js (100%)
 rename {frontend => app}/scenes/Home/Home.js (100%)
 rename {frontend => app}/scenes/Home/index.js (100%)
 rename {frontend => app}/scenes/KeyboardShortcuts/KeyboardShortcuts.js (100%)
 rename {frontend => app}/scenes/KeyboardShortcuts/index.js (100%)
 rename {frontend => app}/scenes/Search/Search.js (100%)
 rename {frontend => app}/scenes/Search/components/SearchField/SearchField.js (100%)
 rename {frontend => app}/scenes/Search/components/SearchField/index.js (100%)
 rename {frontend => app}/scenes/Search/index.js (100%)
 rename {frontend => app}/scenes/Settings/Settings.js (100%)
 rename {frontend => app}/scenes/Settings/SettingsStore.js (100%)
 rename {frontend => app}/scenes/Settings/components/ApiKeyRow/ApiKeyRow.js (100%)
 rename {frontend => app}/scenes/Settings/components/ApiKeyRow/index.js (100%)
 rename {frontend => app}/scenes/Settings/index.js (100%)
 rename {frontend => app}/scenes/SlackAuth/SlackAuth.js (100%)
 rename {frontend => app}/scenes/SlackAuth/index.js (100%)
 rename {frontend => app}/scenes/Starred/Starred.js (100%)
 rename {frontend => app}/scenes/Starred/index.js (100%)
 rename {frontend => app}/static/flatpages/api.md (100%)
 rename {frontend => app}/static/flatpages/index.js (100%)
 rename {frontend => app}/stores/AuthStore.js (100%)
 rename {frontend => app}/stores/BaseStore.js (100%)
 rename {frontend => app}/stores/CacheStore.js (100%)
 rename {frontend => app}/stores/CollectionsStore.js (100%)
 rename {frontend => app}/stores/CollectionsStore.test.js (100%)
 rename {frontend => app}/stores/DocumentsStore.js (100%)
 rename {frontend => app}/stores/ErrorsStore.js (100%)
 rename {frontend => app}/stores/ErrorsStore.test.js (100%)
 rename {frontend => app}/stores/UiStore.js (100%)
 rename {frontend => app}/stores/index.js (100%)
 rename {frontend => app}/styles/animations.js (100%)
 rename {frontend => app}/styles/base.css (100%)
 rename {frontend => app}/styles/constants.js (100%)
 rename {frontend => app}/styles/fonts.css (100%)
 rename {frontend => app}/styles/prism.css (100%)
 rename {frontend => app}/styles/transitions.css (100%)
 rename {frontend => app}/types/index.js (100%)
 rename {frontend => app}/utils/ApiClient.js (100%)
 rename {frontend => app}/utils/__mocks__/ApiClient.js (100%)
 rename {frontend => app}/utils/getDataTransferFiles.js (100%)
 rename {frontend => app}/utils/random.js (100%)
 rename {frontend => app}/utils/routeHelpers.js (100%)
 rename {frontend => app}/utils/uploadFile.js (100%)

diff --git a/.flowconfig b/.flowconfig
index ef6f9d9ea..66fe67dae 100644
--- a/.flowconfig
+++ b/.flowconfig
@@ -1,5 +1,5 @@
 [include]
-.*/frontend/.*
+.*/app/.*
 .*/server/.*
 .*/shared/.*
 
@@ -17,7 +17,7 @@
 emoji=true
 
 module.system.node.resolve_dirname=node_modules
-module.system.node.resolve_dirname=frontend
+module.system.node.resolve_dirname=app
 
 module.name_mapper='^\(.*\)\.s?css$' -> 'empty/object'
 module.name_mapper='^\(.*\)\.md$' -> 'empty/object'
diff --git a/frontend/components/Alert/Alert.js b/app/components/Alert/Alert.js
similarity index 100%
rename from frontend/components/Alert/Alert.js
rename to app/components/Alert/Alert.js
diff --git a/frontend/components/Alert/index.js b/app/components/Alert/index.js
similarity index 100%
rename from frontend/components/Alert/index.js
rename to app/components/Alert/index.js
diff --git a/frontend/components/Avatar/Avatar.js b/app/components/Avatar/Avatar.js
similarity index 100%
rename from frontend/components/Avatar/Avatar.js
rename to app/components/Avatar/Avatar.js
diff --git a/frontend/components/Avatar/index.js b/app/components/Avatar/index.js
similarity index 100%
rename from frontend/components/Avatar/index.js
rename to app/components/Avatar/index.js
diff --git a/frontend/components/Button/Button.js b/app/components/Button/Button.js
similarity index 100%
rename from frontend/components/Button/Button.js
rename to app/components/Button/Button.js
diff --git a/frontend/components/Button/index.js b/app/components/Button/index.js
similarity index 100%
rename from frontend/components/Button/index.js
rename to app/components/Button/index.js
diff --git a/frontend/components/CenteredContent/CenteredContent.js b/app/components/CenteredContent/CenteredContent.js
similarity index 100%
rename from frontend/components/CenteredContent/CenteredContent.js
rename to app/components/CenteredContent/CenteredContent.js
diff --git a/frontend/components/CenteredContent/index.js b/app/components/CenteredContent/index.js
similarity index 100%
rename from frontend/components/CenteredContent/index.js
rename to app/components/CenteredContent/index.js
diff --git a/frontend/components/Collaborators/Collaborators.js b/app/components/Collaborators/Collaborators.js
similarity index 100%
rename from frontend/components/Collaborators/Collaborators.js
rename to app/components/Collaborators/Collaborators.js
diff --git a/frontend/components/Collaborators/index.js b/app/components/Collaborators/index.js
similarity index 100%
rename from frontend/components/Collaborators/index.js
rename to app/components/Collaborators/index.js
diff --git a/frontend/components/CopyToClipboard/CopyToClipboard.js b/app/components/CopyToClipboard/CopyToClipboard.js
similarity index 100%
rename from frontend/components/CopyToClipboard/CopyToClipboard.js
rename to app/components/CopyToClipboard/CopyToClipboard.js
diff --git a/frontend/components/CopyToClipboard/index.js b/app/components/CopyToClipboard/index.js
similarity index 100%
rename from frontend/components/CopyToClipboard/index.js
rename to app/components/CopyToClipboard/index.js
diff --git a/frontend/components/Divider/Divider.js b/app/components/Divider/Divider.js
similarity index 100%
rename from frontend/components/Divider/Divider.js
rename to app/components/Divider/Divider.js
diff --git a/frontend/components/Divider/index.js b/app/components/Divider/index.js
similarity index 100%
rename from frontend/components/Divider/index.js
rename to app/components/Divider/index.js
diff --git a/frontend/components/DocumentList/DocumentList.js b/app/components/DocumentList/DocumentList.js
similarity index 100%
rename from frontend/components/DocumentList/DocumentList.js
rename to app/components/DocumentList/DocumentList.js
diff --git a/frontend/components/DocumentList/index.js b/app/components/DocumentList/index.js
similarity index 100%
rename from frontend/components/DocumentList/index.js
rename to app/components/DocumentList/index.js
diff --git a/frontend/components/DocumentPreview/DocumentPreview.js b/app/components/DocumentPreview/DocumentPreview.js
similarity index 100%
rename from frontend/components/DocumentPreview/DocumentPreview.js
rename to app/components/DocumentPreview/DocumentPreview.js
diff --git a/frontend/components/DocumentPreview/components/PublishingInfo.js b/app/components/DocumentPreview/components/PublishingInfo.js
similarity index 100%
rename from frontend/components/DocumentPreview/components/PublishingInfo.js
rename to app/components/DocumentPreview/components/PublishingInfo.js
diff --git a/frontend/components/DocumentPreview/index.js b/app/components/DocumentPreview/index.js
similarity index 100%
rename from frontend/components/DocumentPreview/index.js
rename to app/components/DocumentPreview/index.js
diff --git a/frontend/components/DocumentViews/DocumentViewersStore.js b/app/components/DocumentViews/DocumentViewersStore.js
similarity index 100%
rename from frontend/components/DocumentViews/DocumentViewersStore.js
rename to app/components/DocumentViews/DocumentViewersStore.js
diff --git a/frontend/components/DocumentViews/DocumentViews.js b/app/components/DocumentViews/DocumentViews.js
similarity index 100%
rename from frontend/components/DocumentViews/DocumentViews.js
rename to app/components/DocumentViews/DocumentViews.js
diff --git a/frontend/components/DocumentViews/components/DocumentViewers/DocumentViewers.js b/app/components/DocumentViews/components/DocumentViewers/DocumentViewers.js
similarity index 100%
rename from frontend/components/DocumentViews/components/DocumentViewers/DocumentViewers.js
rename to app/components/DocumentViews/components/DocumentViewers/DocumentViewers.js
diff --git a/frontend/components/DocumentViews/components/DocumentViewers/index.js b/app/components/DocumentViews/components/DocumentViewers/index.js
similarity index 100%
rename from frontend/components/DocumentViews/components/DocumentViewers/index.js
rename to app/components/DocumentViews/components/DocumentViewers/index.js
diff --git a/frontend/components/DocumentViews/index.js b/app/components/DocumentViews/index.js
similarity index 100%
rename from frontend/components/DocumentViews/index.js
rename to app/components/DocumentViews/index.js
diff --git a/frontend/components/DropToImport/DropToImport.js b/app/components/DropToImport/DropToImport.js
similarity index 100%
rename from frontend/components/DropToImport/DropToImport.js
rename to app/components/DropToImport/DropToImport.js
diff --git a/frontend/components/DropToImport/index.js b/app/components/DropToImport/index.js
similarity index 100%
rename from frontend/components/DropToImport/index.js
rename to app/components/DropToImport/index.js
diff --git a/frontend/components/DropdownMenu/DropdownMenu.js b/app/components/DropdownMenu/DropdownMenu.js
similarity index 100%
rename from frontend/components/DropdownMenu/DropdownMenu.js
rename to app/components/DropdownMenu/DropdownMenu.js
diff --git a/frontend/components/DropdownMenu/DropdownMenuItem.js b/app/components/DropdownMenu/DropdownMenuItem.js
similarity index 100%
rename from frontend/components/DropdownMenu/DropdownMenuItem.js
rename to app/components/DropdownMenu/DropdownMenuItem.js
diff --git a/frontend/components/DropdownMenu/index.js b/app/components/DropdownMenu/index.js
similarity index 100%
rename from frontend/components/DropdownMenu/index.js
rename to app/components/DropdownMenu/index.js
diff --git a/frontend/components/Editor/Editor.js b/app/components/Editor/Editor.js
similarity index 100%
rename from frontend/components/Editor/Editor.js
rename to app/components/Editor/Editor.js
diff --git a/frontend/components/Editor/components/BlockInsert.js b/app/components/Editor/components/BlockInsert.js
similarity index 100%
rename from frontend/components/Editor/components/BlockInsert.js
rename to app/components/Editor/components/BlockInsert.js
diff --git a/frontend/components/Editor/components/ClickablePadding/ClickablePadding.js b/app/components/Editor/components/ClickablePadding/ClickablePadding.js
similarity index 100%
rename from frontend/components/Editor/components/ClickablePadding/ClickablePadding.js
rename to app/components/Editor/components/ClickablePadding/ClickablePadding.js
diff --git a/frontend/components/Editor/components/ClickablePadding/index.js b/app/components/Editor/components/ClickablePadding/index.js
similarity index 100%
rename from frontend/components/Editor/components/ClickablePadding/index.js
rename to app/components/Editor/components/ClickablePadding/index.js
diff --git a/frontend/components/Editor/components/Code.js b/app/components/Editor/components/Code.js
similarity index 100%
rename from frontend/components/Editor/components/Code.js
rename to app/components/Editor/components/Code.js
diff --git a/frontend/components/Editor/components/Contents.js b/app/components/Editor/components/Contents.js
similarity index 100%
rename from frontend/components/Editor/components/Contents.js
rename to app/components/Editor/components/Contents.js
diff --git a/frontend/components/Editor/components/CopyButton.js b/app/components/Editor/components/CopyButton.js
similarity index 100%
rename from frontend/components/Editor/components/CopyButton.js
rename to app/components/Editor/components/CopyButton.js
diff --git a/frontend/components/Editor/components/Heading.js b/app/components/Editor/components/Heading.js
similarity index 100%
rename from frontend/components/Editor/components/Heading.js
rename to app/components/Editor/components/Heading.js
diff --git a/frontend/components/Editor/components/HorizontalRule.js b/app/components/Editor/components/HorizontalRule.js
similarity index 100%
rename from frontend/components/Editor/components/HorizontalRule.js
rename to app/components/Editor/components/HorizontalRule.js
diff --git a/frontend/components/Editor/components/Image.js b/app/components/Editor/components/Image.js
similarity index 100%
rename from frontend/components/Editor/components/Image.js
rename to app/components/Editor/components/Image.js
diff --git a/frontend/components/Editor/components/InlineCode.js b/app/components/Editor/components/InlineCode.js
similarity index 100%
rename from frontend/components/Editor/components/InlineCode.js
rename to app/components/Editor/components/InlineCode.js
diff --git a/frontend/components/Editor/components/Link.js b/app/components/Editor/components/Link.js
similarity index 100%
rename from frontend/components/Editor/components/Link.js
rename to app/components/Editor/components/Link.js
diff --git a/frontend/components/Editor/components/ListItem.js b/app/components/Editor/components/ListItem.js
similarity index 100%
rename from frontend/components/Editor/components/ListItem.js
rename to app/components/Editor/components/ListItem.js
diff --git a/frontend/components/Editor/components/Paragraph.js b/app/components/Editor/components/Paragraph.js
similarity index 100%
rename from frontend/components/Editor/components/Paragraph.js
rename to app/components/Editor/components/Paragraph.js
diff --git a/frontend/components/Editor/components/Placeholder.js b/app/components/Editor/components/Placeholder.js
similarity index 100%
rename from frontend/components/Editor/components/Placeholder.js
rename to app/components/Editor/components/Placeholder.js
diff --git a/frontend/components/Editor/components/TodoItem.js b/app/components/Editor/components/TodoItem.js
similarity index 100%
rename from frontend/components/Editor/components/TodoItem.js
rename to app/components/Editor/components/TodoItem.js
diff --git a/frontend/components/Editor/components/TodoList.js b/app/components/Editor/components/TodoList.js
similarity index 100%
rename from frontend/components/Editor/components/TodoList.js
rename to app/components/Editor/components/TodoList.js
diff --git a/frontend/components/Editor/components/Toolbar/Toolbar.js b/app/components/Editor/components/Toolbar/Toolbar.js
similarity index 100%
rename from frontend/components/Editor/components/Toolbar/Toolbar.js
rename to app/components/Editor/components/Toolbar/Toolbar.js
diff --git a/frontend/components/Editor/components/Toolbar/components/DocumentResult.js b/app/components/Editor/components/Toolbar/components/DocumentResult.js
similarity index 100%
rename from frontend/components/Editor/components/Toolbar/components/DocumentResult.js
rename to app/components/Editor/components/Toolbar/components/DocumentResult.js
diff --git a/frontend/components/Editor/components/Toolbar/components/FormattingToolbar.js b/app/components/Editor/components/Toolbar/components/FormattingToolbar.js
similarity index 100%
rename from frontend/components/Editor/components/Toolbar/components/FormattingToolbar.js
rename to app/components/Editor/components/Toolbar/components/FormattingToolbar.js
diff --git a/frontend/components/Editor/components/Toolbar/components/LinkToolbar.js b/app/components/Editor/components/Toolbar/components/LinkToolbar.js
similarity index 100%
rename from frontend/components/Editor/components/Toolbar/components/LinkToolbar.js
rename to app/components/Editor/components/Toolbar/components/LinkToolbar.js
diff --git a/frontend/components/Editor/components/Toolbar/components/ToolbarButton.js b/app/components/Editor/components/Toolbar/components/ToolbarButton.js
similarity index 100%
rename from frontend/components/Editor/components/Toolbar/components/ToolbarButton.js
rename to app/components/Editor/components/Toolbar/components/ToolbarButton.js
diff --git a/frontend/components/Editor/components/Toolbar/index.js b/app/components/Editor/components/Toolbar/index.js
similarity index 100%
rename from frontend/components/Editor/components/Toolbar/index.js
rename to app/components/Editor/components/Toolbar/index.js
diff --git a/frontend/components/Editor/headingToSlug.js b/app/components/Editor/headingToSlug.js
similarity index 100%
rename from frontend/components/Editor/headingToSlug.js
rename to app/components/Editor/headingToSlug.js
diff --git a/frontend/components/Editor/index.js b/app/components/Editor/index.js
similarity index 100%
rename from frontend/components/Editor/index.js
rename to app/components/Editor/index.js
diff --git a/frontend/components/Editor/insertImage.js b/app/components/Editor/insertImage.js
similarity index 100%
rename from frontend/components/Editor/insertImage.js
rename to app/components/Editor/insertImage.js
diff --git a/frontend/components/Editor/plugins.js b/app/components/Editor/plugins.js
similarity index 100%
rename from frontend/components/Editor/plugins.js
rename to app/components/Editor/plugins.js
diff --git a/frontend/components/Editor/plugins/EditList.js b/app/components/Editor/plugins/EditList.js
similarity index 100%
rename from frontend/components/Editor/plugins/EditList.js
rename to app/components/Editor/plugins/EditList.js
diff --git a/frontend/components/Editor/plugins/KeyboardShortcuts.js b/app/components/Editor/plugins/KeyboardShortcuts.js
similarity index 100%
rename from frontend/components/Editor/plugins/KeyboardShortcuts.js
rename to app/components/Editor/plugins/KeyboardShortcuts.js
diff --git a/frontend/components/Editor/plugins/MarkdownShortcuts.js b/app/components/Editor/plugins/MarkdownShortcuts.js
similarity index 100%
rename from frontend/components/Editor/plugins/MarkdownShortcuts.js
rename to app/components/Editor/plugins/MarkdownShortcuts.js
diff --git a/frontend/components/Editor/schema.js b/app/components/Editor/schema.js
similarity index 100%
rename from frontend/components/Editor/schema.js
rename to app/components/Editor/schema.js
diff --git a/frontend/components/Editor/serializer.js b/app/components/Editor/serializer.js
similarity index 100%
rename from frontend/components/Editor/serializer.js
rename to app/components/Editor/serializer.js
diff --git a/frontend/components/Editor/types.js b/app/components/Editor/types.js
similarity index 100%
rename from frontend/components/Editor/types.js
rename to app/components/Editor/types.js
diff --git a/frontend/components/Empty/Empty.js b/app/components/Empty/Empty.js
similarity index 100%
rename from frontend/components/Empty/Empty.js
rename to app/components/Empty/Empty.js
diff --git a/frontend/components/Empty/index.js b/app/components/Empty/index.js
similarity index 100%
rename from frontend/components/Empty/index.js
rename to app/components/Empty/index.js
diff --git a/frontend/components/Flex/Flex.js b/app/components/Flex/Flex.js
similarity index 100%
rename from frontend/components/Flex/Flex.js
rename to app/components/Flex/Flex.js
diff --git a/frontend/components/Flex/index.js b/app/components/Flex/index.js
similarity index 100%
rename from frontend/components/Flex/index.js
rename to app/components/Flex/index.js
diff --git a/frontend/components/HelpText/HelpText.js b/app/components/HelpText/HelpText.js
similarity index 100%
rename from frontend/components/HelpText/HelpText.js
rename to app/components/HelpText/HelpText.js
diff --git a/frontend/components/HelpText/index.js b/app/components/HelpText/index.js
similarity index 100%
rename from frontend/components/HelpText/index.js
rename to app/components/HelpText/index.js
diff --git a/frontend/components/Icon/BackIcon.js b/app/components/Icon/BackIcon.js
similarity index 100%
rename from frontend/components/Icon/BackIcon.js
rename to app/components/Icon/BackIcon.js
diff --git a/frontend/components/Icon/BoldIcon.js b/app/components/Icon/BoldIcon.js
similarity index 100%
rename from frontend/components/Icon/BoldIcon.js
rename to app/components/Icon/BoldIcon.js
diff --git a/frontend/components/Icon/BulletedListIcon.js b/app/components/Icon/BulletedListIcon.js
similarity index 100%
rename from frontend/components/Icon/BulletedListIcon.js
rename to app/components/Icon/BulletedListIcon.js
diff --git a/frontend/components/Icon/CheckboxIcon.js b/app/components/Icon/CheckboxIcon.js
similarity index 100%
rename from frontend/components/Icon/CheckboxIcon.js
rename to app/components/Icon/CheckboxIcon.js
diff --git a/frontend/components/Icon/CloseIcon.js b/app/components/Icon/CloseIcon.js
similarity index 100%
rename from frontend/components/Icon/CloseIcon.js
rename to app/components/Icon/CloseIcon.js
diff --git a/frontend/components/Icon/CodeIcon.js b/app/components/Icon/CodeIcon.js
similarity index 100%
rename from frontend/components/Icon/CodeIcon.js
rename to app/components/Icon/CodeIcon.js
diff --git a/frontend/components/Icon/CollapsedIcon.js b/app/components/Icon/CollapsedIcon.js
similarity index 100%
rename from frontend/components/Icon/CollapsedIcon.js
rename to app/components/Icon/CollapsedIcon.js
diff --git a/frontend/components/Icon/CollectionIcon.js b/app/components/Icon/CollectionIcon.js
similarity index 100%
rename from frontend/components/Icon/CollectionIcon.js
rename to app/components/Icon/CollectionIcon.js
diff --git a/frontend/components/Icon/DocumentIcon.js b/app/components/Icon/DocumentIcon.js
similarity index 100%
rename from frontend/components/Icon/DocumentIcon.js
rename to app/components/Icon/DocumentIcon.js
diff --git a/frontend/components/Icon/EditIcon.js b/app/components/Icon/EditIcon.js
similarity index 100%
rename from frontend/components/Icon/EditIcon.js
rename to app/components/Icon/EditIcon.js
diff --git a/frontend/components/Icon/GoToIcon.js b/app/components/Icon/GoToIcon.js
similarity index 100%
rename from frontend/components/Icon/GoToIcon.js
rename to app/components/Icon/GoToIcon.js
diff --git a/frontend/components/Icon/Heading1Icon.js b/app/components/Icon/Heading1Icon.js
similarity index 100%
rename from frontend/components/Icon/Heading1Icon.js
rename to app/components/Icon/Heading1Icon.js
diff --git a/frontend/components/Icon/Heading2Icon.js b/app/components/Icon/Heading2Icon.js
similarity index 100%
rename from frontend/components/Icon/Heading2Icon.js
rename to app/components/Icon/Heading2Icon.js
diff --git a/frontend/components/Icon/HomeIcon.js b/app/components/Icon/HomeIcon.js
similarity index 100%
rename from frontend/components/Icon/HomeIcon.js
rename to app/components/Icon/HomeIcon.js
diff --git a/frontend/components/Icon/HorizontalRuleIcon.js b/app/components/Icon/HorizontalRuleIcon.js
similarity index 100%
rename from frontend/components/Icon/HorizontalRuleIcon.js
rename to app/components/Icon/HorizontalRuleIcon.js
diff --git a/frontend/components/Icon/Icon.js b/app/components/Icon/Icon.js
similarity index 100%
rename from frontend/components/Icon/Icon.js
rename to app/components/Icon/Icon.js
diff --git a/frontend/components/Icon/ImageIcon.js b/app/components/Icon/ImageIcon.js
similarity index 100%
rename from frontend/components/Icon/ImageIcon.js
rename to app/components/Icon/ImageIcon.js
diff --git a/frontend/components/Icon/ItalicIcon.js b/app/components/Icon/ItalicIcon.js
similarity index 100%
rename from frontend/components/Icon/ItalicIcon.js
rename to app/components/Icon/ItalicIcon.js
diff --git a/frontend/components/Icon/LinkIcon.js b/app/components/Icon/LinkIcon.js
similarity index 100%
rename from frontend/components/Icon/LinkIcon.js
rename to app/components/Icon/LinkIcon.js
diff --git a/frontend/components/Icon/MoreIcon.js b/app/components/Icon/MoreIcon.js
similarity index 100%
rename from frontend/components/Icon/MoreIcon.js
rename to app/components/Icon/MoreIcon.js
diff --git a/frontend/components/Icon/NewDocumentIcon.js b/app/components/Icon/NewDocumentIcon.js
similarity index 100%
rename from frontend/components/Icon/NewDocumentIcon.js
rename to app/components/Icon/NewDocumentIcon.js
diff --git a/frontend/components/Icon/NextIcon.js b/app/components/Icon/NextIcon.js
similarity index 100%
rename from frontend/components/Icon/NextIcon.js
rename to app/components/Icon/NextIcon.js
diff --git a/frontend/components/Icon/OpenIcon.js b/app/components/Icon/OpenIcon.js
similarity index 100%
rename from frontend/components/Icon/OpenIcon.js
rename to app/components/Icon/OpenIcon.js
diff --git a/frontend/components/Icon/OrderedListIcon.js b/app/components/Icon/OrderedListIcon.js
similarity index 100%
rename from frontend/components/Icon/OrderedListIcon.js
rename to app/components/Icon/OrderedListIcon.js
diff --git a/frontend/components/Icon/PlusIcon.js b/app/components/Icon/PlusIcon.js
similarity index 100%
rename from frontend/components/Icon/PlusIcon.js
rename to app/components/Icon/PlusIcon.js
diff --git a/frontend/components/Icon/SearchIcon.js b/app/components/Icon/SearchIcon.js
similarity index 100%
rename from frontend/components/Icon/SearchIcon.js
rename to app/components/Icon/SearchIcon.js
diff --git a/frontend/components/Icon/StarredIcon.js b/app/components/Icon/StarredIcon.js
similarity index 100%
rename from frontend/components/Icon/StarredIcon.js
rename to app/components/Icon/StarredIcon.js
diff --git a/frontend/components/Icon/StrikethroughIcon.js b/app/components/Icon/StrikethroughIcon.js
similarity index 100%
rename from frontend/components/Icon/StrikethroughIcon.js
rename to app/components/Icon/StrikethroughIcon.js
diff --git a/frontend/components/Icon/TableIcon.js b/app/components/Icon/TableIcon.js
similarity index 100%
rename from frontend/components/Icon/TableIcon.js
rename to app/components/Icon/TableIcon.js
diff --git a/frontend/components/Icon/TodoListIcon.js b/app/components/Icon/TodoListIcon.js
similarity index 100%
rename from frontend/components/Icon/TodoListIcon.js
rename to app/components/Icon/TodoListIcon.js
diff --git a/frontend/components/Icon/TrashIcon.js b/app/components/Icon/TrashIcon.js
similarity index 100%
rename from frontend/components/Icon/TrashIcon.js
rename to app/components/Icon/TrashIcon.js
diff --git a/frontend/components/Icon/index.js b/app/components/Icon/index.js
similarity index 100%
rename from frontend/components/Icon/index.js
rename to app/components/Icon/index.js
diff --git a/frontend/components/Input/Input.js b/app/components/Input/Input.js
similarity index 100%
rename from frontend/components/Input/Input.js
rename to app/components/Input/Input.js
diff --git a/frontend/components/Input/index.js b/app/components/Input/index.js
similarity index 100%
rename from frontend/components/Input/index.js
rename to app/components/Input/index.js
diff --git a/frontend/components/Key/index.js b/app/components/Key/index.js
similarity index 100%
rename from frontend/components/Key/index.js
rename to app/components/Key/index.js
diff --git a/frontend/components/Key/key.js b/app/components/Key/key.js
similarity index 100%
rename from frontend/components/Key/key.js
rename to app/components/Key/key.js
diff --git a/frontend/components/Labeled/Labeled.js b/app/components/Labeled/Labeled.js
similarity index 100%
rename from frontend/components/Labeled/Labeled.js
rename to app/components/Labeled/Labeled.js
diff --git a/frontend/components/Labeled/index.js b/app/components/Labeled/index.js
similarity index 100%
rename from frontend/components/Labeled/index.js
rename to app/components/Labeled/index.js
diff --git a/frontend/components/Layout/Layout.js b/app/components/Layout/Layout.js
similarity index 100%
rename from frontend/components/Layout/Layout.js
rename to app/components/Layout/Layout.js
diff --git a/frontend/components/Layout/components/HeaderBlock.js b/app/components/Layout/components/HeaderBlock.js
similarity index 100%
rename from frontend/components/Layout/components/HeaderBlock.js
rename to app/components/Layout/components/HeaderBlock.js
diff --git a/frontend/components/Layout/components/Modals.js b/app/components/Layout/components/Modals.js
similarity index 100%
rename from frontend/components/Layout/components/Modals.js
rename to app/components/Layout/components/Modals.js
diff --git a/frontend/components/Layout/components/SidebarCollections.js b/app/components/Layout/components/SidebarCollections.js
similarity index 100%
rename from frontend/components/Layout/components/SidebarCollections.js
rename to app/components/Layout/components/SidebarCollections.js
diff --git a/frontend/components/Layout/components/SidebarLink.js b/app/components/Layout/components/SidebarLink.js
similarity index 100%
rename from frontend/components/Layout/components/SidebarLink.js
rename to app/components/Layout/components/SidebarLink.js
diff --git a/frontend/components/Layout/components/Title.js b/app/components/Layout/components/Title.js
similarity index 100%
rename from frontend/components/Layout/components/Title.js
rename to app/components/Layout/components/Title.js
diff --git a/frontend/components/Layout/index.js b/app/components/Layout/index.js
similarity index 100%
rename from frontend/components/Layout/index.js
rename to app/components/Layout/index.js
diff --git a/frontend/components/LoadingIndicator/LoadingIndicator.js b/app/components/LoadingIndicator/LoadingIndicator.js
similarity index 100%
rename from frontend/components/LoadingIndicator/LoadingIndicator.js
rename to app/components/LoadingIndicator/LoadingIndicator.js
diff --git a/frontend/components/LoadingIndicator/LoadingIndicatorBar.js b/app/components/LoadingIndicator/LoadingIndicatorBar.js
similarity index 100%
rename from frontend/components/LoadingIndicator/LoadingIndicatorBar.js
rename to app/components/LoadingIndicator/LoadingIndicatorBar.js
diff --git a/frontend/components/LoadingIndicator/index.js b/app/components/LoadingIndicator/index.js
similarity index 100%
rename from frontend/components/LoadingIndicator/index.js
rename to app/components/LoadingIndicator/index.js
diff --git a/frontend/components/LoadingListPlaceholder/LoadingListPlaceholder.js b/app/components/LoadingListPlaceholder/LoadingListPlaceholder.js
similarity index 100%
rename from frontend/components/LoadingListPlaceholder/LoadingListPlaceholder.js
rename to app/components/LoadingListPlaceholder/LoadingListPlaceholder.js
diff --git a/frontend/components/LoadingListPlaceholder/index.js b/app/components/LoadingListPlaceholder/index.js
similarity index 100%
rename from frontend/components/LoadingListPlaceholder/index.js
rename to app/components/LoadingListPlaceholder/index.js
diff --git a/frontend/components/LoadingPlaceholder/ListPlaceholder.js b/app/components/LoadingPlaceholder/ListPlaceholder.js
similarity index 100%
rename from frontend/components/LoadingPlaceholder/ListPlaceholder.js
rename to app/components/LoadingPlaceholder/ListPlaceholder.js
diff --git a/frontend/components/LoadingPlaceholder/LoadingPlaceholder.js b/app/components/LoadingPlaceholder/LoadingPlaceholder.js
similarity index 100%
rename from frontend/components/LoadingPlaceholder/LoadingPlaceholder.js
rename to app/components/LoadingPlaceholder/LoadingPlaceholder.js
diff --git a/frontend/components/LoadingPlaceholder/components/Mask.js b/app/components/LoadingPlaceholder/components/Mask.js
similarity index 100%
rename from frontend/components/LoadingPlaceholder/components/Mask.js
rename to app/components/LoadingPlaceholder/components/Mask.js
diff --git a/frontend/components/LoadingPlaceholder/index.js b/app/components/LoadingPlaceholder/index.js
similarity index 100%
rename from frontend/components/LoadingPlaceholder/index.js
rename to app/components/LoadingPlaceholder/index.js
diff --git a/frontend/components/Modal/Modal.js b/app/components/Modal/Modal.js
similarity index 100%
rename from frontend/components/Modal/Modal.js
rename to app/components/Modal/Modal.js
diff --git a/frontend/components/Modal/index.js b/app/components/Modal/index.js
similarity index 100%
rename from frontend/components/Modal/index.js
rename to app/components/Modal/index.js
diff --git a/frontend/components/PageTitle/PageTitle.js b/app/components/PageTitle/PageTitle.js
similarity index 100%
rename from frontend/components/PageTitle/PageTitle.js
rename to app/components/PageTitle/PageTitle.js
diff --git a/frontend/components/PageTitle/index.js b/app/components/PageTitle/index.js
similarity index 100%
rename from frontend/components/PageTitle/index.js
rename to app/components/PageTitle/index.js
diff --git a/frontend/components/Popover/Popover.js b/app/components/Popover/Popover.js
similarity index 100%
rename from frontend/components/Popover/Popover.js
rename to app/components/Popover/Popover.js
diff --git a/frontend/components/Popover/index.js b/app/components/Popover/index.js
similarity index 100%
rename from frontend/components/Popover/index.js
rename to app/components/Popover/index.js
diff --git a/frontend/components/RouteSidebarHidden/RouteSidebarHidden.js b/app/components/RouteSidebarHidden/RouteSidebarHidden.js
similarity index 100%
rename from frontend/components/RouteSidebarHidden/RouteSidebarHidden.js
rename to app/components/RouteSidebarHidden/RouteSidebarHidden.js
diff --git a/frontend/components/RouteSidebarHidden/index.js b/app/components/RouteSidebarHidden/index.js
similarity index 100%
rename from frontend/components/RouteSidebarHidden/index.js
rename to app/components/RouteSidebarHidden/index.js
diff --git a/frontend/components/ScrollToTop/ScrollToTop.js b/app/components/ScrollToTop/ScrollToTop.js
similarity index 100%
rename from frontend/components/ScrollToTop/ScrollToTop.js
rename to app/components/ScrollToTop/ScrollToTop.js
diff --git a/frontend/components/ScrollToTop/index.js b/app/components/ScrollToTop/index.js
similarity index 100%
rename from frontend/components/ScrollToTop/index.js
rename to app/components/ScrollToTop/index.js
diff --git a/frontend/components/Scrollable/Scrollable.js b/app/components/Scrollable/Scrollable.js
similarity index 100%
rename from frontend/components/Scrollable/Scrollable.js
rename to app/components/Scrollable/Scrollable.js
diff --git a/frontend/components/Scrollable/index.js b/app/components/Scrollable/index.js
similarity index 100%
rename from frontend/components/Scrollable/index.js
rename to app/components/Scrollable/index.js
diff --git a/frontend/components/SlackAuthLink/SlackAuthLink.js b/app/components/SlackAuthLink/SlackAuthLink.js
similarity index 100%
rename from frontend/components/SlackAuthLink/SlackAuthLink.js
rename to app/components/SlackAuthLink/SlackAuthLink.js
diff --git a/frontend/components/SlackAuthLink/assets/slack_icon.svg b/app/components/SlackAuthLink/assets/slack_icon.svg
similarity index 100%
rename from frontend/components/SlackAuthLink/assets/slack_icon.svg
rename to app/components/SlackAuthLink/assets/slack_icon.svg
diff --git a/frontend/components/SlackAuthLink/index.js b/app/components/SlackAuthLink/index.js
similarity index 100%
rename from frontend/components/SlackAuthLink/index.js
rename to app/components/SlackAuthLink/index.js
diff --git a/frontend/components/Toasts/Toasts.js b/app/components/Toasts/Toasts.js
similarity index 100%
rename from frontend/components/Toasts/Toasts.js
rename to app/components/Toasts/Toasts.js
diff --git a/frontend/components/Toasts/components/Toast.js b/app/components/Toasts/components/Toast.js
similarity index 100%
rename from frontend/components/Toasts/components/Toast.js
rename to app/components/Toasts/components/Toast.js
diff --git a/frontend/components/Toasts/index.js b/app/components/Toasts/index.js
similarity index 100%
rename from frontend/components/Toasts/index.js
rename to app/components/Toasts/index.js
diff --git a/frontend/components/Tooltip/index.js b/app/components/Tooltip/index.js
similarity index 100%
rename from frontend/components/Tooltip/index.js
rename to app/components/Tooltip/index.js
diff --git a/frontend/fonts/atlas/AtlasGrotesk-Black-Web.woff b/app/fonts/atlas/AtlasGrotesk-Black-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-Black-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-Black-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-BlackItalic-Web.woff b/app/fonts/atlas/AtlasGrotesk-BlackItalic-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-BlackItalic-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-BlackItalic-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-Bold-Web.woff b/app/fonts/atlas/AtlasGrotesk-Bold-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-Bold-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-Bold-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-BoldItalic-Web.woff b/app/fonts/atlas/AtlasGrotesk-BoldItalic-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-BoldItalic-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-BoldItalic-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-Light-Web.woff b/app/fonts/atlas/AtlasGrotesk-Light-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-Light-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-Light-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-LightItalic-Web.woff b/app/fonts/atlas/AtlasGrotesk-LightItalic-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-LightItalic-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-LightItalic-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-Medium-Web.woff b/app/fonts/atlas/AtlasGrotesk-Medium-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-Medium-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-Medium-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-MediumItalic-Web.woff b/app/fonts/atlas/AtlasGrotesk-MediumItalic-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-MediumItalic-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-MediumItalic-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-Regular-Web.woff b/app/fonts/atlas/AtlasGrotesk-Regular-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-Regular-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-Regular-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-RegularItalic-Web.woff b/app/fonts/atlas/AtlasGrotesk-RegularItalic-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-RegularItalic-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-RegularItalic-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-Thin-Web.woff b/app/fonts/atlas/AtlasGrotesk-Thin-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-Thin-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-Thin-Web.woff
diff --git a/frontend/fonts/atlas/AtlasGrotesk-ThinItalic-Web.woff b/app/fonts/atlas/AtlasGrotesk-ThinItalic-Web.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasGrotesk-ThinItalic-Web.woff
rename to app/fonts/atlas/AtlasGrotesk-ThinItalic-Web.woff
diff --git a/frontend/fonts/atlas/AtlasTypewriterMedium.woff b/app/fonts/atlas/AtlasTypewriterMedium.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasTypewriterMedium.woff
rename to app/fonts/atlas/AtlasTypewriterMedium.woff
diff --git a/frontend/fonts/atlas/AtlasTypewriterRegular.woff b/app/fonts/atlas/AtlasTypewriterRegular.woff
similarity index 100%
rename from frontend/fonts/atlas/AtlasTypewriterRegular.woff
rename to app/fonts/atlas/AtlasTypewriterRegular.woff
diff --git a/frontend/index.js b/app/index.js
similarity index 100%
rename from frontend/index.js
rename to app/index.js
diff --git a/frontend/menus/AccountMenu.js b/app/menus/AccountMenu.js
similarity index 100%
rename from frontend/menus/AccountMenu.js
rename to app/menus/AccountMenu.js
diff --git a/frontend/menus/BlockMenu.js b/app/menus/BlockMenu.js
similarity index 100%
rename from frontend/menus/BlockMenu.js
rename to app/menus/BlockMenu.js
diff --git a/frontend/menus/CollectionMenu.js b/app/menus/CollectionMenu.js
similarity index 100%
rename from frontend/menus/CollectionMenu.js
rename to app/menus/CollectionMenu.js
diff --git a/frontend/menus/DocumentMenu.js b/app/menus/DocumentMenu.js
similarity index 100%
rename from frontend/menus/DocumentMenu.js
rename to app/menus/DocumentMenu.js
diff --git a/frontend/models/BaseModel.js b/app/models/BaseModel.js
similarity index 100%
rename from frontend/models/BaseModel.js
rename to app/models/BaseModel.js
diff --git a/frontend/models/Collection.js b/app/models/Collection.js
similarity index 100%
rename from frontend/models/Collection.js
rename to app/models/Collection.js
diff --git a/frontend/models/Collection.test.js b/app/models/Collection.test.js
similarity index 100%
rename from frontend/models/Collection.test.js
rename to app/models/Collection.test.js
diff --git a/frontend/models/Document.js b/app/models/Document.js
similarity index 100%
rename from frontend/models/Document.js
rename to app/models/Document.js
diff --git a/frontend/models/Document.test.js b/app/models/Document.test.js
similarity index 100%
rename from frontend/models/Document.test.js
rename to app/models/Document.test.js
diff --git a/frontend/scenes/Collection/Collection.js b/app/scenes/Collection/Collection.js
similarity index 100%
rename from frontend/scenes/Collection/Collection.js
rename to app/scenes/Collection/Collection.js
diff --git a/frontend/scenes/Collection/index.js b/app/scenes/Collection/index.js
similarity index 100%
rename from frontend/scenes/Collection/index.js
rename to app/scenes/Collection/index.js
diff --git a/frontend/scenes/CollectionDelete/CollectionDelete.js b/app/scenes/CollectionDelete/CollectionDelete.js
similarity index 100%
rename from frontend/scenes/CollectionDelete/CollectionDelete.js
rename to app/scenes/CollectionDelete/CollectionDelete.js
diff --git a/frontend/scenes/CollectionDelete/index.js b/app/scenes/CollectionDelete/index.js
similarity index 100%
rename from frontend/scenes/CollectionDelete/index.js
rename to app/scenes/CollectionDelete/index.js
diff --git a/frontend/scenes/CollectionEdit/CollectionEdit.js b/app/scenes/CollectionEdit/CollectionEdit.js
similarity index 100%
rename from frontend/scenes/CollectionEdit/CollectionEdit.js
rename to app/scenes/CollectionEdit/CollectionEdit.js
diff --git a/frontend/scenes/CollectionEdit/index.js b/app/scenes/CollectionEdit/index.js
similarity index 100%
rename from frontend/scenes/CollectionEdit/index.js
rename to app/scenes/CollectionEdit/index.js
diff --git a/frontend/scenes/CollectionNew/CollectionNew.js b/app/scenes/CollectionNew/CollectionNew.js
similarity index 100%
rename from frontend/scenes/CollectionNew/CollectionNew.js
rename to app/scenes/CollectionNew/CollectionNew.js
diff --git a/frontend/scenes/CollectionNew/index.js b/app/scenes/CollectionNew/index.js
similarity index 100%
rename from frontend/scenes/CollectionNew/index.js
rename to app/scenes/CollectionNew/index.js
diff --git a/frontend/scenes/Dashboard/Dashboard.js b/app/scenes/Dashboard/Dashboard.js
similarity index 100%
rename from frontend/scenes/Dashboard/Dashboard.js
rename to app/scenes/Dashboard/Dashboard.js
diff --git a/frontend/scenes/Dashboard/index.js b/app/scenes/Dashboard/index.js
similarity index 100%
rename from frontend/scenes/Dashboard/index.js
rename to app/scenes/Dashboard/index.js
diff --git a/frontend/scenes/Document/Document.js b/app/scenes/Document/Document.js
similarity index 100%
rename from frontend/scenes/Document/Document.js
rename to app/scenes/Document/Document.js
diff --git a/frontend/scenes/Document/components/DocumentMove/DocumentMove.js b/app/scenes/Document/components/DocumentMove/DocumentMove.js
similarity index 100%
rename from frontend/scenes/Document/components/DocumentMove/DocumentMove.js
rename to app/scenes/Document/components/DocumentMove/DocumentMove.js
diff --git a/frontend/scenes/Document/components/DocumentMove/components/PathToDocument.js b/app/scenes/Document/components/DocumentMove/components/PathToDocument.js
similarity index 100%
rename from frontend/scenes/Document/components/DocumentMove/components/PathToDocument.js
rename to app/scenes/Document/components/DocumentMove/components/PathToDocument.js
diff --git a/frontend/scenes/Document/components/DocumentMove/index.js b/app/scenes/Document/components/DocumentMove/index.js
similarity index 100%
rename from frontend/scenes/Document/components/DocumentMove/index.js
rename to app/scenes/Document/components/DocumentMove/index.js
diff --git a/frontend/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js b/app/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js
similarity index 100%
rename from frontend/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js
rename to app/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js
diff --git a/frontend/scenes/Document/components/LoadingPlaceholder/index.js b/app/scenes/Document/components/LoadingPlaceholder/index.js
similarity index 100%
rename from frontend/scenes/Document/components/LoadingPlaceholder/index.js
rename to app/scenes/Document/components/LoadingPlaceholder/index.js
diff --git a/frontend/scenes/Document/components/SaveAction/SaveAction.js b/app/scenes/Document/components/SaveAction/SaveAction.js
similarity index 100%
rename from frontend/scenes/Document/components/SaveAction/SaveAction.js
rename to app/scenes/Document/components/SaveAction/SaveAction.js
diff --git a/frontend/scenes/Document/components/SaveAction/index.js b/app/scenes/Document/components/SaveAction/index.js
similarity index 100%
rename from frontend/scenes/Document/components/SaveAction/index.js
rename to app/scenes/Document/components/SaveAction/index.js
diff --git a/frontend/scenes/Document/index.js b/app/scenes/Document/index.js
similarity index 100%
rename from frontend/scenes/Document/index.js
rename to app/scenes/Document/index.js
diff --git a/frontend/scenes/DocumentDelete/DocumentDelete.js b/app/scenes/DocumentDelete/DocumentDelete.js
similarity index 100%
rename from frontend/scenes/DocumentDelete/DocumentDelete.js
rename to app/scenes/DocumentDelete/DocumentDelete.js
diff --git a/frontend/scenes/DocumentDelete/index.js b/app/scenes/DocumentDelete/index.js
similarity index 100%
rename from frontend/scenes/DocumentDelete/index.js
rename to app/scenes/DocumentDelete/index.js
diff --git a/frontend/scenes/Error404/Error404.js b/app/scenes/Error404/Error404.js
similarity index 100%
rename from frontend/scenes/Error404/Error404.js
rename to app/scenes/Error404/Error404.js
diff --git a/frontend/scenes/Error404/index.js b/app/scenes/Error404/index.js
similarity index 100%
rename from frontend/scenes/Error404/index.js
rename to app/scenes/Error404/index.js
diff --git a/frontend/scenes/ErrorAuth/ErrorAuth.js b/app/scenes/ErrorAuth/ErrorAuth.js
similarity index 100%
rename from frontend/scenes/ErrorAuth/ErrorAuth.js
rename to app/scenes/ErrorAuth/ErrorAuth.js
diff --git a/frontend/scenes/ErrorAuth/index.js b/app/scenes/ErrorAuth/index.js
similarity index 100%
rename from frontend/scenes/ErrorAuth/index.js
rename to app/scenes/ErrorAuth/index.js
diff --git a/frontend/scenes/Flatpage/Flatpage.js b/app/scenes/Flatpage/Flatpage.js
similarity index 100%
rename from frontend/scenes/Flatpage/Flatpage.js
rename to app/scenes/Flatpage/Flatpage.js
diff --git a/frontend/scenes/Flatpage/index.js b/app/scenes/Flatpage/index.js
similarity index 100%
rename from frontend/scenes/Flatpage/index.js
rename to app/scenes/Flatpage/index.js
diff --git a/frontend/scenes/Home/Home.js b/app/scenes/Home/Home.js
similarity index 100%
rename from frontend/scenes/Home/Home.js
rename to app/scenes/Home/Home.js
diff --git a/frontend/scenes/Home/index.js b/app/scenes/Home/index.js
similarity index 100%
rename from frontend/scenes/Home/index.js
rename to app/scenes/Home/index.js
diff --git a/frontend/scenes/KeyboardShortcuts/KeyboardShortcuts.js b/app/scenes/KeyboardShortcuts/KeyboardShortcuts.js
similarity index 100%
rename from frontend/scenes/KeyboardShortcuts/KeyboardShortcuts.js
rename to app/scenes/KeyboardShortcuts/KeyboardShortcuts.js
diff --git a/frontend/scenes/KeyboardShortcuts/index.js b/app/scenes/KeyboardShortcuts/index.js
similarity index 100%
rename from frontend/scenes/KeyboardShortcuts/index.js
rename to app/scenes/KeyboardShortcuts/index.js
diff --git a/frontend/scenes/Search/Search.js b/app/scenes/Search/Search.js
similarity index 100%
rename from frontend/scenes/Search/Search.js
rename to app/scenes/Search/Search.js
diff --git a/frontend/scenes/Search/components/SearchField/SearchField.js b/app/scenes/Search/components/SearchField/SearchField.js
similarity index 100%
rename from frontend/scenes/Search/components/SearchField/SearchField.js
rename to app/scenes/Search/components/SearchField/SearchField.js
diff --git a/frontend/scenes/Search/components/SearchField/index.js b/app/scenes/Search/components/SearchField/index.js
similarity index 100%
rename from frontend/scenes/Search/components/SearchField/index.js
rename to app/scenes/Search/components/SearchField/index.js
diff --git a/frontend/scenes/Search/index.js b/app/scenes/Search/index.js
similarity index 100%
rename from frontend/scenes/Search/index.js
rename to app/scenes/Search/index.js
diff --git a/frontend/scenes/Settings/Settings.js b/app/scenes/Settings/Settings.js
similarity index 100%
rename from frontend/scenes/Settings/Settings.js
rename to app/scenes/Settings/Settings.js
diff --git a/frontend/scenes/Settings/SettingsStore.js b/app/scenes/Settings/SettingsStore.js
similarity index 100%
rename from frontend/scenes/Settings/SettingsStore.js
rename to app/scenes/Settings/SettingsStore.js
diff --git a/frontend/scenes/Settings/components/ApiKeyRow/ApiKeyRow.js b/app/scenes/Settings/components/ApiKeyRow/ApiKeyRow.js
similarity index 100%
rename from frontend/scenes/Settings/components/ApiKeyRow/ApiKeyRow.js
rename to app/scenes/Settings/components/ApiKeyRow/ApiKeyRow.js
diff --git a/frontend/scenes/Settings/components/ApiKeyRow/index.js b/app/scenes/Settings/components/ApiKeyRow/index.js
similarity index 100%
rename from frontend/scenes/Settings/components/ApiKeyRow/index.js
rename to app/scenes/Settings/components/ApiKeyRow/index.js
diff --git a/frontend/scenes/Settings/index.js b/app/scenes/Settings/index.js
similarity index 100%
rename from frontend/scenes/Settings/index.js
rename to app/scenes/Settings/index.js
diff --git a/frontend/scenes/SlackAuth/SlackAuth.js b/app/scenes/SlackAuth/SlackAuth.js
similarity index 100%
rename from frontend/scenes/SlackAuth/SlackAuth.js
rename to app/scenes/SlackAuth/SlackAuth.js
diff --git a/frontend/scenes/SlackAuth/index.js b/app/scenes/SlackAuth/index.js
similarity index 100%
rename from frontend/scenes/SlackAuth/index.js
rename to app/scenes/SlackAuth/index.js
diff --git a/frontend/scenes/Starred/Starred.js b/app/scenes/Starred/Starred.js
similarity index 100%
rename from frontend/scenes/Starred/Starred.js
rename to app/scenes/Starred/Starred.js
diff --git a/frontend/scenes/Starred/index.js b/app/scenes/Starred/index.js
similarity index 100%
rename from frontend/scenes/Starred/index.js
rename to app/scenes/Starred/index.js
diff --git a/frontend/static/flatpages/api.md b/app/static/flatpages/api.md
similarity index 100%
rename from frontend/static/flatpages/api.md
rename to app/static/flatpages/api.md
diff --git a/frontend/static/flatpages/index.js b/app/static/flatpages/index.js
similarity index 100%
rename from frontend/static/flatpages/index.js
rename to app/static/flatpages/index.js
diff --git a/frontend/stores/AuthStore.js b/app/stores/AuthStore.js
similarity index 100%
rename from frontend/stores/AuthStore.js
rename to app/stores/AuthStore.js
diff --git a/frontend/stores/BaseStore.js b/app/stores/BaseStore.js
similarity index 100%
rename from frontend/stores/BaseStore.js
rename to app/stores/BaseStore.js
diff --git a/frontend/stores/CacheStore.js b/app/stores/CacheStore.js
similarity index 100%
rename from frontend/stores/CacheStore.js
rename to app/stores/CacheStore.js
diff --git a/frontend/stores/CollectionsStore.js b/app/stores/CollectionsStore.js
similarity index 100%
rename from frontend/stores/CollectionsStore.js
rename to app/stores/CollectionsStore.js
diff --git a/frontend/stores/CollectionsStore.test.js b/app/stores/CollectionsStore.test.js
similarity index 100%
rename from frontend/stores/CollectionsStore.test.js
rename to app/stores/CollectionsStore.test.js
diff --git a/frontend/stores/DocumentsStore.js b/app/stores/DocumentsStore.js
similarity index 100%
rename from frontend/stores/DocumentsStore.js
rename to app/stores/DocumentsStore.js
diff --git a/frontend/stores/ErrorsStore.js b/app/stores/ErrorsStore.js
similarity index 100%
rename from frontend/stores/ErrorsStore.js
rename to app/stores/ErrorsStore.js
diff --git a/frontend/stores/ErrorsStore.test.js b/app/stores/ErrorsStore.test.js
similarity index 100%
rename from frontend/stores/ErrorsStore.test.js
rename to app/stores/ErrorsStore.test.js
diff --git a/frontend/stores/UiStore.js b/app/stores/UiStore.js
similarity index 100%
rename from frontend/stores/UiStore.js
rename to app/stores/UiStore.js
diff --git a/frontend/stores/index.js b/app/stores/index.js
similarity index 100%
rename from frontend/stores/index.js
rename to app/stores/index.js
diff --git a/frontend/styles/animations.js b/app/styles/animations.js
similarity index 100%
rename from frontend/styles/animations.js
rename to app/styles/animations.js
diff --git a/frontend/styles/base.css b/app/styles/base.css
similarity index 100%
rename from frontend/styles/base.css
rename to app/styles/base.css
diff --git a/frontend/styles/constants.js b/app/styles/constants.js
similarity index 100%
rename from frontend/styles/constants.js
rename to app/styles/constants.js
diff --git a/frontend/styles/fonts.css b/app/styles/fonts.css
similarity index 100%
rename from frontend/styles/fonts.css
rename to app/styles/fonts.css
diff --git a/frontend/styles/prism.css b/app/styles/prism.css
similarity index 100%
rename from frontend/styles/prism.css
rename to app/styles/prism.css
diff --git a/frontend/styles/transitions.css b/app/styles/transitions.css
similarity index 100%
rename from frontend/styles/transitions.css
rename to app/styles/transitions.css
diff --git a/frontend/types/index.js b/app/types/index.js
similarity index 100%
rename from frontend/types/index.js
rename to app/types/index.js
diff --git a/frontend/utils/ApiClient.js b/app/utils/ApiClient.js
similarity index 100%
rename from frontend/utils/ApiClient.js
rename to app/utils/ApiClient.js
diff --git a/frontend/utils/__mocks__/ApiClient.js b/app/utils/__mocks__/ApiClient.js
similarity index 100%
rename from frontend/utils/__mocks__/ApiClient.js
rename to app/utils/__mocks__/ApiClient.js
diff --git a/frontend/utils/getDataTransferFiles.js b/app/utils/getDataTransferFiles.js
similarity index 100%
rename from frontend/utils/getDataTransferFiles.js
rename to app/utils/getDataTransferFiles.js
diff --git a/frontend/utils/random.js b/app/utils/random.js
similarity index 100%
rename from frontend/utils/random.js
rename to app/utils/random.js
diff --git a/frontend/utils/routeHelpers.js b/app/utils/routeHelpers.js
similarity index 100%
rename from frontend/utils/routeHelpers.js
rename to app/utils/routeHelpers.js
diff --git a/frontend/utils/uploadFile.js b/app/utils/uploadFile.js
similarity index 100%
rename from frontend/utils/uploadFile.js
rename to app/utils/uploadFile.js
diff --git a/package.json b/package.json
index 0206a7219..d30e3667c 100644
--- a/package.json
+++ b/package.json
@@ -10,14 +10,14 @@
     "start": "node index.js",
     "dev": "NODE_ENV=development DEBUG=sql,cache,presenters ./node_modules/.bin/nodemon --inspect --watch server index.js",
     "lint": "npm run lint:flow && npm run lint:js",
-    "lint:js": "eslint frontend",
+    "lint:js": "eslint app",
     "lint:flow": "flow",
     "deploy": "git push heroku master",
     "heroku-postbuild": "npm run build && npm run sequelize:migrate",
     "sequelize:create-migration": "sequelize migration:create",
     "sequelize:migrate": "sequelize db:migrate",
-    "test": "npm run test:frontend && npm run test:server",
-    "test:frontend": "jest",
+    "test": "npm run test:app && npm run test:server",
+    "test:app": "jest",
     "test:server": "jest --config=server/.jestconfig.json --runInBand --forceExit",
     "precommit": "lint-staged"
   },
@@ -30,7 +30,7 @@
   "jest": {
     "verbose": false,
     "roots": [
-      "frontend"
+      "app"
     ],
     "moduleNameMapper": {
       "^.*[.](s?css|css)$": "<rootDir>/__mocks__/styleMock.js",
@@ -45,7 +45,7 @@
       "node_modules"
     ],
     "modulePaths": [
-      "frontend"
+      "app"
     ],
     "setupFiles": [
       "<rootDir>/setupJest.js",
diff --git a/webpack.config.dev.js b/webpack.config.dev.js
index a09773b95..640cd2e47 100644
--- a/webpack.config.dev.js
+++ b/webpack.config.dev.js
@@ -12,7 +12,7 @@ const developmentWebpackConfig = Object.assign(commonWebpackConfig, {
     'babel-polyfill',
     'babel-regenerator-runtime',
     'webpack-hot-middleware/client',
-    './frontend/index',
+    './app/index',
   ],
 });
 
diff --git a/webpack.config.js b/webpack.config.js
index 5e33b37a8..563498296 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -29,7 +29,7 @@ module.exports = {
         test: /\.js$/,
         loader: 'babel',
         include: [
-          path.join(__dirname, 'frontend'),
+          path.join(__dirname, 'app'),
           path.join(__dirname, 'shared'),
         ],
       },
@@ -50,7 +50,7 @@ module.exports = {
     noParse: [new RegExp('node_modules/localforage/dist/localforage.js')],
   },
   resolve: {
-    root: path.join(__dirname, 'frontend'),
+    root: path.join(__dirname, 'app'),
     // you can now require('file') instead of require('file.json')
     extensions: ['', '.js', '.json'],
   },
diff --git a/webpack.config.prod.js b/webpack.config.prod.js
index f3e0b0dfa..a17b872e3 100644
--- a/webpack.config.prod.js
+++ b/webpack.config.prod.js
@@ -9,7 +9,7 @@ commonWebpackConfig = require('./webpack.config');
 productionWebpackConfig = Object.assign(commonWebpackConfig, {
   cache: true,
   devtool: 'source-map',
-  entry: ['babel-polyfill', 'babel-regenerator-runtime', './frontend/index'],
+  entry: ['babel-polyfill', 'babel-regenerator-runtime', './app/index'],
   output: {
     path: path.join(__dirname, 'dist'),
     filename: 'bundle.[hash].js',

From fc45d6a180c469ec9f483646808e69cd0047a727 Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Thu, 26 Oct 2017 22:42:08 -0700
Subject: [PATCH 07/10] Sharing global styles

---
 .flowconfig                                   |   2 +
 app/components/Alert/Alert.js                 |   2 +-
 app/components/Button/Button.js               |   2 +-
 app/components/Collaborators/Collaborators.js |   2 +-
 .../DocumentPreview/DocumentPreview.js        |   2 +-
 .../components/PublishingInfo.js              |   2 +-
 app/components/DropdownMenu/DropdownMenu.js   |   4 +-
 .../DropdownMenu/DropdownMenuItem.js          |   2 +-
 .../Editor/components/BlockInsert.js          |   2 +-
 app/components/Editor/components/Code.js      |   2 +-
 app/components/Editor/components/Contents.js  |   2 +-
 .../Editor/components/CopyButton.js           |   2 +-
 .../Editor/components/HorizontalRule.js       |   2 +-
 app/components/Editor/components/Image.js     |   2 +-
 .../Editor/components/InlineCode.js           |   2 +-
 app/components/Editor/components/TodoItem.js  |   2 +-
 .../Toolbar/components/DocumentResult.js      |   2 +-
 app/components/Empty/Empty.js                 |   2 +-
 app/components/HelpText/HelpText.js           |   2 +-
 app/components/Icon/Icon.js                   |   2 +-
 app/components/Input/Input.js                 |   2 +-
 app/components/Key/key.js                     |   2 +-
 app/components/Labeled/Labeled.js             |   2 +-
 app/components/Layout/Layout.js               |   2 +-
 .../Layout/components/HeaderBlock.js          |   3 +-
 .../Layout/components/SidebarCollections.js   |   2 +-
 .../Layout/components/SidebarLink.js          |   2 +-
 .../LoadingListPlaceholder.js                 |   4 +-
 .../LoadingPlaceholder/components/Mask.js     |   4 +-
 app/components/Modal/Modal.js                 |   4 +-
 app/components/Toasts/Toasts.js               |   2 +-
 app/components/Toasts/components/Toast.js     |   4 +-
 app/index.js                                  |   6 +-
 app/scenes/Document/Document.js               |   2 +-
 .../components/DocumentMove/DocumentMove.js   |   2 +-
 .../DocumentMove/components/PathToDocument.js |   2 +-
 .../LoadingPlaceholder/LoadingPlaceholder.js  |   4 +-
 .../{SearchField => }/SearchField.js          |   2 +-
 .../Search/components/SearchField/index.js    |   3 -
 app/scenes/Settings/Settings.js               |   2 +-
 .../components/{ApiKeyRow => }/ApiKeyRow.js   |   2 +-
 .../Settings/components/ApiKeyRow/index.js    |   3 -
 app/styles/base.css                           | 143 ------------------
 app/styles/fonts.css                          |  62 --------
 package.json                                  |   1 +
 server/pages/components/Layout.js             |   3 +
 server/pages/components/Navigation.js         |  15 +-
 {app => shared}/styles/animations.js          |   0
 shared/styles/base.js                         |  83 ++++++++++
 {app => shared}/styles/constants.js           |   4 +-
 shared/styles/globals.js                      |   9 ++
 webpack.config.js                             |   4 +-
 yarn.lock                                     |   4 +
 53 files changed, 165 insertions(+), 266 deletions(-)
 rename app/scenes/Search/components/{SearchField => }/SearchField.js (96%)
 delete mode 100644 app/scenes/Search/components/SearchField/index.js
 rename app/scenes/Settings/components/{ApiKeyRow => }/ApiKeyRow.js (95%)
 delete mode 100644 app/scenes/Settings/components/ApiKeyRow/index.js
 delete mode 100644 app/styles/base.css
 delete mode 100644 app/styles/fonts.css
 rename {app => shared}/styles/animations.js (100%)
 create mode 100644 shared/styles/base.js
 rename {app => shared}/styles/constants.js (97%)
 create mode 100644 shared/styles/globals.js

diff --git a/.flowconfig b/.flowconfig
index 66fe67dae..7c57deb48 100644
--- a/.flowconfig
+++ b/.flowconfig
@@ -21,6 +21,8 @@ module.system.node.resolve_dirname=app
 
 module.name_mapper='^\(.*\)\.s?css$' -> 'empty/object'
 module.name_mapper='^\(.*\)\.md$' -> 'empty/object'
+module.name_mapper='^shared\/\(.*\)$' -> '<PROJECT_ROOT>/shared/\1'
+
 module.file_ext=.js
 module.file_ext=.scss
 module.file_ext=.md
diff --git a/app/components/Alert/Alert.js b/app/components/Alert/Alert.js
index fbceee6a3..4fc1c8db8 100644
--- a/app/components/Alert/Alert.js
+++ b/app/components/Alert/Alert.js
@@ -3,7 +3,7 @@ import React from 'react';
 import { observer } from 'mobx-react';
 import Flex from 'components/Flex';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 type Props = {
   children: React.Element<*>,
diff --git a/app/components/Button/Button.js b/app/components/Button/Button.js
index 20ecb553c..411031e44 100644
--- a/app/components/Button/Button.js
+++ b/app/components/Button/Button.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import { darken, lighten } from 'polished';
 
 const RealButton = styled.button`
diff --git a/app/components/Collaborators/Collaborators.js b/app/components/Collaborators/Collaborators.js
index 8bb7c7882..746c9ad66 100644
--- a/app/components/Collaborators/Collaborators.js
+++ b/app/components/Collaborators/Collaborators.js
@@ -2,7 +2,7 @@
 import React from 'react';
 import moment from 'moment';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import Flex from 'components/Flex';
 import Tooltip from 'components/Tooltip';
 import Document from 'models/Document';
diff --git a/app/components/DocumentPreview/DocumentPreview.js b/app/components/DocumentPreview/DocumentPreview.js
index d9da9bd8e..40d29961f 100644
--- a/app/components/DocumentPreview/DocumentPreview.js
+++ b/app/components/DocumentPreview/DocumentPreview.js
@@ -4,7 +4,7 @@ import { observer } from 'mobx-react';
 import { Link } from 'react-router-dom';
 import Document from 'models/Document';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import StarredIcon from 'components/Icon/StarredIcon';
 import PublishingInfo from './components/PublishingInfo';
 
diff --git a/app/components/DocumentPreview/components/PublishingInfo.js b/app/components/DocumentPreview/components/PublishingInfo.js
index 878bfddac..bb666240f 100644
--- a/app/components/DocumentPreview/components/PublishingInfo.js
+++ b/app/components/DocumentPreview/components/PublishingInfo.js
@@ -2,7 +2,7 @@
 import React, { Component } from 'react';
 import moment from 'moment';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import Collection from 'models/Collection';
 import Document from 'models/Document';
 import Flex from 'components/Flex';
diff --git a/app/components/DropdownMenu/DropdownMenu.js b/app/components/DropdownMenu/DropdownMenu.js
index 2ce37c8c4..e2f2ea74c 100644
--- a/app/components/DropdownMenu/DropdownMenu.js
+++ b/app/components/DropdownMenu/DropdownMenu.js
@@ -6,8 +6,8 @@ import { observer } from 'mobx-react';
 import styled from 'styled-components';
 import Portal from 'react-portal';
 import Flex from 'components/Flex';
-import { color } from 'styles/constants';
-import { fadeAndScaleIn } from 'styles/animations';
+import { color } from 'shared/styles/constants';
+import { fadeAndScaleIn } from 'shared/styles/animations';
 
 type Props = {
   label: React.Element<*>,
diff --git a/app/components/DropdownMenu/DropdownMenuItem.js b/app/components/DropdownMenu/DropdownMenuItem.js
index 7e6738f45..bdbe4f2eb 100644
--- a/app/components/DropdownMenu/DropdownMenuItem.js
+++ b/app/components/DropdownMenu/DropdownMenuItem.js
@@ -2,7 +2,7 @@
 import React from 'react';
 import styled from 'styled-components';
 import Flex from 'components/Flex';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 const DropdownMenuItem = ({
   onClick,
diff --git a/app/components/Editor/components/BlockInsert.js b/app/components/Editor/components/BlockInsert.js
index 441d8880a..8988881a8 100644
--- a/app/components/Editor/components/BlockInsert.js
+++ b/app/components/Editor/components/BlockInsert.js
@@ -6,7 +6,7 @@ import Portal from 'react-portal';
 import { observable } from 'mobx';
 import { observer } from 'mobx-react';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import PlusIcon from 'components/Icon/PlusIcon';
 import BlockMenu from 'menus/BlockMenu';
 import type { State } from '../types';
diff --git a/app/components/Editor/components/Code.js b/app/components/Editor/components/Code.js
index f370392d0..883d57535 100644
--- a/app/components/Editor/components/Code.js
+++ b/app/components/Editor/components/Code.js
@@ -2,7 +2,7 @@
 import React from 'react';
 import styled from 'styled-components';
 import CopyButton from './CopyButton';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import type { Props } from '../types';
 
 export default function Code({ children, node, readOnly, attributes }: Props) {
diff --git a/app/components/Editor/components/Contents.js b/app/components/Editor/components/Contents.js
index 7a1f19a44..625aad93a 100644
--- a/app/components/Editor/components/Contents.js
+++ b/app/components/Editor/components/Contents.js
@@ -3,7 +3,7 @@ import React, { Component } from 'react';
 import { observable } from 'mobx';
 import { observer } from 'mobx-react';
 import { List } from 'immutable';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import headingToSlug from '../headingToSlug';
 import type { State, Block } from '../types';
 import styled from 'styled-components';
diff --git a/app/components/Editor/components/CopyButton.js b/app/components/Editor/components/CopyButton.js
index 696e6c610..7e1bb6b5b 100644
--- a/app/components/Editor/components/CopyButton.js
+++ b/app/components/Editor/components/CopyButton.js
@@ -2,7 +2,7 @@
 import React, { Component } from 'react';
 import { observable } from 'mobx';
 import { observer } from 'mobx-react';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import styled from 'styled-components';
 import CopyToClipboard from 'components/CopyToClipboard';
 
diff --git a/app/components/Editor/components/HorizontalRule.js b/app/components/Editor/components/HorizontalRule.js
index 286a5acb1..49cf4ca0f 100644
--- a/app/components/Editor/components/HorizontalRule.js
+++ b/app/components/Editor/components/HorizontalRule.js
@@ -2,7 +2,7 @@
 import React from 'react';
 import styled from 'styled-components';
 import type { Props } from '../types';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 function HorizontalRule(props: Props) {
   const { state, node } = props;
diff --git a/app/components/Editor/components/Image.js b/app/components/Editor/components/Image.js
index af1c5de44..ad1857b49 100644
--- a/app/components/Editor/components/Image.js
+++ b/app/components/Editor/components/Image.js
@@ -2,7 +2,7 @@
 import React, { Component } from 'react';
 import styled from 'styled-components';
 import type { Props } from '../types';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 class Image extends Component {
   props: Props;
diff --git a/app/components/Editor/components/InlineCode.js b/app/components/Editor/components/InlineCode.js
index ad498a7b0..c59965c30 100644
--- a/app/components/Editor/components/InlineCode.js
+++ b/app/components/Editor/components/InlineCode.js
@@ -1,6 +1,6 @@
 // @flow
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 const InlineCode = styled.code`
   padding: .25em;
diff --git a/app/components/Editor/components/TodoItem.js b/app/components/Editor/components/TodoItem.js
index 2418ead44..7b18c7b88 100644
--- a/app/components/Editor/components/TodoItem.js
+++ b/app/components/Editor/components/TodoItem.js
@@ -1,7 +1,7 @@
 // @flow
 import React, { Component } from 'react';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import type { Props } from '../types';
 
 export default class TodoItem extends Component {
diff --git a/app/components/Editor/components/Toolbar/components/DocumentResult.js b/app/components/Editor/components/Toolbar/components/DocumentResult.js
index 7d4b157b0..9b15b72b3 100644
--- a/app/components/Editor/components/Toolbar/components/DocumentResult.js
+++ b/app/components/Editor/components/Toolbar/components/DocumentResult.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import styled from 'styled-components';
-import { fontWeight, color } from 'styles/constants';
+import { fontWeight, color } from 'shared/styles/constants';
 import Document from 'models/Document';
 import NextIcon from 'components/Icon/NextIcon';
 
diff --git a/app/components/Empty/Empty.js b/app/components/Empty/Empty.js
index 822d990aa..2f44b7436 100644
--- a/app/components/Empty/Empty.js
+++ b/app/components/Empty/Empty.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 type Props = {
   children: string,
diff --git a/app/components/HelpText/HelpText.js b/app/components/HelpText/HelpText.js
index a4ff8c9b3..4e728ed67 100644
--- a/app/components/HelpText/HelpText.js
+++ b/app/components/HelpText/HelpText.js
@@ -1,6 +1,6 @@
 // @flow
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 const HelpText = styled.p`
   margin-top: 0;
diff --git a/app/components/Icon/Icon.js b/app/components/Icon/Icon.js
index 46bf1acbc..609792738 100644
--- a/app/components/Icon/Icon.js
+++ b/app/components/Icon/Icon.js
@@ -1,6 +1,6 @@
 // @flow
 import React from 'react';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 export type Props = {
   className?: string,
diff --git a/app/components/Input/Input.js b/app/components/Input/Input.js
index 6b25d24f7..7a1f81786 100644
--- a/app/components/Input/Input.js
+++ b/app/components/Input/Input.js
@@ -2,7 +2,7 @@
 import React from 'react';
 import styled from 'styled-components';
 import Flex from 'components/Flex';
-import { size, color } from 'styles/constants';
+import { size, color } from 'shared/styles/constants';
 
 const RealTextarea = styled.textarea`
   border: 0;
diff --git a/app/components/Key/key.js b/app/components/Key/key.js
index 8f4954d8c..0e2f7a19a 100644
--- a/app/components/Key/key.js
+++ b/app/components/Key/key.js
@@ -1,6 +1,6 @@
 // @flow
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 const Key = styled.kbd`
   display: inline-block;
diff --git a/app/components/Labeled/Labeled.js b/app/components/Labeled/Labeled.js
index bfff39c91..985617cb2 100644
--- a/app/components/Labeled/Labeled.js
+++ b/app/components/Labeled/Labeled.js
@@ -3,7 +3,7 @@ import React from 'react';
 import { observer } from 'mobx-react';
 import Flex from 'components/Flex';
 import styled from 'styled-components';
-import { size } from 'styles/constants';
+import { size } from 'shared/styles/constants';
 
 type Props = {
   label: React.Element<*> | string,
diff --git a/app/components/Layout/Layout.js b/app/components/Layout/Layout.js
index a49b21b18..8dd96e933 100644
--- a/app/components/Layout/Layout.js
+++ b/app/components/Layout/Layout.js
@@ -6,7 +6,7 @@ import styled from 'styled-components';
 import { observer, inject } from 'mobx-react';
 import keydown from 'react-keydown';
 import Flex from 'components/Flex';
-import { color, layout } from 'styles/constants';
+import { color, layout } from 'shared/styles/constants';
 import { documentEditUrl, homeUrl, searchUrl } from 'utils/routeHelpers';
 
 import Avatar from 'components/Avatar';
diff --git a/app/components/Layout/components/HeaderBlock.js b/app/components/Layout/components/HeaderBlock.js
index 553114946..1cfb73111 100644
--- a/app/components/Layout/components/HeaderBlock.js
+++ b/app/components/Layout/components/HeaderBlock.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import type { User, Team } from 'types';
 import Flex from 'components/Flex';
 
@@ -28,7 +28,6 @@ const UserName = styled.div`
 `;
 
 const TeamName = styled.div`
-  font-family: 'Atlas Grotesk';
   font-weight: bold;
   color: ${color.text};
   text-decoration: none;
diff --git a/app/components/Layout/components/SidebarCollections.js b/app/components/Layout/components/SidebarCollections.js
index 7cb3e992a..2516fdad2 100644
--- a/app/components/Layout/components/SidebarCollections.js
+++ b/app/components/Layout/components/SidebarCollections.js
@@ -4,7 +4,7 @@ import { observable } from 'mobx';
 import { observer, inject } from 'mobx-react';
 import Flex from 'components/Flex';
 import styled from 'styled-components';
-import { color, fontWeight } from 'styles/constants';
+import { color, fontWeight } from 'shared/styles/constants';
 
 import SidebarLink from './SidebarLink';
 import DropToImport from 'components/DropToImport';
diff --git a/app/components/Layout/components/SidebarLink.js b/app/components/Layout/components/SidebarLink.js
index 5a349fd47..b9fa5fffb 100644
--- a/app/components/Layout/components/SidebarLink.js
+++ b/app/components/Layout/components/SidebarLink.js
@@ -3,7 +3,7 @@ import React, { Component } from 'react';
 import { observable, action } from 'mobx';
 import { observer } from 'mobx-react';
 import { NavLink } from 'react-router-dom';
-import { color, fontWeight } from 'styles/constants';
+import { color, fontWeight } from 'shared/styles/constants';
 import styled from 'styled-components';
 import Flex from 'components/Flex';
 import CollapsedIcon from 'components/Icon/CollapsedIcon';
diff --git a/app/components/LoadingListPlaceholder/LoadingListPlaceholder.js b/app/components/LoadingListPlaceholder/LoadingListPlaceholder.js
index 26bf3dbcd..e8c37d4a6 100644
--- a/app/components/LoadingListPlaceholder/LoadingListPlaceholder.js
+++ b/app/components/LoadingListPlaceholder/LoadingListPlaceholder.js
@@ -2,8 +2,8 @@
 import React from 'react';
 import ReactCSSTransitionGroup from 'react-addons-css-transition-group';
 import styled from 'styled-components';
-import { pulsate } from 'styles/animations';
-import { color } from 'styles/constants';
+import { pulsate } from 'shared/styles/animations';
+import { color } from 'shared/styles/constants';
 import Flex from 'components/Flex';
 
 import { randomInteger } from 'utils/random';
diff --git a/app/components/LoadingPlaceholder/components/Mask.js b/app/components/LoadingPlaceholder/components/Mask.js
index a49810e14..82d271b08 100644
--- a/app/components/LoadingPlaceholder/components/Mask.js
+++ b/app/components/LoadingPlaceholder/components/Mask.js
@@ -1,8 +1,8 @@
 // @flow
 import React, { Component } from 'react';
 import styled from 'styled-components';
-import { pulsate } from 'styles/animations';
-import { color } from 'styles/constants';
+import { pulsate } from 'shared/styles/animations';
+import { color } from 'shared/styles/constants';
 import { randomInteger } from 'utils/random';
 import Flex from 'components/Flex';
 
diff --git a/app/components/Modal/Modal.js b/app/components/Modal/Modal.js
index de4f8841b..ff97a141a 100644
--- a/app/components/Modal/Modal.js
+++ b/app/components/Modal/Modal.js
@@ -3,8 +3,8 @@ import React from 'react';
 import { observer } from 'mobx-react';
 import styled from 'styled-components';
 import ReactModal from 'react-modal';
-import { color } from 'styles/constants';
-import { fadeAndScaleIn } from 'styles/animations';
+import { color } from 'shared/styles/constants';
+import { fadeAndScaleIn } from 'shared/styles/animations';
 import CloseIcon from 'components/Icon/CloseIcon';
 import Flex from 'components/Flex';
 
diff --git a/app/components/Toasts/Toasts.js b/app/components/Toasts/Toasts.js
index fd1457c6f..565fd6da4 100644
--- a/app/components/Toasts/Toasts.js
+++ b/app/components/Toasts/Toasts.js
@@ -2,7 +2,7 @@
 import React, { Component } from 'react';
 import { inject, observer } from 'mobx-react';
 import styled from 'styled-components';
-import { layout } from 'styles/constants';
+import { layout } from 'shared/styles/constants';
 import Toast from './components/Toast';
 
 @observer class Toasts extends Component {
diff --git a/app/components/Toasts/components/Toast.js b/app/components/Toasts/components/Toast.js
index da25a022b..4fc42580f 100644
--- a/app/components/Toasts/components/Toast.js
+++ b/app/components/Toasts/components/Toast.js
@@ -2,8 +2,8 @@
 import React, { Component } from 'react';
 import styled from 'styled-components';
 import { darken } from 'polished';
-import { color } from 'styles/constants';
-import { fadeAndScaleIn } from 'styles/animations';
+import { color } from 'shared/styles/constants';
+import { fadeAndScaleIn } from 'shared/styles/animations';
 
 type Props = {
   onRequestClose: () => void,
diff --git a/app/index.js b/app/index.js
index 3c5d593ae..1e7833516 100644
--- a/app/index.js
+++ b/app/index.js
@@ -14,10 +14,8 @@ import stores from 'stores';
 import DocumentsStore from 'stores/DocumentsStore';
 import CollectionsStore from 'stores/CollectionsStore';
 import CacheStore from 'stores/CacheStore';
+import globalStyles from 'shared/styles/globals';
 
-import 'normalize.css/normalize.css';
-import 'styles/base.css';
-import 'styles/fonts.css';
 import 'styles/transitions.css';
 import 'styles/prism.css';
 
@@ -103,6 +101,8 @@ const RedirectDocument = ({ match }: { match: Object }) => (
   <Redirect to={`/doc/${match.params.documentSlug}`} />
 );
 
+globalStyles();
+
 render(
   <div style={{ display: 'flex', flex: 1, height: '100%' }}>
     <Provider {...stores}>
diff --git a/app/scenes/Document/Document.js b/app/scenes/Document/Document.js
index ed517e30d..517c2defe 100644
--- a/app/scenes/Document/Document.js
+++ b/app/scenes/Document/Document.js
@@ -7,7 +7,7 @@ import { observer, inject } from 'mobx-react';
 import { withRouter, Prompt } from 'react-router';
 import keydown from 'react-keydown';
 import Flex from 'components/Flex';
-import { color, layout } from 'styles/constants';
+import { color, layout } from 'shared/styles/constants';
 import {
   collectionUrl,
   updateDocumentUrl,
diff --git a/app/scenes/Document/components/DocumentMove/DocumentMove.js b/app/scenes/Document/components/DocumentMove/DocumentMove.js
index 53eeed8ec..55dae6bdd 100644
--- a/app/scenes/Document/components/DocumentMove/DocumentMove.js
+++ b/app/scenes/Document/components/DocumentMove/DocumentMove.js
@@ -8,7 +8,7 @@ import { Search } from 'js-search';
 import ArrowKeyNavigation from 'boundless-arrow-key-navigation';
 import _ from 'lodash';
 import styled from 'styled-components';
-import { size } from 'styles/constants';
+import { size } from 'shared/styles/constants';
 
 import Modal from 'components/Modal';
 import Input from 'components/Input';
diff --git a/app/scenes/Document/components/DocumentMove/components/PathToDocument.js b/app/scenes/Document/components/DocumentMove/components/PathToDocument.js
index 82058efd4..5868596a7 100644
--- a/app/scenes/Document/components/DocumentMove/components/PathToDocument.js
+++ b/app/scenes/Document/components/DocumentMove/components/PathToDocument.js
@@ -4,7 +4,7 @@ import { observer } from 'mobx-react';
 import invariant from 'invariant';
 import _ from 'lodash';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 import Flex from 'components/Flex';
 import GoToIcon from 'components/Icon/GoToIcon';
diff --git a/app/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js b/app/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js
index 1052f403f..21c019a8d 100644
--- a/app/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js
+++ b/app/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js
@@ -2,8 +2,8 @@
 import React from 'react';
 import ReactCSSTransitionGroup from 'react-addons-css-transition-group';
 import styled from 'styled-components';
-import { pulsate } from 'styles/animations';
-import { color } from 'styles/constants';
+import { pulsate } from 'shared/styles/animations';
+import { color } from 'shared/styles/constants';
 import Flex from 'components/Flex';
 
 import { randomInteger } from 'utils/random';
diff --git a/app/scenes/Search/components/SearchField/SearchField.js b/app/scenes/Search/components/SearchField.js
similarity index 96%
rename from app/scenes/Search/components/SearchField/SearchField.js
rename to app/scenes/Search/components/SearchField.js
index 8c0645767..eeffe9a28 100644
--- a/app/scenes/Search/components/SearchField/SearchField.js
+++ b/app/scenes/Search/components/SearchField.js
@@ -2,7 +2,7 @@
 import React, { Component } from 'react';
 import SearchIcon from 'components/Icon/SearchIcon';
 import Flex from 'components/Flex';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 import styled from 'styled-components';
 
 class SearchField extends Component {
diff --git a/app/scenes/Search/components/SearchField/index.js b/app/scenes/Search/components/SearchField/index.js
deleted file mode 100644
index a45be6bf8..000000000
--- a/app/scenes/Search/components/SearchField/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-// @flow
-import SearchField from './SearchField';
-export default SearchField;
diff --git a/app/scenes/Settings/Settings.js b/app/scenes/Settings/Settings.js
index 82b1803c7..a0c792979 100644
--- a/app/scenes/Settings/Settings.js
+++ b/app/scenes/Settings/Settings.js
@@ -5,7 +5,7 @@ import { Link } from 'react-router-dom';
 import styled from 'styled-components';
 import ApiKeyRow from './components/ApiKeyRow';
 import SettingsStore from './SettingsStore';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 import Flex from 'components/Flex';
 import Button from 'components/Button';
diff --git a/app/scenes/Settings/components/ApiKeyRow/ApiKeyRow.js b/app/scenes/Settings/components/ApiKeyRow.js
similarity index 95%
rename from app/scenes/Settings/components/ApiKeyRow/ApiKeyRow.js
rename to app/scenes/Settings/components/ApiKeyRow.js
index 36e7dbc4b..f6f2ae09b 100644
--- a/app/scenes/Settings/components/ApiKeyRow/ApiKeyRow.js
+++ b/app/scenes/Settings/components/ApiKeyRow.js
@@ -3,7 +3,7 @@ import React from 'react';
 import { observable } from 'mobx';
 import { observer } from 'mobx-react';
 import styled from 'styled-components';
-import { color } from 'styles/constants';
+import { color } from 'shared/styles/constants';
 
 type Props = {
   id: string,
diff --git a/app/scenes/Settings/components/ApiKeyRow/index.js b/app/scenes/Settings/components/ApiKeyRow/index.js
deleted file mode 100644
index 1c94f8f0c..000000000
--- a/app/scenes/Settings/components/ApiKeyRow/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-// @flow
-import ApiKeyRow from './ApiKeyRow';
-export default ApiKeyRow;
diff --git a/app/styles/base.css b/app/styles/base.css
deleted file mode 100644
index ec8a87f07..000000000
--- a/app/styles/base.css
+++ /dev/null
@@ -1,143 +0,0 @@
-* {
-  box-sizing: border-box;
-}
-
-:root {
-  --line-height-1: 1;
-  --line-height-2: 1.125;
-  --line-height-3: 1.25;
-  --line-height-4: 1.5;
-  --letter-spacing: 1;
-  --caps-letter-spacing: 0.2em;
-  --bold-font-weight: bold;
-}
-
-html,
-body,
-.viewport {
-  width: 100%;
-  min-height: 100vh;
-  margin: 0;
-}
-
-body,
-button,
-input,
-optgroup,
-select,
-textarea {
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
-    Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
-}
-
-body {
-  font-size: 16px;
-  line-height: 1.5;
-  margin: 0;
-  color: #617180;
-  background-color: #fff;
-  display: flex;
-
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  text-rendering: optimizeLegibility;
-}
-img {
-  max-width: 100%;
-  height: auto;
-}
-svg {
-  max-height: 100%;
-}
-a {
-  color: #16B3FF;
-  text-decoration: none;
-  cursor: pointer;
-}
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-weight: 500;
-  line-height: 1.25;
-  margin-top: 1em;
-  margin-bottom: 0.5em;
-  color: #1f2429;
-}
-h1 {
-  font-size: 2em;
-}
-h2 {
-  font-size: 1.5em;
-}
-h3 {
-  font-size: 1.25em;
-}
-h4 {
-  font-size: 1em;
-}
-h5 {
-  font-size: 0.875em;
-}
-h6 {
-  font-size: 0.75em;
-}
-p,
-dl,
-ol,
-ul,
-pre,
-blockquote {
-  margin-top: 1em;
-  margin-bottom: 1em;
-}
-code,
-pre,
-samp {
-  font-family: 'Atlas Typewriter', 'Source Code Pro', Menlo, Consolas,
-    'Liberation Mono', monospace;
-}
-code,
-samp {
-  font-size: 85%;
-  padding: 0.125em;
-}
-pre {
-  font-size: 85%;
-  overflow: scroll;
-}
-blockquote {
-  font-size: 1.25em;
-  font-style: italic;
-  margin-left: 0;
-}
-hr {
-  margin: 2em 0;
-  border: 0;
-  border-bottom-width: 1px;
-  border-bottom-style: solid;
-  border-bottom-color: #dedede;
-}
-*[role='button'] {
-  cursor: pointer;
-}
-
-.hljs {
-  border: 1px solid rgba(0, 0, 0, 0.0625);
-  padding: 1em;
-  border-radius: 0.25em;
-}
-
-.activeDropZone {
-  background: #4E5C6E;
-}
-
-.activeDropZone a {
-  color: #FFF !important;
-}
-
-.ReactModal__Body--open {
-  overflow: hidden;
-}
diff --git a/app/styles/fonts.css b/app/styles/fonts.css
deleted file mode 100644
index c5cff8a83..000000000
--- a/app/styles/fonts.css
+++ /dev/null
@@ -1,62 +0,0 @@
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-Regular-Web.woff') format('woff');
-  font-weight: normal;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-Medium-Web.woff') format('woff');
-  font-weight: bold;
-  font-style: normal;
-}
-
-/*@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-Light-Web.woff') format('woff');
-  font-weight: lighter;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-LightItalic-Web.woff') format('woff');
-  font-weight: lighter;
-  font-style: italic;
-}*/
-
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-RegularItalic-Web.woff') format('woff');
-  font-weight: normal;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-MediumItalic-Web.woff') format('woff');
-  font-weight: bold;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Atlas Grotesk';
-  src: url('../fonts/atlas/AtlasGrotesk-MediumItalic-Web.woff') format('woff');
-  font-weight: bold;
-  font-style: italic;
-}
-
-@font-face {
-  font-family: 'Atlas Typewriter';
-  src: url('../fonts/atlas/AtlasTypewriterRegular.woff') format('woff');
-  font-weight: normal;
-  font-style: normal;
-}
-
-@font-face {
-  font-family: 'Atlas Typewriter';
-  src: url('../fonts/atlas/AtlasTypewriterMedium.woff') format('woff');
-  font-weight: bold;
-  font-style: normal;
-}
diff --git a/package.json b/package.json
index d30e3667c..bab052ba1 100644
--- a/package.json
+++ b/package.json
@@ -167,6 +167,7 @@
     "style-loader": "^0.18.2",
     "styled-components": "^2.0.0",
     "styled-components-grid": "^1.0.0-preview.15",
+    "styled-normalize": "^2.2.1",
     "url-loader": "0.5.7",
     "uuid": "2.0.2",
     "validator": "5.2.0",
diff --git a/server/pages/components/Layout.js b/server/pages/components/Layout.js
index 177381526..3f873c086 100644
--- a/server/pages/components/Layout.js
+++ b/server/pages/components/Layout.js
@@ -2,12 +2,15 @@
 import React from 'react';
 import { Helmet } from 'react-helmet';
 import Navigation from './Navigation';
+import globalStyles from '../../../shared/styles/globals';
 
 type Props = {
   children?: React$Element<*>,
 };
 
 export default function Layout({ children }: Props) {
+  globalStyles();
+
   return (
     <html lang="en">
       <head>
diff --git a/server/pages/components/Navigation.js b/server/pages/components/Navigation.js
index 7aefe5fc7..fc2ce5533 100644
--- a/server/pages/components/Navigation.js
+++ b/server/pages/components/Navigation.js
@@ -1,10 +1,12 @@
 // @flow
 import React from 'react';
+import styled from 'styled-components';
+import { color } from '../../../shared/styles/constants';
 
-export default function Navigation() {
+function Navigation() {
   return (
     <nav>
-      <a href="/">Atlas</a>
+      <Brand href="/">Atlas</Brand>
       <ul>
         <li><a href="/about">About</a></li>
         <li><a href="/pricing">Pricing</a></li>
@@ -12,3 +14,12 @@ export default function Navigation() {
     </nav>
   );
 }
+
+const Brand = styled.a`
+  font-weight: 600;
+  font-size: 20px;
+  text-decoration: none;
+  color: ${color.black};
+`;
+
+export default Navigation;
diff --git a/app/styles/animations.js b/shared/styles/animations.js
similarity index 100%
rename from app/styles/animations.js
rename to shared/styles/animations.js
diff --git a/shared/styles/base.js b/shared/styles/base.js
new file mode 100644
index 000000000..8335ad9df
--- /dev/null
+++ b/shared/styles/base.js
@@ -0,0 +1,83 @@
+// @flow
+import { color } from './constants';
+
+export default `
+  * {
+    box-sizing: border-box;
+  }
+
+  html,
+  body {
+    width: 100%;
+    min-height: 100vh;
+    margin: 0;
+    padding: 0;
+  }
+
+  body,
+  button,
+  input,
+  optgroup,
+  select,
+  textarea {
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
+      Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  }
+
+  body {
+    font-size: 16px;
+    line-height: 1.5;
+    color: ${color.text};
+
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    text-rendering: optimizeLegibility;
+  }
+
+  a {
+    color: ${color.blue};
+    text-decoration: none;
+    cursor: pointer;
+  }
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    font-weight: 500;
+    line-height: 1.25;
+    margin-top: 1em;
+    margin-bottom: 0.5em;
+    color: ${color.text};
+  }
+  h1 { font-size: 2em; }
+  h2 { font-size: 1.5em; }
+  h3 { font-size: 1.25em; }
+  h4 { font-size: 1em; }
+  h5 { font-size: 0.875em; }
+  h6 { font-size: 0.75em; }
+
+  p,
+  dl,
+  ol,
+  ul,
+  pre,
+  blockquote {
+    margin-top: 1em;
+    margin-bottom: 1em;
+  }
+
+  .activeDropZone {
+    background: #4E5C6E;
+  }
+
+  .activeDropZone a {
+    color: #FFF !important;
+  }
+
+  .ReactModal__Body--open {
+    overflow: hidden;
+  }
+`;
diff --git a/app/styles/constants.js b/shared/styles/constants.js
similarity index 97%
rename from app/styles/constants.js
rename to shared/styles/constants.js
index 24b53ab62..9bd4f6f43 100644
--- a/app/styles/constants.js
+++ b/shared/styles/constants.js
@@ -1,5 +1,4 @@
 // @flow
-
 export const layout = {
   padding: '1.5vw 1.875vw',
   vpadding: '1.5vw',
@@ -60,6 +59,5 @@ export const color = {
   /* Misc */
   white: '#FFFFFF',
   black: '#000000',
-
-  /* Alert colors */
+  blue: '#16B3FF',
 };
diff --git a/shared/styles/globals.js b/shared/styles/globals.js
new file mode 100644
index 000000000..6bdb1a67a
--- /dev/null
+++ b/shared/styles/globals.js
@@ -0,0 +1,9 @@
+// @flow
+import styledNormalize from 'styled-normalize';
+import { injectGlobal } from 'styled-components';
+import base from './base';
+
+export default () => injectGlobal`
+  ${styledNormalize}
+  ${base}
+`;
diff --git a/webpack.config.js b/webpack.config.js
index 563498296..53e855a8e 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -50,9 +50,9 @@ module.exports = {
     noParse: [new RegExp('node_modules/localforage/dist/localforage.js')],
   },
   resolve: {
-    root: path.join(__dirname, 'app'),
-    // you can now require('file') instead of require('file.json')
+    root: path.resolve(__dirname, 'app'),
     extensions: ['', '.js', '.json'],
+    alias: { shared: path.resolve(__dirname, 'shared') }
   },
   plugins: [
     definePlugin,
diff --git a/yarn.lock b/yarn.lock
index 16383256b..f5accbea0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8435,6 +8435,10 @@ styled-components@^2.0.0:
     stylis "^3.2.1"
     supports-color "^3.2.3"
 
+styled-normalize@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.npmjs.org/styled-normalize/-/styled-normalize-2.2.1.tgz#c93a007c0339a69e3254eeef8cb6a5a96e5ca4eb"
+
 stylis@^3.2.1:
   version "3.2.15"
   resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.2.15.tgz#1800f829fdf3cf0d647ae6cdb5fb70a1fd81c3e2"

From e370676b499a2f2c63ed53114c82635c85d25e9e Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Thu, 26 Oct 2017 23:02:45 -0700
Subject: [PATCH 08/10] Homepage skeleton

---
 server/pages/Home.js                   | 60 +++++++++++++++++---------
 server/pages/components/Hero.js        |  4 ++
 server/pages/components/Navigation.js  | 32 +++++++++++---
 server/pages/components/SlackSignin.js | 19 ++++++++
 4 files changed, 89 insertions(+), 26 deletions(-)
 create mode 100644 server/pages/components/SlackSignin.js

diff --git a/server/pages/Home.js b/server/pages/Home.js
index 149e4139e..f29548c24 100644
--- a/server/pages/Home.js
+++ b/server/pages/Home.js
@@ -3,65 +3,85 @@ import React from 'react';
 import styled from 'styled-components';
 import Grid from 'styled-components-grid';
 import Hero from './components/Hero';
+import SlackSignin from './components/SlackSignin';
+import { color } from '../../shared/styles/constants';
 
 const Unit = Grid.Unit;
 
-const Feature = styled(Unit)`
-  padding: 3em;
-`;
-
-export default function Home() {
+function Home() {
   return (
     <Grid>
       <Hero>
         <h1>Your team’s knowledge base</h1>
-        <p>
+        <HeroText>
           Documentation, meeting notes, playbooks, onboarding, work logs, brainstorming, decisions, & more…
+        </HeroText>
+        <p>
+          <SlackSignin />
         </p>
-        <a href="/auth/slack">Sign In</a>
       </Hero>
       <Unit size={{ desktop: 1 / 2 }} />
-      <Unit size={{ desktop: 1 / 2 }}>
+      <Feature size={{ desktop: 1 / 2 }}>
         <h2>Blazing Fast</h2>
         <p>
           Atlas is fast, really fast. We’ve trimmed 100ms and 50ms there to make sure that documents load instantly, search is speedy and there are keyboard shortcuts for everything.
         </p>
-      </Unit>
+      </Feature>
 
-      <Unit size={{ desktop: 1 / 2 }}>
+      <Feature size={{ desktop: 1 / 2 }}>
         <h2>Markdown Support</h2>
         <p>
           Documents are stored in Markdown and you can export them at any time. Markdown shortcuts are also built right into the editor so you can easily format using markdown syntax or our GUI.
         </p>
-      </Unit>
+      </Feature>
       <Unit size={{ desktop: 1 / 2 }} />
 
       <Unit size={{ desktop: 1 / 2 }} />
-      <Unit size={{ desktop: 1 / 2 }}>
+      <Feature size={{ desktop: 1 / 2 }}>
         <h2>Beautiful Editor</h2>
         <p>
-          Documents are stored in Markdown and you can export them at any time. Markdown shortcuts are also built right into the editor so you can easily format using markdown syntax or our GUI.
+          We built a custom editor that’s a joy to use. Whether you’re typing up quick meeting notes or documenting a full API the interface gets out of your way and lets you focus on the content.
         </p>
-      </Unit>
+      </Feature>
 
-      <Feature size={{ desktop: 1 / 3 }}>
+      <MiniFeature size={{ desktop: 1 / 3 }}>
         <h2>Powerful Search</h2>
         <p>
           Built-in search makes that one document easy to find in a large knowledgebase.
         </p>
-      </Feature>
-      <Feature size={{ desktop: 1 / 3 }}>
+      </MiniFeature>
+      <MiniFeature size={{ desktop: 1 / 3 }}>
         <h2>API & Integrations</h2>
         <p>
           Atlas is built on it’s own API, treat Atlas as a CMS or automatically create documents from outside events.
         </p>
-      </Feature>
-      <Feature size={{ desktop: 1 / 3 }}>
+      </MiniFeature>
+      <MiniFeature size={{ desktop: 1 / 3 }}>
         <h2>Open Source</h2>
         <p>
           Want to contribute or host Atlas yourself? All of the code is available on GitHub.
         </p>
-      </Feature>
+      </MiniFeature>
     </Grid>
   );
 }
+
+const Feature = styled(Unit)`
+  padding: 3em;
+  padding: 80px;
+  background: ${color.smoke}
+`;
+
+const MiniFeature = styled(Unit)`
+  padding: 80px 40px;
+`;
+
+const HeroText = styled.p`
+  font-size: 18px;
+  max-width: 600px;
+  margin-left: auto;
+  margin-right: auto;
+  margin-bottom: 2em;
+`;
+
+export default Home;
diff --git a/server/pages/components/Hero.js b/server/pages/components/Hero.js
index 2da5efdbf..381bfef88 100644
--- a/server/pages/components/Hero.js
+++ b/server/pages/components/Hero.js
@@ -5,6 +5,10 @@ const Hero = styled.div`
   width: 100%;
   padding: 4em 3em;
   text-align: center;
+
+  h1 {
+    font-size: 2.5em;
+  }
 `;
 
 export default Hero;
diff --git a/server/pages/components/Navigation.js b/server/pages/components/Navigation.js
index fc2ce5533..6626c3836 100644
--- a/server/pages/components/Navigation.js
+++ b/server/pages/components/Navigation.js
@@ -5,16 +5,36 @@ import { color } from '../../../shared/styles/constants';
 
 function Navigation() {
   return (
-    <nav>
+    <Nav>
       <Brand href="/">Atlas</Brand>
-      <ul>
-        <li><a href="/about">About</a></li>
-        <li><a href="/pricing">Pricing</a></li>
-      </ul>
-    </nav>
+      <Menu>
+        <MenuItem><a href="/about">About</a></MenuItem>
+        <MenuItem><a href="/pricing">Pricing</a></MenuItem>
+        <MenuItem><a href="/auth/slack">Sign In</a></MenuItem>
+      </Menu>
+    </Nav>
   );
 }
 
+const Nav = styled.nav`
+  display: flex;
+  padding: 20px;
+  justify-content: space-between;
+`;
+
+const Menu = styled.ul`
+  margin: 0;
+  padding: 0;
+  list-style: none;
+`;
+
+const MenuItem = styled.li`
+  display: inline-block;
+  margin: 0 0 0 40px;
+  font-size: 15px;
+  font-weight: 500;
+`;
+
 const Brand = styled.a`
   font-weight: 600;
   font-size: 20px;
diff --git a/server/pages/components/SlackSignin.js b/server/pages/components/SlackSignin.js
new file mode 100644
index 000000000..be26fae58
--- /dev/null
+++ b/server/pages/components/SlackSignin.js
@@ -0,0 +1,19 @@
+// @flow
+import React from 'react';
+import styled from 'styled-components';
+import { color } from '../../../shared/styles/constants';
+
+const SlackSignin = () => {
+  return <Button href="/auth/slack">Sign In with Slack</Button>;
+};
+
+const Button = styled.a`
+  display: inline-block;
+  padding: 10px 20px;
+  color: ${color.white};
+  background: ${color.black};
+  border-radius: 4px;
+  font-weight: 500;
+`;
+
+export default SlackSignin;

From 84c82c31a9890e4a9577c76461c6cfd234357310 Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Sun, 29 Oct 2017 15:02:24 -0700
Subject: [PATCH 09/10] Shared assets, cleanup for initial deploy

---
 .env.sample                                   |  1 +
 app/components/Alert/Alert.js                 |  2 +-
 app/components/Collaborators/Collaborators.js |  2 +-
 app/components/Divider/Divider.js             |  2 +-
 .../components/PublishingInfo.js              |  2 +-
 app/components/DocumentViews/DocumentViews.js |  2 +-
 .../DocumentViewers/DocumentViewers.js        |  2 +-
 app/components/DropdownMenu/DropdownMenu.js   |  2 +-
 .../DropdownMenu/DropdownMenuItem.js          |  2 +-
 app/components/Editor/Editor.js               |  2 +-
 .../Toolbar/components/LinkToolbar.js         |  2 +-
 app/components/Flex/index.js                  |  3 -
 app/components/Input/Input.js                 |  2 +-
 app/components/Labeled/Labeled.js             |  2 +-
 app/components/Layout/Layout.js               |  2 +-
 .../Layout/components/HeaderBlock.js          |  2 +-
 .../Layout/components/SidebarCollections.js   |  2 +-
 .../Layout/components/SidebarLink.js          |  2 +-
 .../LoadingListPlaceholder.js                 |  4 +-
 .../LoadingPlaceholder/ListPlaceholder.js     |  2 +-
 .../LoadingPlaceholder/LoadingPlaceholder.js  |  2 +-
 .../LoadingPlaceholder/components/Mask.js     |  7 +-
 app/components/Modal/Modal.js                 |  2 +-
 app/index.js                                  |  2 +-
 app/menus/CollectionMenu.js                   |  2 +-
 app/scenes/Collection/Collection.js           |  2 +-
 .../CollectionDelete/CollectionDelete.js      |  2 +-
 app/scenes/CollectionEdit/CollectionEdit.js   |  2 +-
 app/scenes/Dashboard/Dashboard.js             |  2 +-
 app/scenes/Document/Document.js               |  2 +-
 .../components/DocumentMove/DocumentMove.js   |  2 +-
 .../DocumentMove/components/PathToDocument.js |  2 +-
 .../LoadingPlaceholder/LoadingPlaceholder.js  |  4 +-
 app/scenes/DocumentDelete/DocumentDelete.js   |  2 +-
 .../KeyboardShortcuts/KeyboardShortcuts.js    |  2 +-
 app/scenes/Search/Search.js                   |  2 +-
 app/scenes/Search/components/SearchField.js   |  2 +-
 app/scenes/Settings/Settings.js               |  2 +-
 package.json                                  |  1 +
 server/pages/Home.js                          | 81 ++++---------------
 server/pages/components/Hero.js               |  2 +-
 server/pages/components/Navigation.js         |  4 +-
 .../{SlackSignin.js => SignupButton.js}       |  0
 server/routes.js                              |  4 +
 .../Flex => shared/components}/Flex.js        |  2 +-
 {app/utils => shared}/random.js               |  0
 yarn.lock                                     | 55 +++++++++++--
 47 files changed, 112 insertions(+), 122 deletions(-)
 delete mode 100644 app/components/Flex/index.js
 rename server/pages/components/{SlackSignin.js => SignupButton.js} (100%)
 rename {app/components/Flex => shared/components}/Flex.js (96%)
 rename {app/utils => shared}/random.js (100%)

diff --git a/.env.sample b/.env.sample
index fc5095471..d0698531a 100644
--- a/.env.sample
+++ b/.env.sample
@@ -8,3 +8,4 @@ SEQUELIZE_SECRET=F0E5AD933D7F6FD8F4DBB3E038C501C052DC0593C686D21ACB30AE205D2F634
 SLACK_KEY=71315967491.XXXXXXXXXX
 SLACK_SECRET=d2dc414f9953226bad0a356c794XXXXX
 URL=http://localhost:3000
+DEPLOYMENT=hosted
diff --git a/app/components/Alert/Alert.js b/app/components/Alert/Alert.js
index 4fc1c8db8..c1e11d533 100644
--- a/app/components/Alert/Alert.js
+++ b/app/components/Alert/Alert.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import { observer } from 'mobx-react';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import styled from 'styled-components';
 import { color } from 'shared/styles/constants';
 
diff --git a/app/components/Collaborators/Collaborators.js b/app/components/Collaborators/Collaborators.js
index 746c9ad66..3ae8a24b9 100644
--- a/app/components/Collaborators/Collaborators.js
+++ b/app/components/Collaborators/Collaborators.js
@@ -3,7 +3,7 @@ import React from 'react';
 import moment from 'moment';
 import styled from 'styled-components';
 import { color } from 'shared/styles/constants';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import Tooltip from 'components/Tooltip';
 import Document from 'models/Document';
 
diff --git a/app/components/Divider/Divider.js b/app/components/Divider/Divider.js
index 440ef1d9b..7ce582a5b 100644
--- a/app/components/Divider/Divider.js
+++ b/app/components/Divider/Divider.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import styled from 'styled-components';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
 const Divider = () => {
   return <Flex auto justify="center"><Content /></Flex>;
diff --git a/app/components/DocumentPreview/components/PublishingInfo.js b/app/components/DocumentPreview/components/PublishingInfo.js
index bb666240f..dc296c440 100644
--- a/app/components/DocumentPreview/components/PublishingInfo.js
+++ b/app/components/DocumentPreview/components/PublishingInfo.js
@@ -5,7 +5,7 @@ import styled from 'styled-components';
 import { color } from 'shared/styles/constants';
 import Collection from 'models/Collection';
 import Document from 'models/Document';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
 const Container = styled(Flex)`
   color: ${color.slate};
diff --git a/app/components/DocumentViews/DocumentViews.js b/app/components/DocumentViews/DocumentViews.js
index 0ff1b2d16..6a293f8bb 100644
--- a/app/components/DocumentViews/DocumentViews.js
+++ b/app/components/DocumentViews/DocumentViews.js
@@ -5,7 +5,7 @@ import Popover from 'components/Popover';
 import styled from 'styled-components';
 import DocumentViewers from './components/DocumentViewers';
 import DocumentViewersStore from './DocumentViewersStore';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
 const Container = styled(Flex)`
   font-size: 13px;
diff --git a/app/components/DocumentViews/components/DocumentViewers/DocumentViewers.js b/app/components/DocumentViews/components/DocumentViewers/DocumentViewers.js
index e545a8d3c..566657d69 100644
--- a/app/components/DocumentViews/components/DocumentViewers/DocumentViewers.js
+++ b/app/components/DocumentViews/components/DocumentViewers/DocumentViewers.js
@@ -1,6 +1,6 @@
 // @flow
 import React, { Component } from 'react';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import styled from 'styled-components';
 import map from 'lodash/map';
 import Avatar from 'components/Avatar';
diff --git a/app/components/DropdownMenu/DropdownMenu.js b/app/components/DropdownMenu/DropdownMenu.js
index e2f2ea74c..e53048333 100644
--- a/app/components/DropdownMenu/DropdownMenu.js
+++ b/app/components/DropdownMenu/DropdownMenu.js
@@ -5,7 +5,7 @@ import { observable } from 'mobx';
 import { observer } from 'mobx-react';
 import styled from 'styled-components';
 import Portal from 'react-portal';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import { color } from 'shared/styles/constants';
 import { fadeAndScaleIn } from 'shared/styles/animations';
 
diff --git a/app/components/DropdownMenu/DropdownMenuItem.js b/app/components/DropdownMenu/DropdownMenuItem.js
index bdbe4f2eb..322b909ec 100644
--- a/app/components/DropdownMenu/DropdownMenuItem.js
+++ b/app/components/DropdownMenu/DropdownMenuItem.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import styled from 'styled-components';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import { color } from 'shared/styles/constants';
 
 const DropdownMenuItem = ({
diff --git a/app/components/Editor/Editor.js b/app/components/Editor/Editor.js
index 75ed07f1b..e556841d7 100644
--- a/app/components/Editor/Editor.js
+++ b/app/components/Editor/Editor.js
@@ -6,7 +6,7 @@ import { Editor, Plain } from 'slate';
 import keydown from 'react-keydown';
 import type { State, Editor as EditorType } from './types';
 import getDataTransferFiles from 'utils/getDataTransferFiles';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import ClickablePadding from './components/ClickablePadding';
 import Toolbar from './components/Toolbar';
 import BlockInsert from './components/BlockInsert';
diff --git a/app/components/Editor/components/Toolbar/components/LinkToolbar.js b/app/components/Editor/components/Toolbar/components/LinkToolbar.js
index c7b38bb24..f85d420bc 100644
--- a/app/components/Editor/components/Toolbar/components/LinkToolbar.js
+++ b/app/components/Editor/components/Toolbar/components/LinkToolbar.js
@@ -14,7 +14,7 @@ import keydown from 'react-keydown';
 import CloseIcon from 'components/Icon/CloseIcon';
 import OpenIcon from 'components/Icon/OpenIcon';
 import TrashIcon from 'components/Icon/TrashIcon';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
 @keydown
 @observer
diff --git a/app/components/Flex/index.js b/app/components/Flex/index.js
deleted file mode 100644
index d798e8cd8..000000000
--- a/app/components/Flex/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-// @flow
-import Flex from './Flex';
-export default Flex;
diff --git a/app/components/Input/Input.js b/app/components/Input/Input.js
index 7a1f81786..5fbe34106 100644
--- a/app/components/Input/Input.js
+++ b/app/components/Input/Input.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import styled from 'styled-components';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import { size, color } from 'shared/styles/constants';
 
 const RealTextarea = styled.textarea`
diff --git a/app/components/Labeled/Labeled.js b/app/components/Labeled/Labeled.js
index 985617cb2..ec9e2f8fe 100644
--- a/app/components/Labeled/Labeled.js
+++ b/app/components/Labeled/Labeled.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import { observer } from 'mobx-react';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import styled from 'styled-components';
 import { size } from 'shared/styles/constants';
 
diff --git a/app/components/Layout/Layout.js b/app/components/Layout/Layout.js
index 8dd96e933..2a5d34b31 100644
--- a/app/components/Layout/Layout.js
+++ b/app/components/Layout/Layout.js
@@ -5,7 +5,7 @@ import { Helmet } from 'react-helmet';
 import styled from 'styled-components';
 import { observer, inject } from 'mobx-react';
 import keydown from 'react-keydown';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import { color, layout } from 'shared/styles/constants';
 import { documentEditUrl, homeUrl, searchUrl } from 'utils/routeHelpers';
 
diff --git a/app/components/Layout/components/HeaderBlock.js b/app/components/Layout/components/HeaderBlock.js
index 1cfb73111..9c80e6f0d 100644
--- a/app/components/Layout/components/HeaderBlock.js
+++ b/app/components/Layout/components/HeaderBlock.js
@@ -3,7 +3,7 @@ import React from 'react';
 import styled from 'styled-components';
 import { color } from 'shared/styles/constants';
 import type { User, Team } from 'types';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
 type Props = {
   user: User,
diff --git a/app/components/Layout/components/SidebarCollections.js b/app/components/Layout/components/SidebarCollections.js
index 2516fdad2..45e9e304e 100644
--- a/app/components/Layout/components/SidebarCollections.js
+++ b/app/components/Layout/components/SidebarCollections.js
@@ -2,7 +2,7 @@
 import React from 'react';
 import { observable } from 'mobx';
 import { observer, inject } from 'mobx-react';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import styled from 'styled-components';
 import { color, fontWeight } from 'shared/styles/constants';
 
diff --git a/app/components/Layout/components/SidebarLink.js b/app/components/Layout/components/SidebarLink.js
index b9fa5fffb..02d8508e8 100644
--- a/app/components/Layout/components/SidebarLink.js
+++ b/app/components/Layout/components/SidebarLink.js
@@ -5,7 +5,7 @@ import { observer } from 'mobx-react';
 import { NavLink } from 'react-router-dom';
 import { color, fontWeight } from 'shared/styles/constants';
 import styled from 'styled-components';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import CollapsedIcon from 'components/Icon/CollapsedIcon';
 
 const activeStyle = {
diff --git a/app/components/LoadingListPlaceholder/LoadingListPlaceholder.js b/app/components/LoadingListPlaceholder/LoadingListPlaceholder.js
index e8c37d4a6..0cb35f467 100644
--- a/app/components/LoadingListPlaceholder/LoadingListPlaceholder.js
+++ b/app/components/LoadingListPlaceholder/LoadingListPlaceholder.js
@@ -4,9 +4,9 @@ import ReactCSSTransitionGroup from 'react-addons-css-transition-group';
 import styled from 'styled-components';
 import { pulsate } from 'shared/styles/animations';
 import { color } from 'shared/styles/constants';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
-import { randomInteger } from 'utils/random';
+import { randomInteger } from 'shared/random';
 
 const randomValues = Array.from(
   new Array(5),
diff --git a/app/components/LoadingPlaceholder/ListPlaceholder.js b/app/components/LoadingPlaceholder/ListPlaceholder.js
index 7fba72172..1eef84884 100644
--- a/app/components/LoadingPlaceholder/ListPlaceholder.js
+++ b/app/components/LoadingPlaceholder/ListPlaceholder.js
@@ -4,7 +4,7 @@ import _ from 'lodash';
 import ReactCSSTransitionGroup from 'react-addons-css-transition-group';
 import styled from 'styled-components';
 import Mask from './components/Mask';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
 type Props = {
   count?: number,
diff --git a/app/components/LoadingPlaceholder/LoadingPlaceholder.js b/app/components/LoadingPlaceholder/LoadingPlaceholder.js
index 6f978e247..97d9f1a33 100644
--- a/app/components/LoadingPlaceholder/LoadingPlaceholder.js
+++ b/app/components/LoadingPlaceholder/LoadingPlaceholder.js
@@ -2,7 +2,7 @@
 import React from 'react';
 import ReactCSSTransitionGroup from 'react-addons-css-transition-group';
 import Mask from './components/Mask';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
 export default (props: Object) => {
   return (
diff --git a/app/components/LoadingPlaceholder/components/Mask.js b/app/components/LoadingPlaceholder/components/Mask.js
index 82d271b08..61ccd1419 100644
--- a/app/components/LoadingPlaceholder/components/Mask.js
+++ b/app/components/LoadingPlaceholder/components/Mask.js
@@ -3,8 +3,8 @@ import React, { Component } from 'react';
 import styled from 'styled-components';
 import { pulsate } from 'shared/styles/animations';
 import { color } from 'shared/styles/constants';
-import { randomInteger } from 'utils/random';
-import Flex from 'components/Flex';
+import { randomInteger } from 'shared/random';
+import Flex from 'shared/components/Flex';
 
 class Mask extends Component {
   width: number;
@@ -13,8 +13,7 @@ class Mask extends Component {
     return false;
   }
 
-  constructor(props: Object) {
-    super(props);
+  componentWillmount() {
     this.width = randomInteger(75, 100);
   }
 
diff --git a/app/components/Modal/Modal.js b/app/components/Modal/Modal.js
index ff97a141a..abc207002 100644
--- a/app/components/Modal/Modal.js
+++ b/app/components/Modal/Modal.js
@@ -6,7 +6,7 @@ import ReactModal from 'react-modal';
 import { color } from 'shared/styles/constants';
 import { fadeAndScaleIn } from 'shared/styles/animations';
 import CloseIcon from 'components/Icon/CloseIcon';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
 type Props = {
   children?: React$Element<any>,
diff --git a/app/index.js b/app/index.js
index 1e7833516..5054d3fc2 100644
--- a/app/index.js
+++ b/app/index.js
@@ -8,7 +8,7 @@ import {
   Route,
   Redirect,
 } from 'react-router-dom';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
 import stores from 'stores';
 import DocumentsStore from 'stores/DocumentsStore';
diff --git a/app/menus/CollectionMenu.js b/app/menus/CollectionMenu.js
index 76c778be0..bc393a6ad 100644
--- a/app/menus/CollectionMenu.js
+++ b/app/menus/CollectionMenu.js
@@ -5,7 +5,7 @@ import { inject, observer } from 'mobx-react';
 import Collection from 'models/Collection';
 import UiStore from 'stores/UiStore';
 import MoreIcon from 'components/Icon/MoreIcon';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
 
 @observer class CollectionMenu extends Component {
diff --git a/app/scenes/Collection/Collection.js b/app/scenes/Collection/Collection.js
index f5984c78d..22c84ea12 100644
--- a/app/scenes/Collection/Collection.js
+++ b/app/scenes/Collection/Collection.js
@@ -14,7 +14,7 @@ import Collection from 'models/Collection';
 import CenteredContent from 'components/CenteredContent';
 import LoadingListPlaceholder from 'components/LoadingListPlaceholder';
 import Button from 'components/Button';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import HelpText from 'components/HelpText';
 
 type Props = {
diff --git a/app/scenes/CollectionDelete/CollectionDelete.js b/app/scenes/CollectionDelete/CollectionDelete.js
index 31573e900..a79359751 100644
--- a/app/scenes/CollectionDelete/CollectionDelete.js
+++ b/app/scenes/CollectionDelete/CollectionDelete.js
@@ -5,7 +5,7 @@ import { observable } from 'mobx';
 import { inject, observer } from 'mobx-react';
 import { homeUrl } from 'utils/routeHelpers';
 import Button from 'components/Button';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import HelpText from 'components/HelpText';
 import Collection from 'models/Collection';
 import CollectionsStore from 'stores/CollectionsStore';
diff --git a/app/scenes/CollectionEdit/CollectionEdit.js b/app/scenes/CollectionEdit/CollectionEdit.js
index 8cb2401e3..17fc570b8 100644
--- a/app/scenes/CollectionEdit/CollectionEdit.js
+++ b/app/scenes/CollectionEdit/CollectionEdit.js
@@ -5,7 +5,7 @@ import { observable } from 'mobx';
 import { inject, observer } from 'mobx-react';
 import Button from 'components/Button';
 import Input from 'components/Input';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import HelpText from 'components/HelpText';
 import Collection from 'models/Collection';
 
diff --git a/app/scenes/Dashboard/Dashboard.js b/app/scenes/Dashboard/Dashboard.js
index dbbc805c6..95278492d 100644
--- a/app/scenes/Dashboard/Dashboard.js
+++ b/app/scenes/Dashboard/Dashboard.js
@@ -5,7 +5,7 @@ import { observer, inject } from 'mobx-react';
 import styled from 'styled-components';
 
 import DocumentsStore from 'stores/DocumentsStore';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import DocumentList from 'components/DocumentList';
 import PageTitle from 'components/PageTitle';
 import CenteredContent from 'components/CenteredContent';
diff --git a/app/scenes/Document/Document.js b/app/scenes/Document/Document.js
index 517c2defe..e0a8aa721 100644
--- a/app/scenes/Document/Document.js
+++ b/app/scenes/Document/Document.js
@@ -6,7 +6,7 @@ import { observable } from 'mobx';
 import { observer, inject } from 'mobx-react';
 import { withRouter, Prompt } from 'react-router';
 import keydown from 'react-keydown';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import { color, layout } from 'shared/styles/constants';
 import {
   collectionUrl,
diff --git a/app/scenes/Document/components/DocumentMove/DocumentMove.js b/app/scenes/Document/components/DocumentMove/DocumentMove.js
index 55dae6bdd..23adcad30 100644
--- a/app/scenes/Document/components/DocumentMove/DocumentMove.js
+++ b/app/scenes/Document/components/DocumentMove/DocumentMove.js
@@ -13,7 +13,7 @@ import { size } from 'shared/styles/constants';
 import Modal from 'components/Modal';
 import Input from 'components/Input';
 import Labeled from 'components/Labeled';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import PathToDocument from './components/PathToDocument';
 
 import Document from 'models/Document';
diff --git a/app/scenes/Document/components/DocumentMove/components/PathToDocument.js b/app/scenes/Document/components/DocumentMove/components/PathToDocument.js
index 5868596a7..bda84a9c1 100644
--- a/app/scenes/Document/components/DocumentMove/components/PathToDocument.js
+++ b/app/scenes/Document/components/DocumentMove/components/PathToDocument.js
@@ -6,7 +6,7 @@ import _ from 'lodash';
 import styled from 'styled-components';
 import { color } from 'shared/styles/constants';
 
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import GoToIcon from 'components/Icon/GoToIcon';
 
 import Document from 'models/Document';
diff --git a/app/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js b/app/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js
index 21c019a8d..5930c7eaf 100644
--- a/app/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js
+++ b/app/scenes/Document/components/LoadingPlaceholder/LoadingPlaceholder.js
@@ -4,9 +4,9 @@ import ReactCSSTransitionGroup from 'react-addons-css-transition-group';
 import styled from 'styled-components';
 import { pulsate } from 'shared/styles/animations';
 import { color } from 'shared/styles/constants';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 
-import { randomInteger } from 'utils/random';
+import { randomInteger } from 'shared/random';
 
 const randomValues = Array.from(
   new Array(5),
diff --git a/app/scenes/DocumentDelete/DocumentDelete.js b/app/scenes/DocumentDelete/DocumentDelete.js
index 2e3896903..e6d92383b 100644
--- a/app/scenes/DocumentDelete/DocumentDelete.js
+++ b/app/scenes/DocumentDelete/DocumentDelete.js
@@ -4,7 +4,7 @@ import { withRouter } from 'react-router-dom';
 import { observable } from 'mobx';
 import { inject, observer } from 'mobx-react';
 import Button from 'components/Button';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import HelpText from 'components/HelpText';
 import Document from 'models/Document';
 import DocumentsStore from 'stores/DocumentsStore';
diff --git a/app/scenes/KeyboardShortcuts/KeyboardShortcuts.js b/app/scenes/KeyboardShortcuts/KeyboardShortcuts.js
index afb42649b..f07928318 100644
--- a/app/scenes/KeyboardShortcuts/KeyboardShortcuts.js
+++ b/app/scenes/KeyboardShortcuts/KeyboardShortcuts.js
@@ -2,7 +2,7 @@
 import React from 'react';
 import styled from 'styled-components';
 import Key from 'components/Key';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import HelpText from 'components/HelpText';
 
 function KeyboardShortcuts() {
diff --git a/app/scenes/Search/Search.js b/app/scenes/Search/Search.js
index 9050d0564..1000d18f7 100644
--- a/app/scenes/Search/Search.js
+++ b/app/scenes/Search/Search.js
@@ -13,7 +13,7 @@ import styled from 'styled-components';
 import ArrowKeyNavigation from 'boundless-arrow-key-navigation';
 
 import Empty from 'components/Empty';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import CenteredContent from 'components/CenteredContent';
 import LoadingIndicator from 'components/LoadingIndicator';
 import SearchField from './components/SearchField';
diff --git a/app/scenes/Search/components/SearchField.js b/app/scenes/Search/components/SearchField.js
index eeffe9a28..466bcb437 100644
--- a/app/scenes/Search/components/SearchField.js
+++ b/app/scenes/Search/components/SearchField.js
@@ -1,7 +1,7 @@
 // @flow
 import React, { Component } from 'react';
 import SearchIcon from 'components/Icon/SearchIcon';
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import { color } from 'shared/styles/constants';
 import styled from 'styled-components';
 
diff --git a/app/scenes/Settings/Settings.js b/app/scenes/Settings/Settings.js
index a0c792979..7b3a02280 100644
--- a/app/scenes/Settings/Settings.js
+++ b/app/scenes/Settings/Settings.js
@@ -7,7 +7,7 @@ import ApiKeyRow from './components/ApiKeyRow';
 import SettingsStore from './SettingsStore';
 import { color } from 'shared/styles/constants';
 
-import Flex from 'components/Flex';
+import Flex from 'shared/components/Flex';
 import Button from 'components/Button';
 import Input from 'components/Input';
 import HelpText from 'components/HelpText';
diff --git a/package.json b/package.json
index bab052ba1..1971c3794 100644
--- a/package.json
+++ b/package.json
@@ -121,6 +121,7 @@
     "koa-mount": "^3.0.0",
     "koa-router": "7.0.1",
     "koa-sendfile": "2.0.0",
+    "koa-static": "^4.0.1",
     "localforage": "^1.5.0",
     "lodash": "^4.17.4",
     "lodash.orderby": "4.4.0",
diff --git a/server/pages/Home.js b/server/pages/Home.js
index f29548c24..6500ba268 100644
--- a/server/pages/Home.js
+++ b/server/pages/Home.js
@@ -3,79 +3,26 @@ import React from 'react';
 import styled from 'styled-components';
 import Grid from 'styled-components-grid';
 import Hero from './components/Hero';
-import SlackSignin from './components/SlackSignin';
-import { color } from '../../shared/styles/constants';
-
-const Unit = Grid.Unit;
+import SignupButton from './components/SignupButton';
 
 function Home() {
   return (
-    <Grid>
-      <Hero>
-        <h1>Your team’s knowledge base</h1>
-        <HeroText>
-          Documentation, meeting notes, playbooks, onboarding, work logs, brainstorming, decisions, & more…
-        </HeroText>
-        <p>
-          <SlackSignin />
-        </p>
-      </Hero>
-      <Unit size={{ desktop: 1 / 2 }} />
-      <Feature size={{ desktop: 1 / 2 }}>
-        <h2>Blazing Fast</h2>
-        <p>
-          Atlas is fast, really fast. We’ve trimmed 100ms and 50ms there to make sure that documents load instantly, search is speedy and there are keyboard shortcuts for everything.
-        </p>
-      </Feature>
-
-      <Feature size={{ desktop: 1 / 2 }}>
-        <h2>Markdown Support</h2>
-        <p>
-          Documents are stored in Markdown and you can export them at any time. Markdown shortcuts are also built right into the editor so you can easily format using markdown syntax or our GUI.
-        </p>
-      </Feature>
-      <Unit size={{ desktop: 1 / 2 }} />
-
-      <Unit size={{ desktop: 1 / 2 }} />
-      <Feature size={{ desktop: 1 / 2 }}>
-        <h2>Beautiful Editor</h2>
-        <p>
-          We built a custom editor that’s a joy to use. Whether you’re typing up quick meeting notes or documenting a full API the interface gets out of your way and lets you focus on the content.
-        </p>
-      </Feature>
-
-      <MiniFeature size={{ desktop: 1 / 3 }}>
-        <h2>Powerful Search</h2>
-        <p>
-          Built-in search makes that one document easy to find in a large knowledgebase.
-        </p>
-      </MiniFeature>
-      <MiniFeature size={{ desktop: 1 / 3 }}>
-        <h2>API & Integrations</h2>
-        <p>
-          Atlas is built on it’s own API, treat Atlas as a CMS or automatically create documents from outside events.
-        </p>
-      </MiniFeature>
-      <MiniFeature size={{ desktop: 1 / 3 }}>
-        <h2>Open Source</h2>
-        <p>
-          Want to contribute or host Atlas yourself? All of the code is available on GitHub.
-        </p>
-      </MiniFeature>
-    </Grid>
+    <span>
+      <Grid>
+        <Hero>
+          <h1>Your team’s knowledge base</h1>
+          <HeroText>
+            Documentation, meeting notes, playbooks, onboarding, work logs, brainstorming, decisions, & more…
+          </HeroText>
+          <p>
+            <SignupButton />
+          </p>
+        </Hero>
+      </Grid>
+    </span>
   );
 }
 
-const Feature = styled(Unit)`
-  padding: 3em;
-  padding: 80px;
-  background: ${color.smoke}
-`;
-
-const MiniFeature = styled(Unit)`
-  padding: 80px 40px;
-`;
-
 const HeroText = styled.p`
   font-size: 18px;
   max-width: 600px;
diff --git a/server/pages/components/Hero.js b/server/pages/components/Hero.js
index 381bfef88..f597c92a2 100644
--- a/server/pages/components/Hero.js
+++ b/server/pages/components/Hero.js
@@ -3,7 +3,7 @@ import styled from 'styled-components';
 
 const Hero = styled.div`
   width: 100%;
-  padding: 4em 3em;
+  padding: 6em 2em 8em;
   text-align: center;
 
   h1 {
diff --git a/server/pages/components/Navigation.js b/server/pages/components/Navigation.js
index 6626c3836..0ff578067 100644
--- a/server/pages/components/Navigation.js
+++ b/server/pages/components/Navigation.js
@@ -8,8 +8,6 @@ function Navigation() {
     <Nav>
       <Brand href="/">Atlas</Brand>
       <Menu>
-        <MenuItem><a href="/about">About</a></MenuItem>
-        <MenuItem><a href="/pricing">Pricing</a></MenuItem>
         <MenuItem><a href="/auth/slack">Sign In</a></MenuItem>
       </Menu>
     </Nav>
@@ -18,7 +16,7 @@ function Navigation() {
 
 const Nav = styled.nav`
   display: flex;
-  padding: 20px;
+  padding: 20px 30px;
   justify-content: space-between;
 `;
 
diff --git a/server/pages/components/SlackSignin.js b/server/pages/components/SignupButton.js
similarity index 100%
rename from server/pages/components/SlackSignin.js
rename to server/pages/components/SignupButton.js
diff --git a/server/routes.js b/server/routes.js
index 2f88a4b20..3edbf4bea 100644
--- a/server/routes.js
+++ b/server/routes.js
@@ -5,6 +5,7 @@ import httpErrors from 'http-errors';
 import Koa from 'koa';
 import Router from 'koa-router';
 import sendfile from 'koa-sendfile';
+import serve from 'koa-static';
 import subdomainRedirect from './middlewares/subdomainRedirect';
 import renderpage from './utils/renderpage';
 
@@ -24,6 +25,9 @@ const renderapp = async ctx => {
   }
 };
 
+// serve static assets
+koa.use(serve(path.resolve(__dirname, '../public')));
+
 router.get('/_health', ctx => (ctx.body = 'OK'));
 
 if (process.env.NODE_ENV === 'production') {
diff --git a/app/components/Flex/Flex.js b/shared/components/Flex.js
similarity index 96%
rename from app/components/Flex/Flex.js
rename to shared/components/Flex.js
index d14c0ce15..3b420fafb 100644
--- a/app/components/Flex/Flex.js
+++ b/shared/components/Flex.js
@@ -22,7 +22,7 @@ type Props = {
   justify?: JustifyValues,
   auto?: ?boolean,
   className?: string,
-  children?: React.Element<any>,
+  children?: React$Element<*>,
 };
 
 const Flex = (props: Props) => {
diff --git a/app/utils/random.js b/shared/random.js
similarity index 100%
rename from app/utils/random.js
rename to shared/random.js
diff --git a/yarn.lock b/yarn.lock
index f5accbea0..1f83c0d29 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4006,6 +4006,15 @@ http-errors@1.6.1:
     setprototypeof "1.0.3"
     statuses ">= 1.3.1 < 2"
 
+http-errors@^1.6.1, http-errors@~1.6.1:
+  version "1.6.2"
+  resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.6.2.tgz#0a002cc85707192a7e7946ceedc11155f60ec736"
+  dependencies:
+    depd "1.1.1"
+    inherits "2.0.3"
+    setprototypeof "1.0.3"
+    statuses ">= 1.3.1 < 2"
+
 http-errors@~1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.3.1.tgz#197e22cdebd4198585e8694ef6786197b91ed942"
@@ -4013,13 +4022,12 @@ http-errors@~1.3.1:
     inherits "~2.0.1"
     statuses "1"
 
-http-errors@~1.6.1:
-  version "1.6.2"
-  resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.6.2.tgz#0a002cc85707192a7e7946ceedc11155f60ec736"
+http-errors@~1.5.0:
+  version "1.5.1"
+  resolved "https://registry.npmjs.org/http-errors/-/http-errors-1.5.1.tgz#788c0d2c1de2c81b9e6e8c01843b6b97eb920750"
   dependencies:
-    depd "1.1.1"
     inherits "2.0.3"
-    setprototypeof "1.0.3"
+    setprototypeof "1.0.2"
     statuses ">= 1.3.1 < 2"
 
 http-signature@~1.1.0:
@@ -5114,6 +5122,15 @@ koa-router@7.0.1:
     methods "^1.0.1"
     path-to-regexp "^1.1.1"
 
+koa-send@^4.1.0:
+  version "4.1.1"
+  resolved "https://registry.npmjs.org/koa-send/-/koa-send-4.1.1.tgz#bd3fa116b1f592f5fff23c9670aae69787f6cb57"
+  dependencies:
+    debug "^2.6.3"
+    http-errors "^1.6.1"
+    mz "^2.6.0"
+    resolve-path "^1.3.3"
+
 koa-sendfile@2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/koa-sendfile/-/koa-sendfile-2.0.0.tgz#446e2a35ba7074ed03afda2c667c2359406e1082"
@@ -5122,6 +5139,13 @@ koa-sendfile@2.0.0:
     etag "^1.5.1"
     mz "2"
 
+koa-static@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.npmjs.org/koa-static/-/koa-static-4.0.1.tgz#b99521ed848d7adb79acae9c824d8d8277a8c4d5"
+  dependencies:
+    debug "^2.6.8"
+    koa-send "^4.1.0"
+
 koa-unless@1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/koa-unless/-/koa-unless-1.0.0.tgz#5aa57384bc882568afc90ac04852a3d58658aeeb"
@@ -6009,6 +6033,14 @@ mz@2:
     object-assign "^4.0.1"
     thenify-all "^1.0.0"
 
+mz@^2.6.0:
+  version "2.7.0"
+  resolved "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz#95008057a56cafadc2bc63dde7f9ff6955948e32"
+  dependencies:
+    any-promise "^1.0.0"
+    object-assign "^4.0.1"
+    thenify-all "^1.0.0"
+
 nan@2.6.2:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.6.2.tgz#e4ff34e6c95fdfb5aecc08de6596f43605a7db45"
@@ -6624,7 +6656,7 @@ path-exists@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515"
 
-path-is-absolute@^1.0.0, path-is-absolute@^1.0.1:
+path-is-absolute@1.0.1, path-is-absolute@^1.0.0, path-is-absolute@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f"
 
@@ -7737,6 +7769,13 @@ resolve-from@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-1.0.1.tgz#26cbfe935d1aeeeabb29bc3fe5aeb01e93d44226"
 
+resolve-path@^1.3.3:
+  version "1.3.3"
+  resolved "https://registry.npmjs.org/resolve-path/-/resolve-path-1.3.3.tgz#4d83aba6468c2b8e632a575e3f52b0fa0dbe1a5c"
+  dependencies:
+    http-errors "~1.5.0"
+    path-is-absolute "1.0.1"
+
 resolve-pathname@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/resolve-pathname/-/resolve-pathname-2.2.0.tgz#7e9ae21ed815fd63ab189adeee64dc831eefa879"
@@ -7994,6 +8033,10 @@ set-immediate-shim@^1.0.1:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/setimmediate/-/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285"
 
+setprototypeof@1.0.2:
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.2.tgz#81a552141ec104b88e89ce383103ad5c66564d08"
+
 setprototypeof@1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/setprototypeof/-/setprototypeof-1.0.3.tgz#66567e37043eeb4f04d91bd658c0cbefb55b8e04"

From 87e8b6d207b8d4e4c2deff92f4f02365c23c394c Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Sun, 29 Oct 2017 15:33:00 -0700
Subject: [PATCH 10/10] Refactor base styles

---
 app/components/DropToImport/DropToImport.js | 13 +++++++++++++
 app/components/Modal/Modal.js               |  8 +++++++-
 shared/styles/base.js                       | 12 ------------
 3 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/app/components/DropToImport/DropToImport.js b/app/components/DropToImport/DropToImport.js
index 8c1341f70..34bb84cc1 100644
--- a/app/components/DropToImport/DropToImport.js
+++ b/app/components/DropToImport/DropToImport.js
@@ -1,6 +1,8 @@
 // @flow
 import React, { Component } from 'react';
 import { inject } from 'mobx-react';
+import { injectGlobal } from 'styled-components';
+import { color } from 'shared/styles/constants';
 import invariant from 'invariant';
 import _ from 'lodash';
 import Dropzone from 'react-dropzone';
@@ -20,6 +22,17 @@ type Props = {
   history: Object,
 };
 
+injectGlobal`
+  .activeDropZone {
+    background: ${color.slateDark};
+    svg { fill: ${color.white}; }
+  }
+
+  .activeDropZone a {
+    color: ${color.white} !important;
+  }
+`;
+
 class DropToImport extends Component {
   state: {
     isImporting: boolean,
diff --git a/app/components/Modal/Modal.js b/app/components/Modal/Modal.js
index abc207002..105f62291 100644
--- a/app/components/Modal/Modal.js
+++ b/app/components/Modal/Modal.js
@@ -1,7 +1,7 @@
 // @flow
 import React from 'react';
 import { observer } from 'mobx-react';
-import styled from 'styled-components';
+import styled, { injectGlobal } from 'styled-components';
 import ReactModal from 'react-modal';
 import { color } from 'shared/styles/constants';
 import { fadeAndScaleIn } from 'shared/styles/animations';
@@ -15,6 +15,12 @@ type Props = {
   onRequestClose: () => void,
 };
 
+injectGlobal`
+  .ReactModal__Body--open {
+    overflow: hidden;
+  }
+`;
+
 const Modal = ({
   children,
   isOpen,
diff --git a/shared/styles/base.js b/shared/styles/base.js
index 8335ad9df..99239b560 100644
--- a/shared/styles/base.js
+++ b/shared/styles/base.js
@@ -68,16 +68,4 @@ export default `
     margin-top: 1em;
     margin-bottom: 1em;
   }
-
-  .activeDropZone {
-    background: #4E5C6E;
-  }
-
-  .activeDropZone a {
-    color: #FFF !important;
-  }
-
-  .ReactModal__Body--open {
-    overflow: hidden;
-  }
 `;