Use container all around to improve look.

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}) => (
+            <Container>
               <Contact contact={addressBookItems.get(match.params.contactUid)} />
+            </Container>
           )}
         />
         <Route
           path={routeResolver.getRoute('pim.events._id')}
           exact={true}
           render={({match}) => (
+            <Container>
               <Event event={calendarItems.get(match.params.eventUid)} />
+            </Container>
           )}
         />
       </Switch>

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}
         >
+          <Container>
             <AddressBook entries={this.props.contacts} onItemClick={this.contactClicked} />
+          </Container>
         </Tab>
         <Tab
           value={calendarTitle}
           label={calendarTitle}
         >
+          <Container>
             <PersistCalendar entries={this.props.events} onItemClick={this.eventClicked} />
+          </Container>
         </Tab>
       </Tabs>
     );