Added Typography to SightingDetail

src/components/SightingDetail.js

@@ -2,6 +2,12 @@ import React, { Component, Fragment } from 'react';
 import Disqus from 'disqus-react';
 import moment from 'moment';
 import SightingDetailMap from './SightingDetailMap';
+import Typography from '@material-ui/core/Typography';
+import { withStyles } from '@material-ui/core/styles';
+import PropTypes from 'prop-types';
+
+const styles = theme => ({
+});
 
 /** 
   * Types of sightings. Label is what is
@@ -143,6 +149,7 @@ class SightingDetail extends Component {
         return (
             <Fragment>
                 <SightingDetailMap lat={this.props.detail.lat} lng={this.props.detail.lng} />
+                <Typography component="div">
                 <div className='sighting-details-content'>
                     <p><b>Type:</b> {this.getType(this.props.detail.type)}</p>
                     <p><b>When:</b> {this.formatDate(this.props.detail.date)}, {this.getTime(this.props.detail.time)}</p>
@@ -152,9 +159,14 @@ class SightingDetail extends Component {
                     <p>{`${this.props.detail.desc}`}</p>
                 </div>
                     <Disqus.DiscussionEmbed shortname={disqusShortname} config={disqusConfig} />
+                </Typography>
             </Fragment>
         );
     }
 }
 
-export default SightingDetail;
+SightingDetail.propTypes = {
+    classes: PropTypes.object.isRequired,
+};
+
+export default withStyles(styles)(SightingDetail);