Adding opening components & styles
This commit is contained in:
apanizo
parent
c9c5d1fed7
commit
a6bd62fabf
|
|
@ -4,7 +4,7 @@ import Loadable from 'react-loadable'
|
|||
import { Switch, Redirect, Route } from 'react-router-dom'
|
||||
import Loader from '~/components/Loader'
|
||||
import Welcome from './welcome/container'
|
||||
import { SAFELIST_ADDRESS, OPEN_ADDRESS, SAFE_PARAM_ADDRESS, WELCOME_ADDRESS, SETTINS_ADDRESS } from './routes'
|
||||
import { SAFELIST_ADDRESS, OPEN_ADDRESS, SAFE_PARAM_ADDRESS, WELCOME_ADDRESS, SETTINS_ADDRESS, OPENING_ADDRESS } from './routes'
|
||||
|
||||
const Safe = Loadable({
|
||||
loader: () => import('./safe/container'),
|
||||
|
|
@ -26,6 +26,11 @@ const Open = Loadable({
|
|||
loading: Loader,
|
||||
})
|
||||
|
||||
const Opening = Loadable({
|
||||
loader: () => import('./opening'),
|
||||
loading: Loader,
|
||||
})
|
||||
|
||||
const SAFE_ADDRESS = `${SAFELIST_ADDRESS}/:${SAFE_PARAM_ADDRESS}`
|
||||
const SAFE_SETTINGS = `${SAFE_ADDRESS}${SETTINS_ADDRESS}`
|
||||
|
||||
|
|
@ -39,6 +44,7 @@ const Routes = () => (
|
|||
<Route exact path={SAFELIST_ADDRESS} component={SafeList} />
|
||||
<Route exact path={SAFE_ADDRESS} component={Safe} />
|
||||
<Route exact path={SAFE_SETTINGS} component={Settings} />
|
||||
<Route exact path={OPENING_ADDRESS} component={Opening} />
|
||||
</Switch>
|
||||
)
|
||||
|
||||
|
|
|
|||
|
|
@ -42,7 +42,13 @@ export const createSafe = async (values: Object, userAccount: string, addSafe: A
|
|||
addSafe(name, safeContract.address, numConfirmations, dailyLimit, owners, accounts)
|
||||
|
||||
if (stillInOpeningView()) {
|
||||
const url = `${SAFELIST_ADDRESS}/${safeContract.address}`
|
||||
const url = {
|
||||
pathname: `${SAFELIST_ADDRESS}/${safeContract.address}`,
|
||||
state: {
|
||||
name,
|
||||
},
|
||||
}
|
||||
|
||||
history.push(url)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,12 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="111" height="91" viewBox="0 0 111 91">
|
||||
<g fill="none" fill-rule="evenodd">
|
||||
<g fill="#A2A8BA">
|
||||
<path d="M6.535 81.666h9.8V78.4h-9.8v3.266zm64.131-6.535h-67.4V3.266H94.73l.003 47.754c.203-.004.403-.015.608-.015.898 0 1.785.051 2.659.144V0H0v78.4h3.265v6.535H19.6V78.4h51.202c-.097-.888-.15-1.79-.15-2.705 0-.189.01-.376.014-.564z"/>
|
||||
<path d="M9.8 68.582L9.816 9.8l78.385.015v4.885h-1.635a1.64 1.64 0 0 0-1.635 1.634c0 .9.736 1.635 1.635 1.635H88.2v1.634h-1.635a1.64 1.64 0 0 0-1.635 1.635c0 .9.736 1.635 1.635 1.635H88.2v29.184c1.06-.32 2.15-.572 3.266-.748V22.866c.899 0 1.634-.736 1.634-1.634 0-.9-.735-1.635-1.634-1.635v-1.635a1.64 1.64 0 0 0 1.634-1.635c0-.9-.735-1.635-1.634-1.635V9.816a3.284 3.284 0 0 0-3.281-3.285H9.816a3.283 3.283 0 0 0-3.281 3.285v58.766a3.283 3.283 0 0 0 3.28 3.284H70.95c.173-1.114.423-2.2.74-3.26L9.8 68.582z"/>
|
||||
<path d="M60.435 42.466A3.276 3.276 0 0 1 57.17 39.2a3.276 3.276 0 0 1 3.265-3.266 3.277 3.277 0 0 1 3.266 3.266 3.276 3.276 0 0 1-3.266 3.265m0-9.8a6.533 6.533 0 0 0-6.535 6.535 6.534 6.534 0 0 0 6.535 6.535 6.535 6.535 0 0 0 0-13.069"/>
|
||||
<path d="M75.136 40.832h1.55a16.242 16.242 0 0 1-3.61 8.689l-1.095-1.095a1.633 1.633 0 0 0-2.305 0 1.634 1.634 0 0 0 0 2.305l1.095 1.095a16.303 16.303 0 0 1-8.69 3.61l.004-1.535c0-.9-.735-1.635-1.634-1.635-.9 0-1.635.736-1.635 1.635v1.55a16.249 16.249 0 0 1-8.69-3.61l1.095-1.095a1.631 1.631 0 0 0 0-2.304 1.63 1.63 0 0 0-2.305 0l-1.095 1.095a16.303 16.303 0 0 1-3.61-8.69l1.524.004c.9 0 1.634-.735 1.634-1.635s-.734-1.634-1.634-1.634h-1.55a16.25 16.25 0 0 1 3.61-8.69l1.095 1.094c.325.325.734.475 1.16.475.424 0 .834-.165 1.159-.475a1.63 1.63 0 0 0 0-2.305l-1.095-1.095a16.309 16.309 0 0 1 8.69-3.61l-.003 1.524c0 .9.734 1.635 1.634 1.635.9 0 1.635-.734 1.635-1.635v-1.55a16.254 16.254 0 0 1 8.69 3.61l-1.095 1.095a1.63 1.63 0 0 0 0 2.304c.326.326.735.475 1.16.475a1.67 1.67 0 0 0 1.16-.475l1.095-1.094a16.3 16.3 0 0 1 3.61 8.69l-1.554-.004c-.9 0-1.635.734-1.635 1.634a1.65 1.65 0 0 0 1.635 1.647M74.3 25.347c-.015-.016-.035-.016-.05-.035-3.56-3.525-8.426-5.71-13.816-5.71-5.39 0-10.256 2.189-13.8 5.7-.016.014-.035.014-.05.033-.016.015-.016.034-.035.05-3.53 3.557-5.715 8.426-5.715 13.816 0 5.39 2.19 10.256 5.7 13.8.015.016.015.034.034.05.016.015.035.015.05.034 3.557 3.526 8.426 5.716 13.816 5.716 5.39 0 10.256-2.19 13.8-5.7.016-.016.035-.016.051-.035.015-.015.015-.034.034-.049 3.525-3.56 5.716-8.427 5.716-13.816 0-5.39-2.19-10.26-5.701-13.804-.015-.016-.015-.035-.034-.05M17.966 22.862c-.9 0-1.635.735-1.635 1.634v32.666c0 .9.734 1.635 1.635 1.635.899 0 1.634-.735 1.634-1.635v-1.634c.9 0 1.635-.736 1.635-1.635 0-.9-.735-1.635-1.635-1.635V29.4c.9 0 1.635-.734 1.635-1.634 0-.9-.735-1.635-1.635-1.635v-1.635c0-.898-.735-1.634-1.634-1.634M26.135 22.866c-.9 0-1.635.735-1.635 1.634v1.636c-.9 0-1.635.734-1.635 1.634 0 .9.736 1.634 1.635 1.634V52.27c-.9 0-1.635.735-1.635 1.634 0 .9.736 1.636 1.635 1.636v1.634c0 .9.735 1.635 1.635 1.635s1.634-.735 1.634-1.635L27.765 24.5c0-.899-.734-1.634-1.63-1.634"/>
|
||||
</g>
|
||||
<path stroke="#467EE5" stroke-width="3" d="M93.756 58.266c-8.466 0-15.361 6.896-15.361 15.362 0 8.466 6.895 15.36 15.361 15.36 8.466 0 15.361-6.894 15.361-15.36s-6.895-15.362-15.361-15.362z"/>
|
||||
<path fill="#467EE5" fill-rule="nonzero" d="M93.68 68.471h-3.06v10.313h8.39v-3.06h-5.33z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.3 KiB |
|
|
@ -0,0 +1,46 @@
|
|||
// @flow
|
||||
import * as React from 'react'
|
||||
import Block from '~/components/layout/Block'
|
||||
import Paragraph from '~/components/layout/Paragraph'
|
||||
import LinearProgress from '@material-ui/core/LinearProgress'
|
||||
import { withStyles } from '@material-ui/core/styles'
|
||||
import Img from '~/components/layout/Img'
|
||||
import Page from '~/components/layout/Page'
|
||||
|
||||
type Props = {
|
||||
name: string,
|
||||
classes: Object,
|
||||
}
|
||||
|
||||
const vault = require('./assets/vault.svg')
|
||||
|
||||
const styles = {
|
||||
page: {
|
||||
letterSpacing: '-1px',
|
||||
},
|
||||
}
|
||||
|
||||
const Opening = ({ classes, name = 'Safe creation process' }: Props) => (
|
||||
<Page align="center">
|
||||
<Paragraph className={classes.page} color="secondary" size="xxl" weight="bolder" align="center">
|
||||
{name}
|
||||
</Paragraph>
|
||||
<Block margin="lg" align="center">
|
||||
<Img src={vault} height={90} alt="Vault" />
|
||||
</Block>
|
||||
<Block margin="lg">
|
||||
<LinearProgress color="secondary" />
|
||||
</Block>
|
||||
<Paragraph className={classes.page} noMargin size="xl" align="center">
|
||||
Transaction submitted
|
||||
</Paragraph>
|
||||
<Paragraph className={classes.page} noMargin size="xl" align="center" weight="bolder">
|
||||
Deploying your new Safe...
|
||||
</Paragraph>
|
||||
<Paragraph size="md" align="center" weight="light">
|
||||
This process should take a couple of minutes. <br />
|
||||
</Paragraph>
|
||||
</Page>
|
||||
)
|
||||
|
||||
export default withStyles(styles)(Opening)
|
||||
|
|
@ -42,7 +42,8 @@ module.exports = Object.assign({}, {
|
|||
smallFontSize: '11px',
|
||||
mediumFontSize: '13px',
|
||||
largeFontSize: '15px',
|
||||
extraLargeFontSize: '24px',
|
||||
extraLargeFontSize: '18px',
|
||||
xxlFontSize: '32px',
|
||||
screenXs: 480,
|
||||
screenXsMax: 767,
|
||||
screenSm: 768,
|
||||
|
|
|
|||
Loading…
Reference in New Issue