Account menu white check mark

5 files changed, 34 insertions, 8 deletions

diff --git a/app/images/check-white.svg b/app/images/check-white.svg
new file mode 100644
index 000000000..0f15667da
--- /dev/null
+++ b/app/images/check-white.svg
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="16px" height="13px" viewBox="0 0 16 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 47 (45396) - http://www.bohemiancoding.com/sketch -->
+    <title>check-white</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="MetaMascara-v2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="account-dropdown-top-bar-IXD" transform="translate(-17.000000, -80.000000)" fill-rule="nonzero" fill="#FFFFFF">
+            <g id="Group-11" transform="translate(18.000000, 74.000000)">
+                <polygon id="check-white" points="4.2 15.5712828 0.714212839 12.0143571 -0.714212839 13.4142143 4.2 18.4287172 14.7142128 7.69992858 13.2857872 6.30007142"></polygon>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/ui/app/components/account-menu/index.js b/ui/app/components/account-menu/index.js
index 45e39e8ba..da2c86233 100644
--- a/ui/app/components/account-menu/index.js
+++ b/ui/app/components/account-menu/index.js
@@ -98,14 +98,14 @@ AccountMenu.prototype.renderAccounts = function () {
   const {
     identities,
     accounts,
-    selected,
+    selectedAddress,
     keyrings,
     showAccountDetail,
   } = this.props
 
   return Object.keys(identities).map((key, index) => {
     const identity = identities[key]
-    const isSelected = identity.address === selected
+    const isSelected = identity.address === selectedAddress
 
     const balanceValue = accounts[key] ? accounts[key].balance : ''
     const formattedBalance = balanceValue ? formatBalance(balanceValue, 6) : '...'
@@ -121,7 +121,7 @@ AccountMenu.prototype.renderAccounts = function () {
       { onClick: () => showAccountDetail(identity.address) },
       [
         h('div.account-menu__check-mark', [
-          isSelected ? h('i.fa.fa-check') : null,
+          isSelected ? h('div.account-menu__check-mark-icon') : null,
         ]),
 
         h(
diff --git a/ui/app/components/tx-view.js b/ui/app/components/tx-view.js
index d903998c0..ebef22680 100644
--- a/ui/app/components/tx-view.js
+++ b/ui/app/components/tx-view.js
@@ -109,14 +109,15 @@ TxView.prototype.render = function () {
         margin: '1em 0.9em',
         alignItems: 'center',
       },
-      onClick: () => {
-        this.props.sidebarOpen ? this.props.hideSidebar() : this.props.showSidebar()
-      },
     }, [
 
       h('div.fa.fa-bars', {
         style: {
           fontSize: '1.3em',
+          cursor: 'pointer',
+        },
+        onClick: () => {
+          this.props.sidebarOpen ? this.props.hideSidebar() : this.props.showSidebar()
         },
       }, []),
 
diff --git a/ui/app/css/itcss/components/account-menu.scss b/ui/app/css/itcss/components/account-menu.scss
index 72cb29ce8..91884e658 100644
--- a/ui/app/css/itcss/components/account-menu.scss
+++ b/ui/app/css/itcss/components/account-menu.scss
@@ -90,9 +90,20 @@
 
   &__check-mark {
     width: 14px;
+    margin-right: 12px;
     flex: 0 0 auto;
   }
 
+  &__check-mark-icon {
+    background-image: url("images/check-white.svg");
+    height: 18px;
+    width: 18px;
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: contain;
+    margin: 3px 0;
+  }
+
   .identicon {
     margin: 0 12px 0 0;
     flex: 0 0 auto;
diff --git a/ui/app/css/itcss/components/newui-sections.scss b/ui/app/css/itcss/components/newui-sections.scss
index 396dacae6..f86decab3 100644
--- a/ui/app/css/itcss/components/newui-sections.scss
+++ b/ui/app/css/itcss/components/newui-sections.scss
@@ -101,8 +101,8 @@ $wallet-view-bg: $wild-sand;
         font-size: 40px;
         color: $tundora;
         position: absolute;
-        top: 15px;
-        left: 15px;
+        top: 12px;
+        left: 12px;
         cursor: pointer;
       }
     }