From 8005e4677019de0b21f7949999e61bd5084704de Mon Sep 17 00:00:00 2001
From: bechi <bechilandia@gmail.com>
Date: Thu, 3 Dec 2015 12:34:58 -0300
Subject: [PATCH] fix history item ui

---
 public/img/icon-moved.svg    | 22 ++++++++++++++++++++
 public/img/icon-receive.svg  | 22 ++++++++++++++++++++
 public/img/icon-sent.svg     | 22 ++++++++++++++++++++
 public/views/walletHome.html | 40 +++++++++++++++++++++---------------
 src/css/main.css             |  2 +-
 5 files changed, 90 insertions(+), 18 deletions(-)
 create mode 100644 public/img/icon-moved.svg
 create mode 100644 public/img/icon-receive.svg
 create mode 100644 public/img/icon-sent.svg

diff --git a/public/img/icon-moved.svg b/public/img/icon-moved.svg
new file mode 100644
index 000000000..96b2b78e7
--- /dev/null
+++ b/public/img/icon-moved.svg
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="61px" height="61px" viewBox="0 0 61 61" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.4.2 (15855) - http://www.bohemiancoding.com/sketch -->
+    <title>Oval 145 Copy 7 + retweet</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <circle id="path-1" cx="26.25" cy="26.25" r="26.25"></circle>
+    </defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="Wallet-1of1" sketch:type="MSArtboardGroup" transform="translate(-28.000000, -675.000000)">
+            <g id="Group" sketch:type="MSLayerGroup" transform="translate(0.000000, 646.000000)">
+                <g id="Oval-145-Copy-7-+-retweet" transform="translate(32.000000, 33.000000)">
+                    <g id="Oval-145-Copy-7" stroke="#4B6178">
+                        <use stroke-width="1.09090909" fill="#FFFFFF" fill-rule="evenodd" sketch:type="MSShapeGroup" xlink:href="#path-1"></use>
+                        <use stroke-opacity="0.15" stroke-width="4" fill="none" xlink:href="#path-1"></use>
+                    </g>
+                    <path d="M30.9677734,31.75 C31.0898444,31.75 31.1936031,31.7927242 31.2790527,31.8781738 C31.3645024,31.9636235 31.4072266,32.0714512 31.4072266,32.2016602 C31.4072266,32.3237311 31.3645024,32.4274898 31.2790527,32.5129395 C31.1936031,32.5983891 31.0898444,32.6411133 30.9677734,32.6411133 L18.9072266,32.6411133 C18.7851556,32.6411133 18.6813969,32.5983891 18.5959473,32.5129395 C18.5104976,32.4274898 18.4677734,32.3237311 18.4677734,32.2016602 L18.4677734,19.8847656 L14.7568359,23.5834961 C14.6835934,23.6730148 14.5818691,23.7177734 14.4516602,23.7177734 C14.3214512,23.7177734 14.2136235,23.6730148 14.1281738,23.5834961 C14.0427242,23.4939774 14,23.3881842 14,23.2661133 C14,23.1440424 14.0447587,23.0382491 14.1342773,22.9487305 L18.5898438,18.4931641 C18.6793624,18.4036454 18.7851556,18.3588867 18.9072266,18.3588867 C19.0455736,18.3588867 19.1513668,18.4036454 19.2246094,18.4931641 L23.6923828,22.9487305 C23.7819015,23.0545253 23.8266602,23.1603185 23.8266602,23.2661133 C23.8266602,23.3881842 23.7819015,23.4939774 23.6923828,23.5834961 C23.6028641,23.6730148 23.4970709,23.7177734 23.375,23.7177734 C23.2529291,23.7177734 23.1471359,23.6730148 23.0576172,23.5834961 L19.3588867,19.8847656 L19.3588867,31.75 L30.9677734,31.75 Z M38.5483398,27.2822266 C38.6785488,27.2822266 38.7863765,27.3269852 38.8718262,27.4165039 C38.9572758,27.5060226 39,27.6118158 39,27.7338867 C39,27.8559576 38.9552413,27.9617509 38.8657227,28.0512695 L34.4101562,32.5068359 C34.3206376,32.5963546 34.2148444,32.6411133 34.0927734,32.6411133 C33.9544264,32.6411133 33.8486332,32.5963546 33.7753906,32.5068359 L29.3076172,28.0512695 C29.2180985,27.9454747 29.1733398,27.8396815 29.1733398,27.7338867 C29.1733398,27.6118158 29.2180985,27.5060226 29.3076172,27.4165039 C29.3971359,27.3269852 29.5029291,27.2822266 29.625,27.2822266 C29.7470709,27.2822266 29.8528641,27.3269852 29.9423828,27.4165039 L33.6411133,31.1152344 L33.6411133,19.25 L22.0322266,19.25 C21.9101556,19.25 21.8063969,19.2072758 21.7209473,19.1218262 C21.6354976,19.0363765 21.5927734,18.9285488 21.5927734,18.7983398 C21.5927734,18.6762689 21.6354976,18.5725102 21.7209473,18.4870605 C21.8063969,18.4016109 21.9101556,18.3588867 22.0322266,18.3588867 L34.0927734,18.3588867 C34.2148444,18.3588867 34.3186031,18.4016109 34.4040527,18.4870605 C34.4895024,18.5725102 34.5322266,18.6762689 34.5322266,18.7983398 L34.5322266,31.1152344 L38.2431641,27.4165039 C38.3164066,27.3269852 38.4181309,27.2822266 38.5483398,27.2822266 L38.5483398,27.2822266 Z" id="retweet" fill="#4B6178" sketch:type="MSShapeGroup"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/public/img/icon-receive.svg b/public/img/icon-receive.svg
new file mode 100644
index 000000000..caa28e347
--- /dev/null
+++ b/public/img/icon-receive.svg
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="61px" height="61px" viewBox="0 0 61 61" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.4.2 (15855) - http://www.bohemiancoding.com/sketch -->
+    <title>Oval 145 Copy 5 + downloadbox</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <ellipse id="path-1" cx="26.25" cy="26.25" rx="26.25" ry="26.25"></ellipse>
+    </defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="Wallet-1of1" sketch:type="MSArtboardGroup" transform="translate(-23.000000, -437.000000)">
+            <g id="Group-Copy-2" sketch:type="MSLayerGroup" transform="translate(0.000000, 409.000000)">
+                <g id="Oval-145-Copy-5-+-downloadbox" transform="translate(27.000000, 32.000000)">
+                    <g id="Oval-145-Copy-5" stroke="#1ABC9C">
+                        <use stroke-width="1.09090909" fill="#FFFFFF" fill-rule="evenodd" sketch:type="MSShapeGroup" xlink:href="#path-1"></use>
+                        <use stroke-opacity="0.15" stroke-width="4" fill="none" xlink:href="#path-1"></use>
+                    </g>
+                    <path d="M38.8657227,18.480957 C38.9552413,18.5704757 39,18.6762689 39,18.7983398 L39,35.3144531 C39,35.566733 38.9125172,35.7803539 38.7375488,35.9553223 C38.5625805,36.1302906 38.3530286,36.2177734 38.1088867,36.2177734 L14.8911133,36.2177734 C14.6469714,36.2177734 14.4374195,36.1302906 14.2624512,35.9553223 C14.0874828,35.7803539 14,35.566733 14,35.3144531 L14,18.7983398 C14,18.6762689 14.0447587,18.5704757 14.1342773,18.480957 L17.6987305,14.9165039 C17.7882491,14.8269852 17.8940424,14.7822266 18.0161133,14.7822266 L34.9838867,14.7822266 C35.1059576,14.7822266 35.2117509,14.8269852 35.3012695,14.9165039 L38.8657227,18.480957 Z M18.1992188,15.6733398 L15.5258789,18.3588867 L37.4741211,18.3588867 L34.8007812,15.6733398 L18.1992188,15.6733398 Z M38.1088867,35.3144531 L38.1088867,19.25 L14.8911133,19.25 L14.8911133,35.3144531 L38.1088867,35.3144531 Z M26.1826172,32.5068359 L22.6181641,28.9423828 C22.5286454,28.8528641 22.4838867,28.7470709 22.4838867,28.625 C22.4838867,28.5029291 22.5266109,28.3971359 22.6120605,28.3076172 C22.6975102,28.2180985 22.8012689,28.1733398 22.9233398,28.1733398 C23.0616869,28.1733398 23.1674801,28.2180985 23.2407227,28.3076172 L26.0483398,31.1152344 L26.0483398,22.375 C26.0483398,22.2529291 26.0930985,22.1471359 26.1826172,22.0576172 C26.2721359,21.9680985 26.3779291,21.9233398 26.5,21.9233398 C26.6220709,21.9233398 26.7278641,21.9680985 26.8173828,22.0576172 C26.9069015,22.1471359 26.9516602,22.2529291 26.9516602,22.375 L26.9516602,31.1152344 L29.7592773,28.3076172 C29.8325199,28.2180985 29.9383131,28.1733398 30.0766602,28.1733398 C30.1987311,28.1733398 30.3024898,28.2180985 30.3879395,28.3076172 C30.4733891,28.3971359 30.5161133,28.5029291 30.5161133,28.625 C30.5161133,28.7470709 30.4713546,28.8528641 30.3818359,28.9423828 L26.8173828,32.5068359 C26.7278641,32.5963546 26.6220709,32.6411133 26.5,32.6411133 C26.3779291,32.6411133 26.2721359,32.5963546 26.1826172,32.5068359 L26.1826172,32.5068359 Z" id="downloadbox" fill="#1ABC9C" sketch:type="MSShapeGroup"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/public/img/icon-sent.svg b/public/img/icon-sent.svg
new file mode 100644
index 000000000..cfb0426e5
--- /dev/null
+++ b/public/img/icon-sent.svg
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="61px" height="61px" viewBox="0 0 61 61" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.4.2 (15855) - http://www.bohemiancoding.com/sketch -->
+    <title>Oval 145 Copy 7 + send copy</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <circle id="path-1" cx="26.25" cy="26.25" r="26.25"></circle>
+    </defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="Wallet-1of1" sketch:type="MSArtboardGroup" transform="translate(-28.000000, -553.000000)">
+            <g id="Group-Copy" sketch:type="MSLayerGroup" transform="translate(0.000000, 527.000000)">
+                <g id="Oval-145-Copy-7-+-send-copy" transform="translate(32.000000, 30.000000)">
+                    <g id="Oval-145-Copy-7">
+                        <use stroke="#EE4A43" stroke-width="1.09090909" fill="#FFFFFF" fill-rule="evenodd" sketch:type="MSShapeGroup" xlink:href="#path-1"></use>
+                        <use stroke-opacity="0.15" stroke="#ED4A43" stroke-width="4" fill="none" xlink:href="#path-1"></use>
+                    </g>
+                    <path d="M28.2822266,38 C28.0869131,38 27.9526371,37.9064137 27.8793945,37.7192383 L27.8671875,37.7192383 L23.9243164,28.0756836 L14.2807617,24.1206055 C14.0935863,24.055501 14,23.921225 14,23.7177734 C14,23.52246 14.0895173,23.384115 14.2685547,23.3027344 L38.3774414,13.0366211 C38.4262698,13.0122069 38.4832354,13 38.5483398,13 C38.6785488,13 38.7863765,13.0427242 38.8718262,13.1281738 C38.9572758,13.2136235 39,13.3173822 39,13.4394531 C39,13.5045576 38.9877931,13.5655922 38.9633789,13.6225586 L28.6972656,37.7314453 C28.615885,37.9104827 28.47754,38 28.2822266,38 L28.2822266,38 Z M15.5991211,23.7055664 L24.168457,27.2089844 L36.6074219,14.7578125 L15.5991211,23.7055664 Z M28.2944336,36.3886719 L37.2421875,15.3925781 L24.7910156,27.831543 L28.2944336,36.3886719 Z" id="send-copy" fill="#EE4A43" sketch:type="MSShapeGroup"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/public/views/walletHome.html b/public/views/walletHome.html
index 295234259..b19d04430 100644
--- a/public/views/walletHome.html
+++ b/public/views/walletHome.html
@@ -216,15 +216,29 @@
         <div ng-repeat="btx in index.txHistory"
           ng-click="home.openTxModal(btx)"
           class="row collapse last-transactions-content">
