diff --git a/src/components/Stepper/OpenPaper/index.jsx b/src/components/Stepper/OpenPaper/index.jsx
index b833b7cf..11a51995 100644
--- a/src/components/Stepper/OpenPaper/index.jsx
+++ b/src/components/Stepper/OpenPaper/index.jsx
@@ -22,18 +22,27 @@ type Props = {
classes: Object,
children: React$Node,
controls: React$Node,
+ container?: number,
padding?: boolean,
}
+const generateContainerStyleFrom = (container?: number) => ({
+ maxWidth: container ? `${container}px` : undefined,
+})
+
const OpenPaper = ({
- classes, children, controls, padding = true,
-}: Props) => (
-
-
- {children}
-
- { controls }
-
-)
+ classes, children, controls, container, padding = true,
+}: Props) => {
+ const containerStyle = generateContainerStyleFrom(container)
+
+ return (
+
+
+ {children}
+
+ { controls }
+
+ )
+}
export default withStyles(styles)(OpenPaper)
diff --git a/src/routes/open/components/SafeNameForm/index.jsx b/src/routes/open/components/SafeNameForm/index.jsx
index c8ded0a3..5ca19a9e 100644
--- a/src/routes/open/components/SafeNameForm/index.jsx
+++ b/src/routes/open/components/SafeNameForm/index.jsx
@@ -5,9 +5,11 @@ import Field from '~/components/forms/Field'
import TextField from '~/components/forms/TextField'
import { required } from '~/components/forms/validator'
import Block from '~/components/layout/Block'
+import Row from '~/components/layout/Row'
import { FIELD_NAME } from '~/routes/open/components/fields'
import Paragraph from '~/components/layout/Paragraph'
import OpenPaper from '~/components/Stepper/OpenPaper'
+import { sm } from '~/theme/variables'
type Props = {
classes: Object,
@@ -16,6 +18,13 @@ type Props = {
const styles = () => ({
root: {
display: 'flex',
+ maxWidth: '440px',
+ },
+ text: {
+ flexWrap: 'nowrap',
+ },
+ dot: {
+ marginRight: sm,
},
})
@@ -27,16 +36,22 @@ const SafeName = ({ classes }: Props) => (
By continuing you consent with the terms of use and privacy policy.
-
+
+
+ ●
+
- ● 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.
-
-
-
- ● My Safe is a smart contract on the Ethereum blockchain.
+
+
+
+ ●
-
+
+ My Safe is a smart contract on the Ethereum blockchain.
+
+
(
const SafeNameForm = withStyles(styles)(SafeName)
const SafeNamePage = () => (controls: React$Node) => (
-
+
)
diff --git a/src/routes/open/components/SafeThresholdForm/index.jsx b/src/routes/open/components/SafeThresholdForm/index.jsx
index 7a3663b7..50347898 100644
--- a/src/routes/open/components/SafeThresholdForm/index.jsx
+++ b/src/routes/open/components/SafeThresholdForm/index.jsx
@@ -19,9 +19,6 @@ type Props = {
}
const styles = () => ({
- root: {
- maxWidth: '450px',
- },
owners: {
paddingLeft: md,
},
@@ -44,7 +41,7 @@ const SafeThreshold = ({ classes, values }: Props) => {
const numOwners = getNumOwnersFrom(values)
return (
-
+
Set the required owner confirmations:
@@ -85,7 +82,7 @@ const SafeThreshold = ({ classes, values }: Props) => {
-
+
)
}
@@ -93,7 +90,7 @@ const SafeThresholdForm = withStyles(styles)(SafeThreshold)
const SafeOwnersPage = () => (controls: React$Node, { values }: Object) => (
-
+