Fix batch of CSS improvements on OpenSafe page 1

This commit is contained in:
apanizo 2018-11-07 16:16:11 +01:00
parent 798c9572dd
commit 4512388493
4 changed files with 26 additions and 9 deletions

View File

@ -3,7 +3,7 @@ import * as React from 'react'
import Button from '~/components/layout/Button' import Button from '~/components/layout/Button'
import Col from '~/components/layout/Col' import Col from '~/components/layout/Col'
import Row from '~/components/layout/Row' import Row from '~/components/layout/Row'
import { sm } from '~/theme/variables' import { sm, boldFont } from '~/theme/variables'
const controlStyle = { const controlStyle = {
backgroundColor: 'white', backgroundColor: 'white',
@ -12,6 +12,11 @@ const controlStyle = {
const firstButtonStyle = { const firstButtonStyle = {
marginRight: sm, marginRight: sm,
fontWeight: boldFont,
}
const secondButtonStyle = {
fontWeight: boldFont,
} }
type Props = { type Props = {
@ -41,6 +46,7 @@ const Controls = ({
{back} {back}
</Button> </Button>
<Button <Button
style={secondButtonStyle}
size="small" size="small"
variant="raised" variant="raised"
color="primary" color="primary"

View File

@ -9,6 +9,7 @@ const styles = () => ({
root: { root: {
margin: '10px', margin: '10px',
maxWidth: '870px', maxWidth: '870px',
boxShadow: '0 0 10px 0 rgba(33,48,77,0.10)',
}, },
container: { container: {
letterSpacing: '-0.5px', letterSpacing: '-0.5px',

View File

@ -36,7 +36,7 @@ const styles = () => ({
const SafeName = ({ classes }: Props) => ( const SafeName = ({ classes }: Props) => (
<React.Fragment> <React.Fragment>
<Block margin="lg"> <Block margin="lg">
<Paragraph noMargin size="md" color="primary" weight="light" className={classes.links}> <Paragraph noMargin size="md" color="primary" className={classes.links}>
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 <a rel="noopener noreferrer" href="https://safe.gnosis.io/terms" target="_blank">terms of use</a> and <a rel="noopener noreferrer" href="https://safe.gnosis.io/privacy" target="_blank">privacy policy</a>. By continuing you consent with the <a rel="noopener noreferrer" href="https://safe.gnosis.io/terms" target="_blank">terms of use</a> and <a rel="noopener noreferrer" href="https://safe.gnosis.io/privacy" target="_blank">privacy policy</a>.
</Paragraph> </Paragraph>

View File

@ -1,7 +1,6 @@
// @flow // @flow
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, disabled, primary, secondary, md, lg, background, bolderFont, boldFont, buttonLargeFontSize } from './variables' import { largeFontSize, mediumFontSize, smallFontSize, disabled, primary, secondary, md, lg, bolderFont, boldFont, buttonLargeFontSize } from './variables'
export type WithStyles = { export type WithStyles = {
classes: Object, classes: Object,
@ -14,7 +13,9 @@ const palette = {
secondary: { secondary: {
main: secondary, main: secondary,
}, },
error: red, error: {
main: '#FB4F62',
},
contrastThreshold: 3, contrastThreshold: 3,
tonalOffset: 0.2, tonalOffset: 0.2,
} }
@ -55,6 +56,11 @@ export default createMuiTheme({
fontSize: smallFontSize, fontSize: smallFontSize,
}, },
}, },
MuiStepper: {
root: {
padding: '24px 0 0 15px',
},
},
MuiStepIcon: { MuiStepIcon: {
root: { root: {
fontSize: '22px', fontSize: '22px',
@ -76,14 +82,14 @@ export default createMuiTheme({
MuiFormHelperText: { MuiFormHelperText: {
root: { root: {
fontFamily: 'Roboto Mono, monospace', fontFamily: 'Roboto Mono, monospace',
fontSize: smallFontSize, fontSize: '12px',
padding: `0 0 0 ${md}`, padding: `0 0 0 ${md}`,
position: 'relative', position: 'relative',
top: '20px', top: '20px',
color: secondary, color: secondary,
order: 0, order: 0,
marginTop: '0px', marginTop: '0px',
backgroundColor: background, backgroundColor: 'EAE9EF',
}, },
}, },
MuiInput: { MuiInput: {
@ -94,16 +100,20 @@ export default createMuiTheme({
lineHeight: '56px', lineHeight: '56px',
order: 1, order: 1,
padding: `0 ${md}`, padding: `0 ${md}`,
backgroundColor: background, backgroundColor: '#EAE9EF',
'&:$disabled': { '&:$disabled': {
color: '#0000ff', color: '#0000ff',
}, },
}, },
input: { input: {
padding: 0, padding: 0,
color: 'initial', letterSpacing: '0.5px',
color: primary,
textOverflow: 'ellipsis', textOverflow: 'ellipsis',
display: 'flex', display: 'flex',
'&::-webkit-input-placeholder': {
color: disabled,
},
}, },
underline: { underline: {
'&:before': { '&:before': {