From 8342c20b58a0b90806a592992b6212ee6fa6f0ad Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 7 Sep 2017 21:17:07 -0230
Subject: Cleaner css for circle icon.

---
 .../dropdowns/components/network-dropdown-icon.js  | 22 +++++++++-------------
 ui/app/components/dropdowns/network-dropdown.js    |  4 ----
 2 files changed, 9 insertions(+), 17 deletions(-)

(limited to 'ui/app/components')

diff --git a/ui/app/components/dropdowns/components/network-dropdown-icon.js b/ui/app/components/dropdowns/components/network-dropdown-icon.js
index 01cb95215..7e94e0af5 100644
--- a/ui/app/components/dropdowns/components/network-dropdown-icon.js
+++ b/ui/app/components/dropdowns/components/network-dropdown-icon.js
@@ -14,19 +14,15 @@ NetworkDropdownIcon.prototype.render = function () {
   const {
     backgroundColor,
     isSelected,
-    innerBorder,
-    nonSelectBackgroundColor
+    innerBorder = 'none',
   } = this.props
 
-  return h('.menu-icon-circle-select', {
-    style: {
-      border: isSelected && '1px solid white',
-      background: isSelected ? 'rgba(100, 100, 100, 0.4)' : 'none',
-    },
-  }, h('.menu-icon-circle', {
-    style: {
-      background: isSelected ? backgroundColor : nonSelectBackgroundColor,
-      border: innerBorder ? innerBorder : 'none',
-    },
-  }))
+  return h(`.menu-icon-circle${isSelected ? '--active' : ''}`, {},
+    h('div', {
+      style: {
+        background: backgroundColor,
+        border: innerBorder,
+      },
+    })
+  )
 }
diff --git a/ui/app/components/dropdowns/network-dropdown.js b/ui/app/components/dropdowns/network-dropdown.js
index 1b6bd2385..4c578fbeb 100644
--- a/ui/app/components/dropdowns/network-dropdown.js
+++ b/ui/app/components/dropdowns/network-dropdown.js
@@ -108,7 +108,6 @@ NetworkDropdown.prototype.render = function () {
         providerType === 'mainnet' ? h('i.fa.fa-check') : h('.network-check__transparent', '✓'),
         h(NetworkDropdownIcon, {
           backgroundColor: '#038789', // $blue-lagoon
-          nonSelectBackgroundColor: '#15afb2',
           isSelected: providerType === 'mainnet',
         }),
         h('span.network-name-item', {
@@ -131,7 +130,6 @@ NetworkDropdown.prototype.render = function () {
         providerType === 'ropsten' ? h('i.fa.fa-check') : h('.network-check__transparent', '✓'),
         h(NetworkDropdownIcon, {
           backgroundColor: '#e91550', // $crimson
-          nonSelectBackgroundColor: '#ec2c50',
           isSelected: providerType === 'ropsten',
         }),
         h('span.network-name-item', {
@@ -154,7 +152,6 @@ NetworkDropdown.prototype.render = function () {
         providerType === 'kovan' ? h('i.fa.fa-check') : h('.network-check__transparent', '✓'),
         h(NetworkDropdownIcon, {
           backgroundColor: '#690496', // $purple
-          nonSelectBackgroundColor: '#b039f3',
           isSelected: providerType === 'kovan',
         }),
         h('span.network-name-item', {
@@ -177,7 +174,6 @@ NetworkDropdown.prototype.render = function () {
         providerType === 'rinkeby' ? h('i.fa.fa-check') : h('.network-check__transparent', '✓'),
         h(NetworkDropdownIcon, {
           backgroundColor: '#ebb33f', // $tulip-tree
-          nonSelectBackgroundColor: '#ecb23e',
           isSelected: providerType === 'rinkeby',
         }),
         h('span.network-name-item', {
-- 
cgit