Open style changes
This commit is contained in:
parent
3c856e7511
commit
1b4cca91a9
|
@ -13,6 +13,9 @@
|
||||||
|
|
||||||
.h2 {
|
.h2 {
|
||||||
line-height: 28px;
|
line-height: 28px;
|
||||||
|
font-weight: $bolderFont;
|
||||||
|
letter-spacing: -0.5px;
|
||||||
|
font-family: 'Roboto Mono', monospace;
|
||||||
font-size: $(fontSizeHeadingMd)px;
|
font-size: $(fontSizeHeadingMd)px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
flex: 1 0 auto;
|
flex: 1 0 auto;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding: 80px 260px 0px 260px;
|
padding: 80px 200px 0px 200px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.center {
|
.center {
|
||||||
|
|
|
@ -32,6 +32,8 @@ type Props = {
|
||||||
|
|
||||||
const iconStyle = {
|
const iconStyle = {
|
||||||
color: secondary,
|
color: secondary,
|
||||||
|
width: '32px',
|
||||||
|
height: '32px',
|
||||||
}
|
}
|
||||||
|
|
||||||
const Layout = ({
|
const Layout = ({
|
||||||
|
@ -50,7 +52,7 @@ const Layout = ({
|
||||||
<IconButton style={iconStyle} disableRipple>
|
<IconButton style={iconStyle} disableRipple>
|
||||||
<ChevronLeft />
|
<ChevronLeft />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
<Heading tag="h3">Create New Safe</Heading>
|
<Heading tag="h2">Create New Safe</Heading>
|
||||||
</Row>
|
</Row>
|
||||||
<Stepper
|
<Stepper
|
||||||
finishedButton={finishedButton}
|
finishedButton={finishedButton}
|
||||||
|
|
|
@ -27,17 +27,23 @@ const styles = () => ({
|
||||||
|
|
||||||
const SafeName = ({ classes }: Props) => (
|
const SafeName = ({ classes }: Props) => (
|
||||||
<Block className={classes.container}>
|
<Block className={classes.container}>
|
||||||
<Paragraph size="md" color="primary">
|
<Block margin="lg">
|
||||||
|
<Paragraph noMargin size="md" color="primary" weight="light">
|
||||||
This setup will create a Safe with one or more owners. Optionally give the Safe a local name.
|
This setup will create a Safe with one or more owners. Optionally give the Safe a local name.
|
||||||
By continuing you consent with the terms of use and privacy policy.
|
By continuing you consent with the terms of use and privacy policy.
|
||||||
</Paragraph>
|
</Paragraph>
|
||||||
<Paragraph size="md" color="primary" weight="bolder">
|
</Block>
|
||||||
|
<Block margin="md">
|
||||||
|
<Paragraph noMargin size="md" color="primary" weight="bolder">
|
||||||
● I understand that my funds are held securely in my Safe. They cannot be accessed by Gnosis.
|
● I understand that my funds are held securely in my Safe. They cannot be accessed by Gnosis.
|
||||||
</Paragraph>
|
</Paragraph>
|
||||||
|
</Block>
|
||||||
|
<Block margin="md">
|
||||||
<Paragraph size="md" color="primary" weight="bolder">
|
<Paragraph size="md" color="primary" weight="bolder">
|
||||||
● My Safe is a smart contract on the Ethereum blockchain.
|
● My Safe is a smart contract on the Ethereum blockchain.
|
||||||
</Paragraph>
|
</Paragraph>
|
||||||
<Block margin="md" className={classes.root}>
|
</Block>
|
||||||
|
<Block margin="lg" className={classes.root}>
|
||||||
<Field
|
<Field
|
||||||
name={FIELD_NAME}
|
name={FIELD_NAME}
|
||||||
component={TextField}
|
component={TextField}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
// @flow
|
// @flow
|
||||||
import red from '@material-ui/core/colors/red'
|
import red from '@material-ui/core/colors/red'
|
||||||
import { createMuiTheme } from '@material-ui/core/styles'
|
import { createMuiTheme } from '@material-ui/core/styles'
|
||||||
import { largeFontSize, mediumFontSize, smallFontSize, primary, secondary, md, lg, background } from './variables'
|
import { largeFontSize, mediumFontSize, smallFontSize, disabled, primary, secondary, md, lg, background } from './variables'
|
||||||
|
|
||||||
export type WithStyles = {
|
export type WithStyles = {
|
||||||
classes: Object,
|
classes: Object,
|
||||||
|
@ -30,6 +30,13 @@ export default createMuiTheme({
|
||||||
root: {
|
root: {
|
||||||
fontFamily: 'Roboto Mono, monospace',
|
fontFamily: 'Roboto Mono, monospace',
|
||||||
letterSpacing: '1px',
|
letterSpacing: '1px',
|
||||||
|
'&:disabled': {
|
||||||
|
color: disabled,
|
||||||
|
},
|
||||||
|
color: disabled,
|
||||||
|
},
|
||||||
|
disabled: {
|
||||||
|
cursor: 'pointer',
|
||||||
},
|
},
|
||||||
containedPrimary: {
|
containedPrimary: {
|
||||||
backgroundColor: secondary,
|
backgroundColor: secondary,
|
||||||
|
@ -39,6 +46,10 @@ export default createMuiTheme({
|
||||||
minHeight: '52px',
|
minHeight: '52px',
|
||||||
fontSize: mediumFontSize,
|
fontSize: mediumFontSize,
|
||||||
},
|
},
|
||||||
|
sizeSmall: {
|
||||||
|
minWidth: '130px',
|
||||||
|
fontSize: smallFontSize,
|
||||||
|
},
|
||||||
},
|
},
|
||||||
MuiStepIcon: {
|
MuiStepIcon: {
|
||||||
active: {
|
active: {
|
||||||
|
@ -73,9 +84,13 @@ export default createMuiTheme({
|
||||||
order: 1,
|
order: 1,
|
||||||
padding: `0 ${md}`,
|
padding: `0 ${md}`,
|
||||||
backgroundColor: background,
|
backgroundColor: background,
|
||||||
|
'&:$disabled': {
|
||||||
|
color: '#0000ff',
|
||||||
|
},
|
||||||
},
|
},
|
||||||
input: {
|
input: {
|
||||||
padding: 0,
|
padding: 0,
|
||||||
|
color: 'initial',
|
||||||
},
|
},
|
||||||
underline: {
|
underline: {
|
||||||
'&:before': {
|
'&:before': {
|
||||||
|
|
|
@ -7,6 +7,7 @@ const tertiary = '#f6f9fc'
|
||||||
const fontColor = '#4a5579'
|
const fontColor = '#4a5579'
|
||||||
const fancyColor = '#fd7890'
|
const fancyColor = '#fd7890'
|
||||||
const warningColor = '#c97c05'
|
const warningColor = '#c97c05'
|
||||||
|
const disabled = '#65707e'
|
||||||
const xs = '4px'
|
const xs = '4px'
|
||||||
const sm = '8px'
|
const sm = '8px'
|
||||||
const md = '16px'
|
const md = '16px'
|
||||||
|
@ -18,6 +19,7 @@ module.exports = Object.assign({}, {
|
||||||
primary,
|
primary,
|
||||||
secondary,
|
secondary,
|
||||||
tertiary,
|
tertiary,
|
||||||
|
disabled,
|
||||||
background,
|
background,
|
||||||
fontColor,
|
fontColor,
|
||||||
fancy: fancyColor,
|
fancy: fancyColor,
|
||||||
|
|
Loading…
Reference in New Issue