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/NewDevice.js b/smart-hut/src/components/dashboard/devices/NewDevice.js index d150a50..4a7cb3b 100644 --- a/smart-hut/src/components/dashboard/devices/NewDevice.js +++ b/smart-hut/src/components/dashboard/devices/NewDevice.js @@ -213,7 +213,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..218da49 100644 --- a/smart-hut/src/components/dashboard/devices/VideocamModal.js +++ b/smart-hut/src/components/dashboard/devices/VideocamModal.js @@ -2,24 +2,35 @@ 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 ReactModalPortal = { + opacity: 0 }; +const ReactModal__Overlay = { + alignItems: 'center', + display: 'flex', + justifyContent: 'center', + transition: 'opacity 200ms ease-in-out' +}; + +const modal = { + background: 'grey', + color: 'white', + maxWidth: '2rem', + outline: 'none', + padding: '2rem', + textAlign: 'center' +}; + + + + const VideocamModal = (props) => ( {props.selectedVideo && (