From 4392a6f05803b136b3c0bd7634a1aa6529bfce08 Mon Sep 17 00:00:00 2001
From: bechi <bechilandia@gmail.com>
Date: Wed, 12 Nov 2014 17:44:50 -0300
Subject: [PATCH] add gravatar ux

---
 css/src/main.css         |   9 +++++++++
 img/change-avatar.png    | Bin 0 -> 8692 bytes
 views/includes/head.html |   4 +++-
 views/profile.html       |  36 ++++++++++++++++++++++--------------
 4 files changed, 34 insertions(+), 15 deletions(-)
 create mode 100644 img/change-avatar.png

diff --git a/css/src/main.css b/css/src/main.css
index 9e46e8b4a..d0c4b7fc1 100644
--- a/css/src/main.css
+++ b/css/src/main.css
@@ -1077,6 +1077,10 @@ button.gray:focus,
   overflow: hidden;
 }
 
+.fi-trash.text-gray:hover {
+  color: #CA5649;
+}
+
 .photo-container {
   margin-right: 3px;
   display: inline-block;
@@ -1090,6 +1094,11 @@ button.gray:focus,
   text-align: center;
 }
 
+.photo-container.profile {
+  width: 80px;
+  height: 80px;
+}
+
 a:hover .photo-container  {
   background: #34495E;
   color: #fff;
diff --git a/img/change-avatar.png b/img/change-avatar.png
new file mode 100644
index 0000000000000000000000000000000000000000..6c0ed08261b12a71cc37167c4121d698e4b7c4a3
GIT binary patch
literal 8692
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
S@Ww^}0000<MNUMnLSTXfh|m!L

literal 0
HcmV?d00001

diff --git a/views/includes/head.html b/views/includes/head.html
index 0e39f7bcd..c6daa80d9 100644
--- a/views/includes/head.html
+++ b/views/includes/head.html
@@ -17,7 +17,9 @@
 <div class="menu" ng-mouseover="hoverIn()" ng-mouseleave="hoverOut()"
   ng-click="hoverMenu = !hoverMenu">
   <a class="dropdown ellipsis text-gray" ng-class="{'hover': hoverMenu}">
-    <img gravatar-src="'{{username}}'" gravatar-size="35">
+    <div class="photo-container">
+      <img gravatar-src="'{{username}}'" gravatar-size="35">
+    </div>
     <span class="m15t">{{username}} </span>
     <i class="icon-arrow-down size-16 vm"></i> 
   </a>
diff --git a/views/profile.html b/views/profile.html
index cf08e592f..8dad247f0 100644
--- a/views/profile.html
+++ b/views/profile.html
@@ -3,13 +3,23 @@
 
   <div class="row">
     <div class="large-12 columns">
-      <div class="panel">
-        <h2><i class="fi-download m10r"></i> <span translate>Backup Profile</span></h2>
-        <p translate class="text-gray">It's important to backup your profile so that you can recover it in case of disaster. The backup will include all your profile's wallets</p>
-        <a translate class="button primary m0" ng-click="downloadProfileBackup()"
-          ng-show="!isSafari">Backup profile</a>
-        <a translate class="button primary m0" ng-click="viewProfileBackup()"
-          ng-show="isSafari && !hideViewProfileBackup">View profile backup</a>
+      <div class="panel oh">
+        <div class="large-1 medium-2 columns m20r">
+          <a class="photo-container profile m15t" href="https://en.gravatar.com/" ng-init="isHover=0" ng-mouseenter="isHover=1" ng-mouseleave="isHover=0" target="_blank">
+            <img ng-show="!isHover" gravatar-src="'{{username}}'" gravatar-size="80">
+            <img ng-show="isHover" src="img/change-avatar.png" with="80">
+          </a>
+        </div>
+        <div class="large-7 medium-7 columns">
+          <h3 class="m15t"> Backup Profile </h3>
+          <p translate class="text-gray">It's important to backup your profile so that you can recover it in case of disaster. The backup will include all your profile's wallets</p>
+        </div>
+        <div class="large-3 medium-3 columns right m20t">
+          <a translate class="button primary m10t" ng-click="downloadProfileBackup()"
+            ng-show="!isSafari">Backup profile</a>
+          <a translate class="button primary m0" ng-click="viewProfileBackup()"
+            ng-show="isSafari && !hideViewProfileBackup">View profile backup</a>
+        </div>
         <div ng-show="backupProfilePlainText">
           <textarea rows="5">{{backupProfilePlainText}}</textarea>
           <div class="show-for-large-up">
@@ -53,19 +63,17 @@
                 {{item.balanceInfo.totalBalance || 0 |noFractionNumber}} {{item.settings.unitName}}
               </span>
             </td>
-            <td width="70" class="text-center">
+            <td width="90" class="text-center">
 
               <div ng-show="loading != item.id">
-                <a title="Download Backup" ng-click="downloadWalletBackup(item)"
-                  ng-show="!isSafari"><i class="fi-download"></i></a>
+                <a title="Download Backup" class="text-gray" ng-click="downloadWalletBackup(item)"
+                  ng-show="!isSafari"><i class="fi-download size-18 m10r"></i></a>
                 <a title="View Backup" ng-click="viewWalletBackup(item)"
                   ng-show="isSafari"><i class="fi-eye"></i></a> 
                 &nbsp; &nbsp;
-                <a title="Delete Wallet"  
-                  class="text-warning" 
-                  ng-really-message="{{'Are you sure you want to delete the wallet'}} {{(item.name || item.id)}}" 
+                <a title="Delete Wallet" ng-really-message="{{'Are you sure you want to delete the wallet'}} {{(item.name || item.id)}}" 
                   ng-really-click="deleteWallet(item)"
-                  ng-show="loading != item.id"><i class="fi-trash"></i></a>
+                  ng-show="loading != item.id"><i class="fi-trash text-gray size-18"></i></a>
               </div>
               <span ng-show="loading == item.id"><i class="fi-bitcoin-circle icon-rotate spinner"></i></span>
             </td>