diff --git a/src/App.js b/src/App.js
index 5f4cdf8..ecaee78 100644
--- a/src/App.js
+++ b/src/App.js
@@ -7,14 +7,13 @@ import Timeline from './components/Timeline';
class App extends Component {
render() {
console.log(timelineData);
-
- // Customize the code below
return (
- Application title
+ Code Monkey
+
);
diff --git a/src/components/Timeline.css b/src/components/Timeline.css
index e31f946..bd1f418 100644
--- a/src/components/Timeline.css
+++ b/src/components/Timeline.css
@@ -2,4 +2,5 @@
width: 30%;
margin: auto;
text-align: left;
+ list-style-type: none;
}
diff --git a/src/components/Timeline.js b/src/components/Timeline.js
index 624d4ec..c4ca095 100644
--- a/src/components/Timeline.js
+++ b/src/components/Timeline.js
@@ -2,9 +2,26 @@ import React from 'react';
import './Timeline.css';
import TimelineEvent from './TimelineEvent';
-const Timeline = () => {
- // Fill in your code here
- return;
+const Timeline = (props) => {
+
+ const timelineComponents = props.events.map( (event, i) => {
+ return (
+
+
+
+ );
+ });
+
+ return (
+
+
+ { timelineComponents }
+
+
+ );
}
export default Timeline;
diff --git a/src/components/TimelineEvent.js b/src/components/TimelineEvent.js
index 9079165..23f8200 100644
--- a/src/components/TimelineEvent.js
+++ b/src/components/TimelineEvent.js
@@ -2,9 +2,20 @@ import React from 'react';
import './TimelineEvent.css';
import Timestamp from './Timestamp';
-const TimelineEvent = () => {
- // Fill in your code here
- return;
+const TimelineEvent = (props) => {
+ return (
+
+
+ {props.person}
+
+
+ {props.status}
+
+
+
+
+
+ );
}
export default TimelineEvent;