From 38d06691d7da7b536fc736389a9664347f443d8f Mon Sep 17 00:00:00 2001
From: Jori Lallo <jtlallo@gmail.com>
Date: Thu, 19 May 2016 21:03:29 -0700
Subject: [PATCH] Nicer dashboard

---
 src/components/AtlasPreview/AtlasPreview.js   |  2 +-
 src/components/AtlasPreview/AtlasPreview.scss | 13 +++++++++++++
 src/scenes/Dashboard/Dashboard.js             | 13 ++++++++-----
 3 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/src/components/AtlasPreview/AtlasPreview.js b/src/components/AtlasPreview/AtlasPreview.js
index 5f23b4d3b..9b9aaec57 100644
--- a/src/components/AtlasPreview/AtlasPreview.js
+++ b/src/components/AtlasPreview/AtlasPreview.js
@@ -16,7 +16,7 @@ class AtlasPreview extends React.Component {
     return (
       <div className={ styles.container }>
         <h2><Link to={ `/atlas/${data.id}` } className={ styles.atlasLink }>{ data.name }</Link></h2>
-        <div>No documents. Why not <Link to={ `/atlas/${data.id}/new` }>create one</Link>?</div>
+        <div className={ styles.description }>No documents. Why not <Link to={ `/atlas/${data.id}/new` }>create one</Link>?</div>
       </div>
     );
   }
diff --git a/src/components/AtlasPreview/AtlasPreview.scss b/src/components/AtlasPreview/AtlasPreview.scss
index 8a464b83b..56f0cbfb7 100644
--- a/src/components/AtlasPreview/AtlasPreview.scss
+++ b/src/components/AtlasPreview/AtlasPreview.scss
@@ -1,6 +1,19 @@
 @import '../../utils/constants.scss';
 
+.container {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  padding-bottom: 40px;
+  margin-bottom: 20px;
+  border-bottom: 1px solid #eee;
+}
+
 .atlasLink {
   text-decoration: none;
   color: $textColor;
+}
+
+.description {
+  color: #aaa;
 }
\ No newline at end of file
diff --git a/src/scenes/Dashboard/Dashboard.js b/src/scenes/Dashboard/Dashboard.js
index 7793b6b85..f5f895905 100644
--- a/src/scenes/Dashboard/Dashboard.js
+++ b/src/scenes/Dashboard/Dashboard.js
@@ -3,6 +3,7 @@ import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import { fetchAtlasesAsync } from 'actions/AtlasActions';
 
+import Flex from 'components/Flex';
 import Layout from 'components/Layout';
 import AtlasPreview from 'components/AtlasPreview';
 import AtlasPreviewLoading from 'components/AtlasPreviewLoading';
@@ -22,11 +23,13 @@ class Dashboard extends React.Component {
     return (
       <Layout>
         <CenteredContent>
-          { this.props.isLoading ? (
-            <AtlasPreviewLoading />
-          ) : this.props.items.map((item) => {
-           return  (<AtlasPreview data={ item } />);
-          }) }
+          <Flex direction="column" flex={ true }>
+            { this.props.isLoading ? (
+              <AtlasPreviewLoading />
+            ) : this.props.items.map((item) => {
+             return  (<AtlasPreview data={ item } />);
+            }) }
+          </Flex>
         </CenteredContent>
       </Layout>
     );