diff --git a/demo/client/Routes.js b/demo/client/Routes.js
new file mode 100644
index 0000000000..f0680f4cc1
--- /dev/null
+++ b/demo/client/Routes.js
@@ -0,0 +1,40 @@
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+import { Route, Switch, Link, withRouter } from 'react-router-dom';
+
+import DefaultTemplate from 'payload/client/components/layout/DefaultTemplate';
+import Dashboard from 'payload/client/components/views/Dashboard';
+import Login from 'payload/client/components/views/Login';
+
+const mapStateToProps = state => ({
+  collections: state.collections.all
+});
+
+class Routes extends Component {
+  render() {
+    return (
+      <Switch location={this.props.location}>
+        <Route path="/login" component={Login} />
+        <Route path="/forgot" component={ () => { return <h1>Forgot Password</h1>; } } />
+        <Route path="/" render={() => {
+          return (
+            <DefaultTemplate>
+              <Route path="/" exact component={Dashboard} />
+              {this.props.collections.map((collection) => {
+
+                return (
+                  <React.Fragment key={collection.slug}>
+                    <Route path={`/collections/${collection.slug}`} exact component={collection.archive} />
+                    <Route path={`/collections/${collection.slug}/:id`} component={collection.edit} />
+                  </React.Fragment>
+                );
+              })}
+            </DefaultTemplate>
+          );
+        }} />
+      </Switch>
+    );
+  }
+}
+
+export default withRouter(connect(mapStateToProps)(Routes));
diff --git a/demo/client/index.js b/demo/client/index.js
index cdfc3d9bc2..cc5e7495c1 100644
--- a/demo/client/index.js
+++ b/demo/client/index.js
@@ -1,40 +1,15 @@
 import React from 'react';
 import { render } from 'react-dom';
-import { Route, Switch, Link } from 'react-router-dom';
 
-import DefaultTemplate from 'payload/client/components/layout/DefaultTemplate';
-import Dashboard from 'payload/client/components/views/Dashboard';
-import Login from 'payload/client/components/views/Login';
 import App from 'payload/client/components/App';
 
-import collections from '../collections';
+import Routes from './Routes';
 import store from './store';
 
 const Index = () => {
   return (
     <App store={store}>
-      <Switch>
-        <Route path="/login" component={Login} />
-        <Route path="/forgot" component={ () => { return <h1>Forgot Password</h1>; } } />
-        <Route path="/" render={() => {
-          return (
-            <DefaultTemplate>
-              <Route path="/" exact component={Dashboard} />
-              {collections.map((collection) => {
-                const collectionsPath = 'collections';
-
-                return (
-                  <React.Fragment key={collection.slug}>
-                    <Route path={`/${collectionsPath}/${collection.slug}`} exact component={collection.archive} />
-                    <Route path={`/${collectionsPath}/${collection.slug}/:id`} component={collection.edit} />
-                  </React.Fragment>
-                );
-              })}
-            </DefaultTemplate>
-          );
-        }} />
-      </Switch>
-      <Link to="/">Dashboard</Link>
+      <Routes />
     </App>
   );
 };
