diff --git a/sensorgriddashboard/package-lock.json b/sensorgriddashboard/package-lock.json
index 22bb2cb..90f3bf1 100644
--- a/sensorgriddashboard/package-lock.json
+++ b/sensorgriddashboard/package-lock.json
@@ -1789,21 +1789,6 @@
         "restore-cursor": "2.0.0"
       }
     },
-    "cli-table": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
-      "integrity": "sha1-9TsFJmqLGguTSz0IIebi3FkUriM=",
-      "requires": {
-        "colors": "1.0.3"
-      },
-      "dependencies": {
-        "colors": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
-          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
-        }
-      }
-    },
     "cli-width": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.2.0.tgz",
@@ -3851,14 +3836,6 @@
         "locate-path": "2.0.0"
       }
     },
-    "flat": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/flat/-/flat-2.0.1.tgz",
-      "integrity": "sha1-cOKRiKdL4MPIlAnu0fqVd5B64y8=",
-      "requires": {
-        "is-buffer": "1.1.6"
-      }
-    },
     "flat-cache": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-1.3.0.tgz",
@@ -6335,11 +6312,6 @@
       "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
       "integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY="
     },
-    "lodash.clonedeep": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
-      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
-    },
     "lodash.cond": {
       "version": "4.5.2",
       "resolved": "https://registry.npmjs.org/lodash.cond/-/lodash.cond-4.5.2.tgz",
@@ -6355,11 +6327,6 @@
       "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
       "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8="
     },
-    "lodash.get": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
-      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
-    },
     "lodash.isfunction": {
       "version": "3.0.9",
       "resolved": "https://registry.npmjs.org/lodash.isfunction/-/lodash.isfunction-3.0.9.tgz",
@@ -6375,11 +6342,6 @@
       "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
     },
-    "lodash.set": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/lodash.set/-/lodash.set-4.3.2.tgz",
-      "integrity": "sha1-2HV7HagH3eJIFrDWqEvqGnYjCyM="
-    },
     "lodash.template": {
       "version": "4.4.0",
       "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-4.4.0.tgz",
@@ -9322,6 +9284,11 @@
         "svg-path-bounding-box": "1.0.4"
       },
       "dependencies": {
+        "colors": {
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
+          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
+        },
         "d3-array": {
           "version": "1.2.0",
           "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-1.2.0.tgz",
@@ -9403,6 +9370,39 @@
             "lodash.set": "4.3.2",
             "lodash.uniq": "4.5.0",
             "path-is-absolute": "1.0.1"
+          },
+          "dependencies": {
+            "cli-table": {
+              "version": "0.3.1",
+              "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
+              "integrity": "sha1-9TsFJmqLGguTSz0IIebi3FkUriM=",
+              "requires": {
+                "colors": "1.0.3"
+              }
+            },
+            "flat": {
+              "version": "2.0.1",
+              "resolved": "https://registry.npmjs.org/flat/-/flat-2.0.1.tgz",
+              "integrity": "sha1-cOKRiKdL4MPIlAnu0fqVd5B64y8=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            },
+            "lodash.clonedeep": {
+              "version": "4.5.0",
+              "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
+              "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
+            },
+            "lodash.get": {
+              "version": "4.4.2",
+              "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
+              "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
+            },
+            "lodash.set": {
+              "version": "4.3.2",
+              "resolved": "https://registry.npmjs.org/lodash.set/-/lodash.set-4.3.2.tgz",
+              "integrity": "sha1-2HV7HagH3eJIFrDWqEvqGnYjCyM="
+            }
           }
         }
       }
diff --git a/sensorgriddashboard/src/components/Battery.js b/sensorgriddashboard/src/components/Battery.js
index b3e339a..9f645a6 100644
--- a/sensorgriddashboard/src/components/Battery.js
+++ b/sensorgriddashboard/src/components/Battery.js
@@ -7,7 +7,8 @@ import {
     ListGroup,
     ListGroupItem,
     Progress,
-    Table
+    Table,
+    Card
 } from 'reactstrap';
 //import * as FontAwesome from 'react-icons/lib/fa'
 import { FaBattery4, FaBattery2, FaBattery1, FaSignal, FaCheckCircle, FaExclamationCircle } from 'react-icons/lib/fa';
