diff --git a/src/components/SightingDetail.js b/src/components/SightingDetail.js index fb3f6a5..cb6f335 100644 --- a/src/components/SightingDetail.js +++ b/src/components/SightingDetail.js @@ -2,13 +2,19 @@ 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 * viewed in the application, value is * what is stored in the database. */ - const sightingTypes = [ +const sightingTypes = [ { value: 'visual', label: 'Visual', @@ -143,18 +149,24 @@ class SightingDetail extends Component { return ( +

Type: {this.getType(this.props.detail.type)}

When: {this.formatDate(this.props.detail.date)}, {this.getTime(this.props.detail.time)}

Where: {this.props.detail.lat} degrees N, and {this.props.detail.lng} degrees E

I am confident of my sighting: {this.getConfidence(this.props.detail.confidence)}

-
+

{`${this.props.detail.desc}`}

- + +
); } } -export default SightingDetail; \ No newline at end of file +SightingDetail.propTypes = { + classes: PropTypes.object.isRequired, +}; + +export default withStyles(styles)(SightingDetail); \ No newline at end of file