Merge pull request #554 from LN-Zap/style/onboarding-address

style(syncing): update syncing address style

app/components/Onboarding/Syncing.js

@@ -4,6 +4,7 @@ import QRCode from 'qrcode.react'
 import copy from 'copy-to-clipboard'
 import Isvg from 'react-inlinesvg'
 import zapLogo from 'icons/zap_logo.svg'
+import copyIcon from 'icons/copy.svg'
 import { showNotification } from 'notifications'
 import styles from './Syncing.scss'
 
@@ -110,8 +111,10 @@ class Syncing extends Component {
                     />
                   </div>
                   <section className={styles.textAddress}>
-                    <span>{address}</span>
+                    <span className={styles.text}>{address}</span>
-                    <span onClick={copyClicked}>copy</span>
+                    <span className={styles.icon} onClick={copyClicked}>
+                      <Isvg src={copyIcon} />
+                    </span>
                   </section>
                 </div>
               ) : (

app/components/Onboarding/Syncing.scss

@@ -45,18 +45,28 @@
 
       span {
         font-size: 12px;
-        margin: 0 5px;
 
-        &:nth-child(2) {
+        &.text {
-          font-size: 14px;
+          background: #2a2d38;
-          opacity: 0.5;
+          padding: 10px;
+        }
+
+        &.icon {
+          background: #383b47;
+          padding: 10px;
           cursor: pointer;
           transition: all 0.25s;
+          color: $white;
 
           &:hover {
             opacity: 0.25;
           }
         }
+
+        svg {
+          width: 12px;
+          height: 12px;
+        }
       }
     }
   }