@@ -37,9 +38,10 @@ class Battery extends Component {
 
     render() {
         console.log('battery', this.props.data)
-        
+
         return (
             <div>
+              <Card>
                 <Table hover id = "summary">
                     <thead>
                         <tr>
@@ -68,6 +70,18 @@ class Battery extends Component {
                             <td><FaSignal size="30px" color = "red"/></td>
                             <td><FaCheckCircle size = "35px"/></td>
                         </tr>
+                        <tr>
+                            <th scope="row">4</th>
+                            <td>{this.getBattery(this.state.data[3])}</td>
+                            <td><FaSignal size="30px"/></td>
+                            <td><FaCheckCircle size = "35px" color = "red"/></td>
+                        </tr>
+                        <tr>
+                            <th scope="row">5</th>
+                            <td>{this.getBattery(this.state.data[4])}</td>
+                            <td><FaSignal size="30px"/></td>
+                            <td><FaCheckCircle size = "35px"/></td>
+                        </tr>
                     </tbody>
                 </Table>
 
@@ -75,6 +89,7 @@ class Battery extends Component {
                 <div>
 
                 </div>
+              </Card>
             </div>
         )
     }
diff --git a/sensorgriddashboard/src/components/HomePage.js b/sensorgriddashboard/src/components/HomePage.js
index 6dc3586..02739af 100644
--- a/sensorgriddashboard/src/components/HomePage.js
+++ b/sensorgriddashboard/src/components/HomePage.js
@@ -79,7 +79,7 @@ class HomePage extends Component {
           <Collapse isOpen={this.state.isOpen} navbar>
             <Nav className="ml-auto" navbar>
               <NavItem>
-                <NavLink href="/components/">Components</NavLink>
+                <NavLink href="https://sensorgridapi.knightlab.com/sensordata/">API</NavLink>
               </NavItem>
               <NavItem>
                 <NavLink href="https://github.com/NUKnightLab/SensorGridAPI">Github</NavLink>
@@ -90,10 +90,13 @@ class HomePage extends Component {
         <Container>
           <Row>
             <Col>
+
               <Battery data={this.state.batteryArr}/>
+
             </Col>
             <Col>
               <TabContainer />
+
             </Col>
           </Row>
         </Container>
diff --git a/sensorgriddashboard/src/components/MyGoogleMap.js b/sensorgriddashboard/src/components/MyGoogleMap.js
index 8a2ce85..589219c 100644
--- a/sensorgriddashboard/src/components/MyGoogleMap.js
+++ b/sensorgriddashboard/src/components/MyGoogleMap.js
@@ -14,7 +14,7 @@ const MapWithAMarkerClusterer = compose(
     googleMapURL: "https://maps.googleapis.com/maps/api/js?key=AIzaSyC4R6AN7SmujjPUIGKdyao2Kqitzr1kiRg&v=3.exp&libraries=geometry,drawing,places",
     loadingElement: <div style={{ height: `100%` }} />,
 
-    containerElement: <div style={{ height: `400px`, width: '450px', position: `fixed`, left: `10px`, top: '360px'  }} />,
+    containerElement: <div style={{ height: `400px`, width: '450px'  }} />,
     mapElement: <div style={{ height: `100%` }} />,
   }),
   withHandlers({
@@ -31,10 +31,10 @@ const MapWithAMarkerClusterer = compose(
     defaultZoom={10}
     defaultCenter={{ lat: 42.050691, lng: -87.67416 }}
   >
-    <MarkerClusterer onClick={props.onMarkerClustererClick}  averageCenter  enableRetinaIcons  
+    <MarkerClusterer onClick={props.onMarkerClustererClick}  averageCenter  enableRetinaIcons
     gridSize={60}>
       {props.markers.map(marker => (
-        
+
         <Marker key={marker.sensor_id} position={{ lat: marker.latitude, lng: marker.longitude }}/>
       ))}
     </MarkerClusterer>
@@ -70,4 +70,4 @@ class MyGoogleMap extends React.PureComponent {
   }
 }
 
-export default MyGoogleMap
\ No newline at end of file
+export default MyGoogleMap
diff --git a/sensorgriddashboard/src/components/TimeSeries.css b/sensorgriddashboard/src/components/TimeSeries.css
index 7dc04b2..e669f6b 100644
--- a/sensorgriddashboard/src/components/TimeSeries.css
+++ b/sensorgriddashboard/src/components/TimeSeries.css
@@ -20,7 +20,7 @@
     width: 700px
   }
 .time-series-card {
-  width: 1060px;
+  width: 600px;
   height: 550px;
   padding-bottom: 20px;
   margin-left: 15px;
@@ -30,4 +30,4 @@
 .card-title {
   margin-top: 10px;
   margin-left: 10px;
-}
\ No newline at end of file
+}
diff --git a/sensorgriddashboard/src/components/TimeSeries.js b/sensorgriddashboard/src/components/TimeSeries.js
index 4f244c9..926c427 100644
--- a/sensorgriddashboard/src/components/TimeSeries.js
+++ b/sensorgriddashboard/src/components/TimeSeries.js
@@ -21,7 +21,7 @@ render() {
               <CardTitle className='card-title'>Sensor Grid Time Series Data</CardTitle>
               <CardSubtitle className='card-title'>Data 1 Measurements</CardSubtitle>
                 <XYFrame
-                  size={[1050, 500]}
+                  size={[600, 300]}
                   lines={this.props.displayData}
                   lineDataAccessor={"data"}
                   lineStyle={d => ({ fill: d.color, fillOpacity: 0.5, stroke: d.color, strokeWidth: '3px' })}