Fixed videocamera

smart-hut/src/components/dashboard/devices/Curtains.css

@@ -4,6 +4,10 @@
   box-sizing: border-box;
 }
 
+body {
+  overflow-y: hidden;
+}
+
 .container.curtain-container {
   position: relative;
   margin-top: 10%;

smart-hut/src/components/dashboard/devices/NewDevice.js

@@ -207,7 +207,7 @@ class NewDevice extends Component {
         key: "securityCamera",
         text: "Security Camera",
         value: "securityCamera",
-        image: { avatar: true, src: "/img/plusMinus.svg" },
+        image: { avatar: true, src: "/img/security-icon.png" },
       },
     ];
     const sensorOptions = [

smart-hut/src/components/dashboard/devices/VideocamModal.js

@@ -2,16 +2,19 @@ import React from "react";
 import Modal from "react-modal";
 import { Button } from "semantic-ui-react";
 
-const ModalStyle = {
+const modal = {
-  content: {
+  opacity: 0,
-    top: "20%",
+  alignItems: "center",
-    left: "45%",
+  display: "flex",
-    right: "auto",
+  justifyContent: "center",
-    bottom: "auto",
+  transition: "opacity 200ms ease-in-out",
-    marginRight: "-40%",
+  background: "grey",
-    width: "80%",
+  color: "white",
-    transform: "translate(-40%, -10%)",
+  maxWidth: "2rem",
-  },
+  outline: "none",
+  padding: "2rem",
+  textAlign: "center",
+  maxHeight: "50vh",
 };
 
 const VideocamModal = (props) => (
@@ -19,10 +22,10 @@ const VideocamModal = (props) => (
     isOpen={!!props.selectedVideo}
     contentLabel="Live Cam"
     onRequestClose={props.closeModal}
-    style={ModalStyle}
+    style={modal}
   >
     {props.selectedVideo && (
-      <video autoPlay loop muted width="100%" height="auto">
+      <video autoPlay loop muted width="100%" height="90%">
         <source src={props.url} type="video/mp4" />
       </video>
     )}

smart-hut/src/views/Dashboard.js

@@ -21,7 +21,7 @@ class Dashboard extends Component {
     super(props);
     this.state = this.initialState;
     this.setInitialState();
-    this.activeTab = "Automations"; //TODO Remove this to not put automations first
+    this.activeTab = "Devices";
     this.selectTab = this.selectTab.bind(this);
   }