Safe name change notification, setting style updates

src/routes/safe/components/Balances/SendModal/screens/ReviewTx/index.jsx

@@ -78,7 +78,7 @@ const ReviewTx = ({
       }
 
       return (
-        <React.Fragment>
+        <>
           <Row align="center" grow className={classes.heading}>
             <Paragraph weight="bolder" className={classes.headingText} noMargin>
               Send Funds
@@ -154,7 +154,7 @@ const ReviewTx = ({
               SUBMIT
             </Button>
           </Row>
-        </React.Fragment>
+        </>
       )
     }}
   </SharedSnackbarConsumer>

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

@@ -5,6 +5,7 @@ import Block from '~/components/layout/Block'
 import Col from '~/components/layout/Col'
 import Field from '~/components/forms/Field'
 import Heading from '~/components/layout/Heading'
+import { SharedSnackbarConsumer } from '~/components/SharedSnackBar'
 import { composeValidators, required, minMaxLength } from '~/components/forms/validator'
 import TextField from '~/components/forms/TextField'
 import GnoForm from '~/components/forms/GnoForm'
@@ -28,22 +29,24 @@ type Props = {
   safeAddress: string,
   safeName: string,
   updateSafe: Function,
+  openSnackbar: Function,
 }
 
 const ChangeSafeName = (props: Props) => {
   const {
-    classes, safeAddress, safeName, updateSafe,
+    classes, safeAddress, safeName, updateSafe, openSnackbar,
   } = props
 
   const handleSubmit = (values) => {
     updateSafe({ address: safeAddress, name: values.safeName })
+    openSnackbar('Safe name changed', 'success')
   }
 
   return (
-    <React.Fragment>
+    <>
       <GnoForm onSubmit={handleSubmit}>
         {() => (
-          <React.Fragment>
+          <>
             <Block className={classes.formContainer}>
               <Heading tag="h3">Modify Safe name</Heading>
               <Paragraph>
@@ -78,11 +81,17 @@ const ChangeSafeName = (props: Props) => {
                 </Button>
               </Col>
             </Row>
-          </React.Fragment>
+          </>
         )}
       </GnoForm>
-    </React.Fragment>
+    </>
   )
 }
 
-export default withStyles(styles)(ChangeSafeName)
+const withSnackbar = (props) => (
+  <SharedSnackbarConsumer>
+    {({ openSnackbar }) => <ChangeSafeName {...props} openSnackbar={openSnackbar} />}
+  </SharedSnackbarConsumer>
+)
+
+export default withStyles(styles)(withSnackbar)

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

@@ -6,9 +6,10 @@ import {
 export const styles = () => ({
   root: {
     backgroundColor: 'white',
-    boxShadow: '0 -1px 4px 0 rgba(74, 85, 121, 0.5)',
+    boxShadow: '1px 2px 10px 0 rgba(212, 212, 211, 0.59)',
     minHeight: '400px',
     display: 'flex',
+    borderRadius: '8px',
   },
   settings: {
     letterSpacing: '-0.5px',