fix(signup-form): fix form elements

packages/components-faraday/src/components/SignUp/SignUpStep0.js

@@ -12,7 +12,7 @@ const Step0 = ({ journal, handleSubmit, initialValues, error }) =>
   !isUndefined(initialValues) ? (
     <FormContainer onSubmit={handleSubmit}>
       <Row>
-        <RowItem>
+        <RowItem vertical>
           <Label> First name* </Label>
           <ValidatedField
             component={TextField}
@@ -20,7 +20,7 @@ const Step0 = ({ journal, handleSubmit, initialValues, error }) =>
             validate={[required]}
           />
         </RowItem>
-        <RowItem>
+        <RowItem vertical>
           <Label> Last name* </Label>
           <ValidatedField
             component={TextField}
@@ -30,7 +30,7 @@ const Step0 = ({ journal, handleSubmit, initialValues, error }) =>
         </RowItem>
       </Row>
       <Row>
-        <RowItem>
+        <RowItem vertical>
           <Label> Affiliation* </Label>
           <ValidatedField
             component={TextField}
@@ -39,7 +39,7 @@ const Step0 = ({ journal, handleSubmit, initialValues, error }) =>
           />
         </RowItem>
 
-        <RowItem>
+        <RowItem vertical>
           <Label> Title* </Label>
           <ValidatedField
             component={input => <Menu {...input} options={journal.title} />}

packages/components-faraday/src/components/UIComponents/FormItems.js

@@ -51,6 +51,7 @@ export const RowItem = styled.div`
   flex: ${({ flex }) => flex || 1};
   flex-direction: ${({ vertical }) => (vertical ? 'column' : 'row')};
   justify-content: ${({ centered }) => (centered ? 'center' : 'initial')};
+  margin: 0 ${th('subGridUnit')};
 `
 
 export const Label = styled.div`