Add and fix styles

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

@@ -23,8 +23,7 @@ import OpenPaper from '~/components/Stepper/OpenPaper'
 import { getAccountsFrom } from '~/routes/open/utils/safeDataExtractor'
 import Hairline from '~/components/layout/Hairline'
 import { md, lg, sm } from '~/theme/variables'
-
-const trash = require('../../assets/trash.svg')
+import trash from '~/assets/icons/trash.svg'
 
 type Props = {
   classes: Object,

src/routes/safe/components/Balances/Tokens/index.jsx

@@ -42,7 +42,7 @@ const Tokens = (props: Props) => {
   return (
     <React.Fragment>
       <Row align="center" grow className={classes.heading}>
-        <Paragraph className={classes.manage} noMargin>
+        <Paragraph className={classes.manage} noMargin weight="bolder">
           Manage Tokens
         </Paragraph>
         <IconButton onClick={onClose} disableRipple data-testid={MANAGE_TOKENS_MODAL_CLOSE_BUTTON_TEST_ID}>

src/routes/safe/components/Settings/RemoveSafeModal/index.jsx

@@ -51,7 +51,7 @@ const RemoveSafeComponent = ({
     open={isOpen}
   >
     <Row align="center" grow className={classes.heading}>
-      <Paragraph className={classes.manage} noMargin>
+      <Paragraph className={classes.manage} noMargin weight="bolder" >
           Remove Safe
       </Paragraph>
       <IconButton onClick={onClose} disableRipple>
@@ -66,7 +66,7 @@ const RemoveSafeComponent = ({
         </Col>
         <Col xs={11}>
           <Block className={classNames(classes.name, classes.userName)}>
-            <Paragraph size="lg" noMargin>
+            <Paragraph size="lg" noMargin weight="bolder">
               {safeName}
             </Paragraph>
             <Block align="center" className={classes.user}>

src/routes/safe/components/Settings/UpdateSafeName/index.jsx

@@ -51,7 +51,7 @@ const UpdateSafeName = (props: Props) => {
         {() => (
           <React.Fragment>
             <Block className={classes.formContainer}>
-              <Paragraph noMargin className={classes.title} size="lg">
+              <Paragraph noMargin className={classes.title} size="lg" weight="bolder">
               Modify Safe name
               </Paragraph>
               <Block className={classes.root}>

src/routes/safe/components/Settings/UpdateSafeName/style.js

@@ -1,4 +1,17 @@
 // @flow
 import { lg, border } from '~/theme/variables'
 
-export const styles = () => ({})
+export const styles = () => ({
+  title: {
+    padding: `${lg} 0 20px`,
+    fontSize: '16px',
+  },
+  formContainer: {
+    padding: '0 20px',
+    minHeight: '369px',
+  },
+  root: {
+    display: 'flex',
+    maxWidth: '460px',
+  },
+})

src/routes/safe/components/Settings/index.jsx

@@ -59,7 +59,9 @@ class Settings extends React.Component<Props, State> {
       <React.Fragment>
         <Row align="center" className={classes.message}>
           <Col xs={6}>
-            <Paragraph className={classes.settings}>Settings</Paragraph>
+            <Paragraph className={classes.settings} size="lg" weight="bolder">
+              Settings
+            </Paragraph>
           </Col>
           <Col xs={6} end="sm">
             <Paragraph noMargin size="md" color="error" className={classes.links} onClick={this.onShow('RemoveSafe')}>

src/routes/safe/components/Settings/style.js

@@ -22,9 +22,6 @@ export const styles = (theme: Object) => ({
     alignItems: 'center',
     cursor: 'pointer',
   },
-  container: {
-    padding: lg,
-  },
   message: {
     margin: `${sm} 0`,
   },