Merge branch 'dev-copy' into 'dev'

Dev copy

See merge request sa4-2020/the-sanmarinoes/frontend!107

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 = {
-  content: {
-    top: "20%",
-    left: "45%",
-    right: "auto",
-    bottom: "auto",
-    marginRight: "-40%",
-    width: "80%",
-    transform: "translate(-40%, -10%)",
-  },
+const modal = {
+  opacity: 0,
+  alignItems: "center",
+  display: "flex",
+  justifyContent: "center",
+  transition: "opacity 200ms ease-in-out",
+  background: "grey",
+  color: "white",
+  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);
   }