-          <div class="large-3 medium-3 small-3 columns">
-            <span class="label tu radius" ng-show="btx.action == 'received'"
-              ng-style="{'background-color':index.backgroundColor}" translate>Received</span>
-            <span class="label tu gray radius" ng-show="btx.action == 'sent'" translate>Sent</span>
-            <span class="label tu gray radius" ng-show="btx.action == 'moved'" translate>Moved</span>
-            <span class="label tu warning radius" ng-show="btx.action == 'invalid'" translate>Invalid</span>
+          <div class="large-6 medium-6 small-6 columns size-14">
+            <div class="m10r left">
+              <img src="img/icon-receive.svg" alt="sync" width="40" ng-show="btx.action == 'received'">
+              <img src="img/icon-sent.svg" alt="sync" width="40" ng-show="btx.action == 'sent'">
+              <img src="img/icon-moved.svg" alt="sync" width="40" ng-show="btx.action == 'moved'">
+            </div>
+            <div class="m10t">
+              <span ng-show="btx.action == 'received'" translate>Received</span>
+              <span ng-show="btx.action == 'sent'">
+                {{index.addressbook[btx.addressTo]}}
+                <span ng-show="!index.addressbook[btx.addressTo] && btx.message">
+                  <span class="ellipsis">{{btx.message}}</span>
+                </span>
+                <span ng-show="!index.addressbook[btx.addressTo] && !btx.message">
+                  <span translate> Sent</span>
+                </span>
+              </span>
+              <span ng-show="btx.action == 'moved'" translate>Moved</span>
+              <span class="label tu warning radius" ng-show="btx.action == 'invalid'" translate>Invalid</span>
+            </div>
           </div>
 
