diff --git a/src/components/MainCointainer.jsx b/src/components/MainCointainer.jsx index 8f0319f..efac938 100644 --- a/src/components/MainCointainer.jsx +++ b/src/components/MainCointainer.jsx @@ -25,6 +25,8 @@ import ProjectIcon from '@material-ui/icons/Work'; import { ScaleLoader } from 'react-spinners' import Loading from '../components/base/Loading' import assemble from '../images/assemble.png' +import alert from './image/alert.png' +import subtract from './image/Subtract.png' const About = lazy(() => import('./About.jsx')) const ListProjects = lazy(() => import('./projects/ListProjects')) @@ -75,6 +77,10 @@ const useStyles = makeStyles(theme => ({ assemble:{ marginRight: '0.4em' }, + alert: { + height: '50%', + gridColumn: '11 / 12' + }, accountText: { color: '#939BA1' }, @@ -108,6 +114,21 @@ const useStyles = makeStyles(theme => ({ hide: { display: 'none', }, + disclaimer: { + position: 'fixed', + top: 0, + left: 0, + zIndex: 999, + width: '100%', + background: '#F5F7F8', + height: '3rem', + display: 'grid', + gridTemplateColumns: 'repeat(48, [col] 1fr)', + alignItems: 'center' + }, + disclaimerText: { + gridColumn: '13 / 43' + }, drawer: { width: drawerWidth, flexShrink: 0, @@ -140,6 +161,16 @@ const useStyles = makeStyles(theme => ({ }, link: { textDecoration: 'none' + }, + top: { + top: '3rem' + }, + marginTop: { + marginTop: '3rem' + }, + subtract: { + height: '40%', + gridColumn: '45 / 47' } })) @@ -161,6 +192,7 @@ MenuItem.propTypes = { function PersistentDrawerLeft({ loading, account, children, enableEthereum, location: { pathname, search } }) { const [open, setOpen] = useState(false) + const [showDisclaimer, setDisclaimer] = useState(false) const [queryParams, setQueryParams] = useState({}) const [logs, setLogs] = useState([]) const position = useWindowScrollPosition() @@ -185,6 +217,12 @@ function PersistentDrawerLeft({ loading, account, children, enableEthereum, loca setQueryParams({ queryParams }) }, [search]) + useEffect(() => { + const ack = sessionStorage.getItem('disclaimer') + if (ack) setDisclaimer(false) + else setDisclaimer(true) + }, []) + const enableLogs = () => { Hook(window.console, log => { setLogs(({ logs }) => ({ logs: [Decode(log), ...logs] })) @@ -199,6 +237,11 @@ function PersistentDrawerLeft({ loading, account, children, enableEthereum, loca setOpen({ open: false }) }; + const closeDisclaimer = () => { + sessionStorage.setItem('disclaimer', true); + setDisclaimer(false) + } + const classes = useStyles() const isHome = pathname === "/" const popoverPosition = position.y < 100 @@ -206,11 +249,17 @@ function PersistentDrawerLeft({ loading, account, children, enableEthereum, loca return (
+ {showDisclaimer &&
+ + Use at your own risk. This dapp has not been audited. We recommend to limit funding amounts at this stage. + +
} @@ -218,7 +267,9 @@ function PersistentDrawerLeft({ loading, account, children, enableEthereum, loca color="inherit" aria-label="Open drawer" onClick={handleDrawerOpen} - className={classNames(classes.menuButton, open && !loading && classes.hide)}> + className={classNames(classes.menuButton, { + [classes.hide]: open && !loading + })}> {loading &&
-
+
}> diff --git a/src/components/image/Subtract.png b/src/components/image/Subtract.png new file mode 100644 index 0000000..7aa21c4 Binary files /dev/null and b/src/components/image/Subtract.png differ diff --git a/src/components/image/alert.png b/src/components/image/alert.png new file mode 100644 index 0000000..0baa329 Binary files /dev/null and b/src/components/image/alert.png differ