Remove container prop from OpenPaper because after rebranding the designs are full-width, reduce stepper content maxWidth, reduce font-size in load owners owners step annotation

src/components/Stepper/OpenPaper/index.jsx

@@ -8,7 +8,7 @@ import { lg } from '~/theme/variables'
 const styles = () => ({
   root: {
     margin: '10px',
-    maxWidth: '870px',
+    maxWidth: '770px',
     boxShadow: '0 0 10px 0 rgba(33,48,77,0.10)',
   },
   padding: {
@@ -20,27 +20,16 @@ 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, container, padding = true,
+  classes, children, controls, padding = true,
-}: Props) => {
+}: Props) => (
-  const containerStyle = generateContainerStyleFrom(container)
+  <Paper className={classes.root} elevation={1}>
-
+    <Block className={padding ? classes.padding : ''}>{children}</Block>
-  return (
+    {controls}
-    <Paper className={classes.root} elevation={1}>
+  </Paper>
-      <Block style={containerStyle} className={padding ? classes.padding : ''}>
+)
-        {children}
-      </Block>
-      {controls}
-    </Paper>
-  )
-}
 
 export default withStyles(styles)(OpenPaper)

src/routes/load/components/DetailsForm/index.jsx

@@ -162,7 +162,7 @@ const DetailsForm = withStyles(styles)(Details)
 
 const DetailsPage = () => (controls: React.Node, { errors, form }: Object) => (
   <>
-    <OpenPaper controls={controls} container={605}>
+    <OpenPaper controls={controls}>
       <DetailsForm errors={errors} form={form} />
     </OpenPaper>
   </>

src/routes/load/components/OwnerList/index.jsx

@@ -113,7 +113,7 @@ const OwnerListComponent = (props: Props) => {
   return (
     <>
       <Block className={classes.title}>
-        <Paragraph noMargin size="lg" color="primary">
+        <Paragraph noMargin size="md" color="primary">
           {`This Safe has ${owners.length} owners. Optional: Provide a name for each owner.`}
         </Paragraph>
       </Block>
@@ -138,7 +138,7 @@ const OwnerListComponent = (props: Props) => {
                 text="Owner Name"
               />
             </Col>
-            <Col xs={7}>
+            <Col xs={8}>
               <Row className={classes.ownerAddresses}>
                 <Identicon address={address} diameter={32} />
                 <Paragraph size="md" color="disabled" noMargin className={classes.address}>

src/routes/open/components/SafeNameForm/index.jsx

@@ -83,7 +83,7 @@ const SafeName = ({ classes }: Props) => (
 const SafeNameForm = withStyles(styles)(SafeName)
 
 const SafeNamePage = () => (controls: React.Node) => (
-  <OpenPaper controls={controls} container={600}>
+  <OpenPaper controls={controls}>
     <SafeNameForm />
   </OpenPaper>
 )