Merge branch 'master' into networkDropdownFix

CHANGELOG.md

@@ -9,6 +9,8 @@
 - Wallet titles are now properly truncated in transaction confirmation.
 - Fix formatting on terms & conditions page.
 - Now enforce 30 character limit on wallet names.
+- Fix out-of-place positioning of pending transaction badges on wallet list.
+- Change network status icons to reflect current design.
 
 ## 2.4.4 2016-06-23
 

ui/app/app.js

@@ -213,14 +213,14 @@ App.prototype.renderNetworkDropdown = function () {
       label: 'Main Ethereum Network',
       closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
       action: () => props.dispatch(actions.setProviderType('mainnet')),
-      icon: h('.menu-icon.ether-icon'),
+      icon: h('.menu-icon.diamond'),
     }),
 
     h(DropMenuItem, {
       label: 'Morden Test Network',
       closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
       action: () => props.dispatch(actions.setProviderType('testnet')),
-      icon: h('.menu-icon.morden-icon'),
+      icon: h('.menu-icon.red-dot'),
     }),
 
     h(DropMenuItem, {

ui/app/components/network.js

@@ -47,9 +47,9 @@ Network.prototype.render = function () {
       (function () {
         switch (iconName) {
           case 'ethereum-network':
-            return h('.menu-icon.ether-icon')
+            return h('.menu-icon.diamond')
           case 'morden-test-network':
-            return h('.menu-icon.morden-icon')
+            return h('.menu-icon.red-dot')
           default:
             return h('i.fa.fa-question-circle.fa-lg', {
               ariaHidden: true,

ui/app/css/lib.css

@@ -168,27 +168,25 @@ hr.horizontal-line {
 }
 
 .red-dot {
-  position: inherit;
-  background: red;
+  background: #E91550;
   color: white;
   border-radius: 10px;
-  height: 12px;
-  min-width: 12px;
-  margin-left: 6px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 4px;
+}
+
+.diamond {
+  transform: rotate(45deg);
+  background: #038789;
 }
 
 .pending-dot {
   background: red;
-  left: 57px;
+  left: 14px;
+  top: 14px;
   color: white;
   border-radius: 10px;
   height: 20px;
   min-width: 20px;
-  position: absolute;
+  position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -202,8 +200,8 @@ hr.horizontal-line {
 
 .menu-icon {
   display: inline-block;
-  width: 14px;
-  height: 14px;
+  height: 9px;
+  min-width: 9px;
   margin: 13px;
 }
 .ether-icon {
@@ -221,4 +219,4 @@ hr.horizontal-line {
 
 .invisible {
   visibility: hidden;
-}
+}