From 1987ea126d078e34fcb6b8a95cbcb35437e81868 Mon Sep 17 00:00:00 2001
From: Tom Hacohen <tom@stosb.com>
Date: Fri, 8 Dec 2017 17:07:27 +0000
Subject: [PATCH] Use container all around to improve look.

---
 src/Pim.tsx     | 10 ++++++++--
 src/PimMain.tsx | 10 ++++++++--
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/Pim.tsx b/src/Pim.tsx
index d656414..1868ad5 100644
--- a/src/Pim.tsx
+++ b/src/Pim.tsx
@@ -3,6 +3,8 @@ import { Route, Switch } from 'react-router';
 
 import * as EteSync from './api/EteSync';
 
+import Container from './Container';
+
 import Contact from './Contact';
 import Event from './Event';
 import PimMain from './PimMain';
@@ -82,14 +84,18 @@ class Pim extends React.Component {
           path={routeResolver.getRoute('pim.contacts._id')}
           exact={true}
           render={({match}) => (
-            <Contact contact={addressBookItems.get(match.params.contactUid)} />
+            <Container>
+              <Contact contact={addressBookItems.get(match.params.contactUid)} />
+            </Container>
           )}
         />
         <Route
           path={routeResolver.getRoute('pim.events._id')}
           exact={true}
           render={({match}) => (
-            <Event event={calendarItems.get(match.params.eventUid)} />
+            <Container>
+              <Event event={calendarItems.get(match.params.eventUid)} />
+            </Container>
           )}
         />
       </Switch>
diff --git a/src/PimMain.tsx b/src/PimMain.tsx
index 665cec6..31ef9eb 100644
--- a/src/PimMain.tsx
+++ b/src/PimMain.tsx
@@ -3,6 +3,8 @@ import { Tabs, Tab } from 'material-ui/Tabs';
 
 import * as ICAL from 'ical.js';
 
+import Container from './Container';
+
 import AddressBook from './AddressBook';
 import Calendar from './Calendar';
 
@@ -60,13 +62,17 @@ class PimMain extends React.Component {
           value={addressBookTitle}
           label={addressBookTitle}
         >
-          <AddressBook entries={this.props.contacts} onItemClick={this.contactClicked} />
+          <Container>
+            <AddressBook entries={this.props.contacts} onItemClick={this.contactClicked} />
+          </Container>
         </Tab>
         <Tab
           value={calendarTitle}
           label={calendarTitle}
         >
-          <PersistCalendar entries={this.props.events} onItemClick={this.eventClicked} />
+          <Container>
+            <PersistCalendar entries={this.props.events} onItemClick={this.eventClicked} />
+          </Container>
         </Tab>
       </Tabs>
     );