diff --git a/demo/collections.js b/demo/collections.js
index 4535d4367a..c142a2608f 100644
--- a/demo/collections.js
+++ b/demo/collections.js
@@ -7,11 +7,17 @@ import OrdersEdit from './client/components/collections/Orders/Edit';
 export default [
   {
     slug: 'pages',
+    label: 'Pages',
+    singular: 'Page',
+    plural: 'Pages',
     archive: PagesArchive,
     edit: PagesEdit
   },
   {
     slug: 'orders',
+    label: 'Orders',
+    singular: 'Order',
+    plural: 'Orders',
     archive: OrdersArchive,
     edit: OrdersEdit
   }
diff --git a/src/client/components/App.js b/src/client/components/App.js
index 92dbfa9c5a..fd97053d37 100644
--- a/src/client/components/App.js
+++ b/src/client/components/App.js
@@ -3,6 +3,7 @@ import { BrowserRouter as Router, Link } from 'react-router-dom';
 import { Provider } from 'react-redux';
 import MeasureWindow from 'payload/client/components/utilities/MeasureWindow';
 import MeasureScroll from 'payload/client/components/utilities/MeasureScroll';
+import LoadContent from 'payload/client/components/utilities/LoadContent';
 
 import 'payload/client/scss/app.css';
 
@@ -14,6 +15,7 @@ class App extends Component {
           <React.Fragment>
             <MeasureScroll />
             <MeasureWindow />
+            <LoadContent />
             {this.props.children}
           </React.Fragment>
         </Router>
diff --git a/src/client/components/layout/Sidebar/index.js b/src/client/components/layout/Sidebar/index.js
index 915ee04bd7..3e78783d83 100644
--- a/src/client/components/layout/Sidebar/index.js
+++ b/src/client/components/layout/Sidebar/index.js
@@ -1,14 +1,33 @@
-import React from 'react';
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+import { Link } from 'react-router-dom';
 import Icon from 'demo/client/components/graphics/Icon';
 import Label from '../../type/Label';
 
 import './index.css';
 
-export default () => {
-  return (
-    <aside className="sidebar">
-      <Icon />
-      <Label>Collections</Label>
-    </aside>
-  );
+const mapStateToProps = state => ({
+  collections: state.collections.all
+});
+
+class Sidebar extends Component {
+  render() {
+    return (
+      <aside className="sidebar">
+        <Link to="/">
+          <Icon />
+        </Link>
+        <Label>Collections</Label>
+        <nav>
+          {this.props.collections.map((collection, i) => {
+            return (
+              <Link key={i} to={`/collections/${collection.slug}`}>{collection.plural}</Link>
+            );
+          })}
+        </nav>
+      </aside>
+    );
+  }
 };
+
+export default connect(mapStateToProps)(Sidebar);
diff --git a/src/client/components/layout/Sidebar/index.scss b/src/client/components/layout/Sidebar/index.scss
index 24882c0b40..50d5e8d3e4 100644
--- a/src/client/components/layout/Sidebar/index.scss
+++ b/src/client/components/layout/Sidebar/index.scss
@@ -10,4 +10,17 @@
     @include m;
     width: $base;
   }
+
+  label {
+    color: $gray;
+  }
+
+  nav {
+    margin: rem(.5) 0;
+    a {
+      display: block;
+      padding: rem(.33) 0;
+      border-bottom: 0;
+    }
+  }
 }
diff --git a/src/client/components/utilities/LoadContent/index.js b/src/client/components/utilities/LoadContent/index.js
new file mode 100644
index 0000000000..cababfc0d2
--- /dev/null
+++ b/src/client/components/utilities/LoadContent/index.js
@@ -0,0 +1,20 @@
+import { Component } from 'react';
+import { connect } from 'react-redux';
+import collections from 'demo/collections';
+
+const mapDispatchToProps = dispatch => ({
+  loadCollections: collections => dispatch({ type: 'LOAD_COLLECTIONS', payload: collections }),
+});
+
+class LoadContent extends Component {
+
+  componentDidMount() {
+    this.props.loadCollections(collections);
+  }
+
+  render() {
+    return false;
+  }
+}
+
+export default connect(null, mapDispatchToProps)(LoadContent);
diff --git a/src/client/components/views/Login/index.js b/src/client/components/views/Login/index.js
index cbe1e0ff00..e84461fa43 100644
--- a/src/client/components/views/Login/index.js
+++ b/src/client/components/views/Login/index.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import { Link } from 'react-router-dom';
 import ContentBlock from 'payload/client/components/layout/ContentBlock';
 import Logo from 'demo/client/components/graphics/Logo';
 import Form from 'payload/client/components/forms/Form';
@@ -21,6 +22,7 @@ export default () => {
           Log In
         </Button>
       </Form>
+      <Link to="/">To Dashboard</Link>
     </ContentBlock>
   );
 };
diff --git a/src/client/reducers/collections.js b/src/client/reducers/collections.js
index d0cf7b44d6..11c19520ca 100644
--- a/src/client/reducers/collections.js
+++ b/src/client/reducers/collections.js
@@ -5,6 +5,7 @@ const defaultState = {
 export default (state = defaultState, action) => {
   switch (action.type) {
   case 'LOAD_COLLECTIONS':
+
     return {
       ...state,
       all: action.payload
diff --git a/src/client/scss/_type.scss b/src/client/scss/_type.scss
index c0ccc23097..107145d764 100644
--- a/src/client/scss/_type.scss
+++ b/src/client/scss/_type.scss
@@ -78,8 +78,8 @@
 
 %label {
     text-transform: uppercase;
-    letter-spacing: rem(.05);
-    font-size: rem(.3);
+    letter-spacing: rem(.1);
+    font-size: rem(.275);
     font-family: $font-label;
     -webkit-font-smoothing: auto;
 
diff --git a/src/client/scss/_vars.scss b/src/client/scss/_vars.scss
index 0467d48e66..8b43d79e29 100644
--- a/src/client/scss/_vars.scss
+++ b/src/client/scss/_vars.scss
@@ -4,7 +4,7 @@
 
 $body           : 18px;
 $base-px        : 36px;
-$base           : ($base-px / $body) + rem; // This computes to 30px in rem
+$base           : ($base-px / $body) + rem; // This computes to 36px in rem
 
 @function rem($multiplier) {
 	@return ($base-px / $body) * $multiplier + rem;
diff --git a/src/client/scss/app.scss b/src/client/scss/app.scss
index 6b009ad32a..9a6fa15c46 100644
--- a/src/client/scss/app.scss
+++ b/src/client/scss/app.scss
@@ -24,10 +24,10 @@ body {
 
 html {
   font-size: $body;
-    line-height: rem(1);
-    font-size: 20px;
+  line-height: rem(1);
+  font-size: 20px;
 
-  @include mid-break {
+/*  @include mid-break {
     font-size: 18px;
     line-height: rem(1);
   }
@@ -35,7 +35,7 @@ html {
   @include small-break {
     font-size: 16px;
     line-height: rem(.8)
-  }
+  }*/
 }
 
 ::selection {