-          <div class="large-4 medium-4 small-4 columns">
+          <div class="large-5 medium-5 small-5 columns text-right">
             <span class="size-16">
               <span ng-if="btx.action == 'received'">+</span>
               <span ng-if="btx.action == 'sent'">-</span>
@@ -235,9 +249,7 @@
               {{btx.amountStr}}
               </span>
             </span>
-          </div>
-          <div class="large-4 medium-4 small-4 columns text-right">
-            <div class="m5t size-12 text-gray">
+            <div class="size-12 text-gray">
               <time ng-if="btx.time">{{btx.time * 1000 | amTimeAgo}}</time>
               <span translate class="text-warning"
                 ng-show="!btx.time && (!btx.confirmations || btx.confirmations == 0)">
@@ -245,15 +257,9 @@
               </span>
             </div>
           </div>
-          <div class="large-1 medium-1 small-1 columns text-right">
+          <div class="large-1 medium-1 small-1 columns text-right m10t">
             <i class="icon-arrow-right3 size-18"></i>
           </div>
-          <div class="size-14 text-gray columns m5t" ng-if="btx.message || btx.addressTo">
-            <div ng-show="btx.message">{{btx.message}}</div>
-            <div ng-show="!btx.message">
-              <span translate>To</span>: {{index.addressbook[btx.addressTo] || btx.addressTo}}
-            </div>
-          </div>
         </div>
 
         <div class="row m20t text-center" ng-show="index.historyRendering">
diff --git a/src/css/main.css b/src/css/main.css
index e0cd00855..b91d4365c 100644
--- a/src/css/main.css
+++ b/src/css/main.css
@@ -330,7 +330,7 @@ ul.tx-copayers {
 
 .last-transactions-content {
   background: #fff;
-  padding: 1.5rem 1rem;
+  padding: 0.8rem 1rem;
   cursor:pointer;
   border-bottom: 1px solid #E4E8EC;
 }