Adding copy icon to home screen account address (#11460)

* Adding copy icon to home screen account address

Fixes MetaMask/metamask-extension#10145

* Using margin-inline-start

ui/components/app/selected-account/index.scss

@@ -26,6 +26,8 @@
     @include H7;
 
     color: #989a9b;
+    display: flex;
+    align-items: center;
   }
 
   &__clickable {
@@ -48,4 +50,10 @@
       background-color: #d9d7da;
     }
   }
+
+  &__copy {
+    height: 13px;
+    display: inline-block;
+    margin-inline-start: 3px;
+  }
 }

ui/components/app/selected-account/selected-account.component.js

@@ -4,6 +4,7 @@ import copyToClipboard from 'copy-to-clipboard';
 import { shortenAddress } from '../../../helpers/utils/util';
 
 import Tooltip from '../../ui/tooltip';
+import CopyIcon from '../../ui/icon/copy-icon.component';
 import { toChecksumHexAddress } from '../../../../shared/modules/hexstring-utils';
 import { SECOND } from '../../../../shared/constants/time';
 
@@ -61,6 +62,9 @@ class SelectedAccount extends Component {
             </div>
             <div className="selected-account__address">
               {shortenAddress(checksummedAddress)}
+              <div className="selected-account__copy">
+                <CopyIcon size={11} color="#989a9b" />
+              </div>
             </div>
           </button>
         </Tooltip>