diff --git a/smart-hut/public/img/security-icon.png b/smart-hut/public/img/security-icon.png new file mode 100644 index 0000000..652ce35 Binary files /dev/null and b/smart-hut/public/img/security-icon.png differ diff --git a/smart-hut/src/components/dashboard/devices/Curtains.css b/smart-hut/src/components/dashboard/devices/Curtains.css index c4ec319..5d1939b 100644 --- a/smart-hut/src/components/dashboard/devices/Curtains.css +++ b/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%; diff --git a/smart-hut/src/components/dashboard/devices/NewDevice.js b/smart-hut/src/components/dashboard/devices/NewDevice.js index 7897c9e..2120ba0 100644 --- a/smart-hut/src/components/dashboard/devices/NewDevice.js +++ b/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 = [ diff --git a/smart-hut/src/components/dashboard/devices/VideocamModal.js b/smart-hut/src/components/dashboard/devices/VideocamModal.js index 7a1e553..1062fac 100644 --- a/smart-hut/src/components/dashboard/devices/VideocamModal.js +++ b/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 && ( -