From 2900f2583143da7f9418dd7355e77423c62ff459 Mon Sep 17 00:00:00 2001
From: bechi <bechilandia@gmail.com>
Date: Wed, 22 Oct 2014 15:03:28 -0300
Subject: [PATCH] fix layout sidebar & add new wallet

---
 css/src/main.css  | 31 +++++++++++++++++++++++--------
 views/manage.html | 42 ++++++++++++++++++++++++++++--------------
 2 files changed, 51 insertions(+), 22 deletions(-)

diff --git a/css/src/main.css b/css/src/main.css
index 2123eae99..c6ecfd150 100644
--- a/css/src/main.css
+++ b/css/src/main.css
@@ -131,17 +131,17 @@ header .alt-currency {
 }
 
 .col1 {
-  width: 50px;
+  width: 56px;
   float: left;
 }
 
 .col2 {
-  width: 170px;
+  width: 164px;
   float: left;
 }
 
 .col3 {
-  height: 68px;
+  height: 62px;
   width: 30px;
   float: right;
   background-color: #23C9A9;
@@ -173,19 +173,20 @@ a {
 input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill, input:-webkit-autofill:focus, textarea:-webkit-autofill:focus, select:-webkit-autofill:focus {
   -webkit-box-shadow: 0 0 0px 1000px white inset;
 }
-ul.side-nav.wallets .avatar-wallet{
+
+.side-nav.wallets .avatar-wallet{
   background-color: #7A8C9E;
   color: #213140;
   padding: 0.35rem 0.7rem;
   margin-top: 6px;
-  margin-left: 7px;
+  width: 35px;
 }
 
 .avatar-wallet {
   font-size: 20px;
   font-weight: 700;
   margin-top: 10px;
-  margin-left: 4px;
+  margin-left: 10px;
   margin-right: 8px;
   padding: 0.5rem 0.8rem;
   background-color: #fff;
@@ -809,8 +810,10 @@ input[type='submit']
 
 button.secondary, 
 .button.secondary { 
-  background-color: #4A90E2;
   color: #fff;
+  background: #008CC1;
+  -moz-box-shadow:    1px 1px 0px 0px #10769D;
+  box-shadow:         1px 1px 0px 0px #10769D;
 }
 button.secondary:hover, 
 button.secondary:focus, 
@@ -933,6 +936,8 @@ button[disabled].white:focus,
 /* BLACK */
 button.black, 
 .button.black { 
+  -moz-box-shadow:    1px 1px 0px 0px #1B2937;
+  box-shadow:         1px 1px 0px 0px #1B2937;
   background-color: #2C3E50;
   color: #fff;
 }
@@ -980,7 +985,7 @@ button.gray:focus,
 
 .side-nav.wallets {
   background-color: #213140 ;
-  padding: 0.7rem;
+  padding: 1.2rem 0.7rem;
   border-bottom: 1px solid #3A4E61;
   overflow-y: auto;
   height: 280px;
@@ -1005,6 +1010,7 @@ button.gray:focus,
 .side-nav li.nav-item:hover {
   background-color: #3C4E60;
   overflow: hidden;
+  border-radius: 3px;
 }
 
 
@@ -1014,6 +1020,7 @@ button.gray:focus,
   font-size: 16px;
   line-height: 40px;
   font-weight: 100;
+  margin-bottom: 10px;
 }
 
 .side-nav li.active>a:first-child:not(.button) {
@@ -1249,6 +1256,14 @@ a.text-warning:hover {color: #FD7262;}
   text-align: left;
 }
 
+.panel {
+  border-radius: 3px;
+  background: #FFFFFF;
+  -moz-box-shadow:    1px 1px 0px 0px rgba(32,48,64,0.10);
+  box-shadow:         1px 1px 0px 0px rgba(32,48,64,0.10);
+  border: none;
+}
+
 /**** Copy to clipboard ****/
 
 .btn-copy {
diff --git a/views/manage.html b/views/manage.html
index 8e68c9fe1..870510027 100644
--- a/views/manage.html
+++ b/views/manage.html
@@ -1,5 +1,33 @@
 <div class="backup" ng-controller="ManageController">
   <h1 translate>Manage Wallets</h1>
+  <div class="row collapse">
+    <div class="large-12 columns">
+      <div class="large-4 columns" >
+        <div class="panel text-center" ui-route="{{create}}">
+          <div><i class="size-72 fi-plus text-gray"></i></div>
+          <p class="text-gray">Create a new Wallet</p>
+          <a href="#!/create" class="button primary radius" title="Create"> {{'Create' | translate }} </a>
+        </div>    
+      </div>
+      <div class="large-4 columns" ui-route="{{create}}">
+        <div class="panel text-center">
+          <div><i class="size-72 fi-torsos-all text-gray"></i></div>
+          <p class="text-gray">Join an existent Wallet</p>
+          <a href="#!/join" class="button secondary radius" title="Join"> {{'Join' | translate }} </a>
+        </div>    
+      </div>
+      <div class="large-4 columns" ui-route="{{create}}">
+        <div class="panel text-center">
+          <div><i class="size-72 fi-download text-gray"></i></div>
+          <p class="text-gray">Import a Wallet to Copay</p>
+          <a href="#!/import" class="button black radius" title="Import"> {{'Import wallet' | translate }}</a>
+        </div>    
+      </div>
+    </div>
+  </div>
+
+
+  <div class="large-12 columns line-dashed-h m30v"></div>
   <div class="oh large-12 columns panel">
     <h3><i class="fi-download m10r"></i> <span translate>Manage Wallets</span> </h3>
     <p translate class="large-8 columns 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>
@@ -19,18 +47,4 @@
       </div>
     </div>
   </div>
-  <div class="large-12 columns line-dashed-h m15b"></div>
-  <div class="row collapse">
-    <ul>
-      <li class="nav-item" ui-route="{{create}}">
-        <a href="#!/create" class="db p20h" title="Create"><i class="size-21 m20r fi-plus"></i> {{'Create' | translate }} </a>
-      </li>
-      <li class="nav-item" ui-route="{{create}}">
-        <a href="#!/join" class="db p20h" title="Join"><i class="size-21 m20r fi-torsos-all"></i> {{'Join' | translate }} </a>
-      </li>
-      <li class="nav-item" ui-route="{{create}}">
-        <a href="#!/import" class="db p20h" title="Create"><i class="size-21 m20r fi-download"></i> {{'Import wallet' | translate }} </a>
-      </li>
-    </ul>
-  </div>
 </div>