From 6c96d7994f680ea552278ef05b02e5068eb20287 Mon Sep 17 00:00:00 2001
From: Tom Hacohen <tom@stosb.com>
Date: Mon, 4 Dec 2017 17:16:21 +0000
Subject: [PATCH] Improve the look of the journals page.

---
 src/JournalList.tsx | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/JournalList.tsx b/src/JournalList.tsx
index bdbfa64..fd982f1 100644
--- a/src/JournalList.tsx
+++ b/src/JournalList.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { Link } from 'react-router-dom';
 
 import { List, ListItem } from 'material-ui/List';
+import Paper from 'material-ui/Paper';
 
 import { EteSyncContextType } from './EteSyncContext';
 import * as EteSync from './api/EteSync';
@@ -61,8 +62,20 @@ export class JournalList extends React.Component {
       { CALENDAR: [],
         ADDRESS_BOOK: []});
 
+    const styles = {
+      holder: {
+        margin: 'auto',
+        maxWidth: 400,
+        padding: 20,
+      },
+      paper: {
+        padding: 20,
+      },
+    };
+
     return (
-      <div>
+      <div style={styles.holder}>
+      <Paper style={styles.paper} zDepth={2}>
         <h2>Address Books</h2>
         <List>
           {journalMap.ADDRESS_BOOK}
@@ -72,6 +85,7 @@ export class JournalList extends React.Component {
         <List>
           {journalMap.CALENDAR}
         </List>
+      </Paper>
       </div>
     );
   }