From f98e606e90e3968940c1cfb38052a68ce44825fe Mon Sep 17 00:00:00 2001
From: Bechi <bechilandia@gmail.com>
Date: Mon, 26 May 2014 16:37:56 -0300
Subject: [PATCH 1/4] fix mobile interface

---
 css/main.css        | 50 ++++++++++++++++++++++++++++++++++++---------
 css/tpl-clean.css   |  2 +-
 css/tpl-default.css |  4 ++--
 index.html          |  9 ++++----
 4 files changed, 47 insertions(+), 18 deletions(-)

diff --git a/css/main.css b/css/main.css
index 037b80b42..8f36b2597 100644
--- a/css/main.css
+++ b/css/main.css
@@ -54,7 +54,7 @@ html, body {height: 100%;}
   position: relative;
   float: right;
   margin-left: 15px;
-  height: 62px;
+  /* height: 551px; */
 }
 
 .logo {
@@ -64,13 +64,6 @@ html, body {height: 100%;}
   margin: 0 auto;
 }
 
-@media (max-width: 640px) {
-  .logo {
-    margin: 0 auto;
-    margin-bottom: 10px;
-  }
-}
-
 .top-bar-section li:not(.has-form) a:not(.button) {
   line-height: 60px;
 }
@@ -129,7 +122,6 @@ html, body {height: 100%;}
 }
 
 .panel {
-  /* padding: 0.7rem 1rem; */
   border:0;
 }
 
@@ -155,7 +147,7 @@ html, body {height: 100%;}
 }
 
 .box-backup {
-  margin: 2rem 0;
+  margin: 0.6rem 0;
   padding: 2rem 1rem;
 }
 
@@ -621,3 +613,41 @@ p.dr-notification-text {
   white-space: nowrap;
 }
 
+@media only screen and (max-width: 40em) { 
+  .top-bar {
+    background: #1ABC9C;
+  }
+
+  .header-content {
+    padding: 0.3rem 0rem 1rem 0.4rem;
+  }
+
+  .logo {
+    background-size: 90px 44px !important;
+    float: left;
+    margin-top: 0.7rem;
+  }
+
+  .header-content .small-9 {
+    text-align: right !important;
+  }
+
+  .header-content .line-dashed-v {
+    border: none !important;  
+  }
+
+  .header-content {
+    font-size: 80%;
+    line-height: 140%;
+  }
+
+  .box-backup {
+    margin: 0.6rem 0;
+  }
+
+  #footer {
+    font-size: 80%;
+    padding: 0.2rem 0.5rem;
+  }
+
+}
\ No newline at end of file
diff --git a/css/tpl-clean.css b/css/tpl-clean.css
index 0df4a0644..a6b2c3581 100644
--- a/css/tpl-clean.css
+++ b/css/tpl-clean.css
@@ -1,5 +1,5 @@
 .logo {
-  background: transparent url('../img/logo.png');
+  background: transparent url('../img/logo.png') no-repeat;
 }
 
 #footer {
diff --git a/css/tpl-default.css b/css/tpl-default.css
index d2bf404c0..47e2494f7 100644
--- a/css/tpl-default.css
+++ b/css/tpl-default.css
@@ -38,8 +38,8 @@ body {
 }
 
 .logo {
-  background: transparent url('../img/logo-negative.svg');
-  background-size: 131px 51px;
+  background: transparent url('../img/logo-negative.svg') no-repeat;
+  background-size: 130px 51px;
 }
 
 .top-bar-section li:not(.has-form) a:not(.button) {
diff --git a/index.html b/index.html
index 290ce3bba..2dec8136d 100644
--- a/index.html
+++ b/index.html
@@ -16,10 +16,10 @@
       <div data-ng-init="init()" data-ng-controller="HeaderController">
         <div class="header"> 
           <div class="header-content">
-            <div class="large-3 medium-3 columns">
+            <div class="large-3 medium-3 small-3 columns">
               <span class="logo"></span>
             </div>
-            <div class="large-9 medium-9 columns text-center p10t" ng-show="$root.wallet">
+            <div class="large-9 medium-9 small-9 columns text-center p10t" ng-show="$root.wallet">
               <div class="large-4 medium-4 columns line-dashed-v">
                 <a href="#/addresses" class="has-tip" tooltip-placement="bottom" tooltip="{{$root.wallet.id}}">
                   <strong><span>{{$root.wallet.getName()}}</span></strong>
@@ -56,7 +56,7 @@
           <ul class="title-area">
             <li class="name"></li>
             <li class="toggle-topbar menu-icon">
-              <a ng-click="isCollapsed=!isCollapsed"> Menu</a>
+              <a ng-click="isCollapsed=!isCollapsed"></a>
             </li>
           </ul>
 
@@ -133,7 +133,7 @@
       </div>
     </div>
     <div class="row p10t" ng-show="$root.wallet">
-      <div class="large-3 medium-3 small-3 columns">
+      <div class="large-3 medium-3 hide-for-small columns">
         <div>
           <strong>{{$root.wallet.getName()}}</strong>
         </div>
@@ -347,7 +347,6 @@
                       <i class="fi-bitcoin"></i>
                     </span>
                   </span>
-
                 </a>
 
                 <button class="button small secondary radius" ng-click="showAll=!showAll" ng-show="(addresses|withoutFunds) > 1"> 

From 4803375b7c68ec505adb6f4d9cdd074687a9a024 Mon Sep 17 00:00:00 2001
From: Bechi <bechilandia@gmail.com>
Date: Tue, 27 May 2014 15:40:59 -0300
Subject: [PATCH 2/4] transaction page

---
 css/main.css | 30 ++++++++++++++++++++++++------
 index.html   | 32 ++++++++++++++++----------------
 2 files changed, 40 insertions(+), 22 deletions(-)

diff --git a/css/main.css b/css/main.css
index 8f36b2597..e364e6216 100644
--- a/css/main.css
+++ b/css/main.css
@@ -320,7 +320,7 @@ hr { margin: 2.25rem 0;}
 
 .box-copayers figure {
   width: 51px;
-  height: 55px;
+  height: 63px;
   border-top-left-radius: 4px 4px;
   border-bottom-left-radius: 4px 4px;
   overflow: hidden;
@@ -613,7 +613,21 @@ p.dr-notification-text {
   white-space: nowrap;
 }
 
+ul.pagination li.current a {
+  background: #1ABC9C;
+}
+
+ul.pagination li.current a:hover, ul.pagination li.current a:focus {
+  background: #16A085;
+}
+
 @media only screen and (max-width: 40em) { 
+
+  #main, .header-content {
+    font-size: 80%;
+    line-height: 140%;
+  }
+
   .top-bar {
     background: #1ABC9C;
   }
@@ -636,11 +650,6 @@ p.dr-notification-text {
     border: none !important;  
   }
 
-  .header-content {
-    font-size: 80%;
-    line-height: 140%;
-  }
-
   .box-backup {
     margin: 0.6rem 0;
   }
@@ -650,4 +659,13 @@ p.dr-notification-text {
     padding: 0.2rem 0.5rem;
   }
 
+  .box-status {
+    height: 71px;
+  }
+
+  .box-copayers figure {
+    height: 71px;
+    width: 71px;
+  }
+
 }
\ No newline at end of file
diff --git a/index.html b/index.html
index 2dec8136d..cdad2b12b 100644
--- a/index.html
+++ b/index.html
@@ -391,9 +391,9 @@
           <div class="large-12 columns">
             <h4> Transaction proposals <span ng-if="onlyPending">[Pending]</span>  <small>({{txs.length}})</small></h4>
 
-            <ul class="button-group">
-            <li> <button  ng-click="show(true)" ng-disabled="loading || onlyPending" loading="Updating"> Pending </button>
-            <li> <button  ng-click="show()" ng-disabled="loading || !onlyPending" loading="Updating"> All </button>
+            <ul class="button-group radius">
+            <li> <button class="secondary" ng-click="show(true)" ng-disabled="loading || onlyPending" loading="Updating"> Pending </button>
+            <li> <button class="secondary" ng-click="show()" ng-disabled="loading || !onlyPending" loading="Updating"> All </button>
             </ul>
             <div class="panel radius pending" ng-repeat="tx in txs | paged">
               <div class="txheader row m10">
@@ -484,7 +484,7 @@
                 </div>
               </div>
             </div>
-            <pagination ng-show="!onlyPending" total-items="txs.length" items-per-page="txpItemsPerPage" page="txpCurrentPage" on-select-page="show()" class="pagination-small"></pagination>
+            <pagination ng-show="!onlyPending" total-items="txs.length" items-per-page="txpItemsPerPage" page="txpCurrentPage" on-select-page="show()" class="pagination-small primary"></pagination>
           </div>
           <div class="large-12 columns">
             <h4>Last transactions</h4>
@@ -499,7 +499,7 @@
                 <div class="m15">
                   <div class="row">
                     <div class="large-8 columns">
-                      <a href="http://{{getShortNetworkName()}}.insight.is/tx/{{btx.txid}}" target="blank">
+                      <a class="ellipsis" href="http://{{getShortNetworkName()}}.insight.is/tx/{{btx.txid}}" target="blank">
                         {{btx.txid}}
                       </a>
                     </div>
@@ -509,24 +509,24 @@
                   </div>
                 </div>
                 <div class="tx-copayers">
-                  <div class="large-5 columns">
+                  <div class="large-5 small-5 columns">
                     <div ng-repeat="vin in btx.vin | groupByAddress">
-                      <p class="left text-gray size-12"> {{vin.addr}} </p>
-                      <small class="right">{{vin.value}}</small>
+                      <p class="small-8 ellipsis left text-gray size-12"> {{vin.addr}} </p>
+                      <small class="small-4 right">{{vin.value}}</small>
                     </div>
                   </div>
-                  <div class="large-1 columns text-center">
+                  <div class="large-1 small-1 columns text-center">
                     <i class="fi-arrow-right"></i>
                   </div>
-                  <div class="large-6 columns">
+                  <div class="large-6 small-6 columns">
                     <div ng-repeat="vout in btx.vout">
                       <div class="row">
-                        <div class="large-10 columns">
+                        <div class="large-10 small-8 columns">
                           <div ng-repeat="addr in vout.scriptPubKey.addresses">
-                            <p class="text-gray size-12"> {{addr}} </p>
+                            <p class="ellipsis text-gray size-12"> {{addr}} </p>
                           </div>
                         </div>
-                        <div class="large-2 columns">
+                        <div class="large-2 small-4 columns">
                           <small>{{vout.value}}</small>
                         </div>
                       </div>
@@ -535,9 +535,9 @@
                 </div>
                 <div class="m15 size-12 text-gray">
                   <div class="row">
-                    <div class="large-4 columns">Fees: {{btx.fees}}</div>
-                    <div class="large-4 columns text-center">Confirmations: {{btx.confirmations || 0}}</div>
-                    <div class="large-4 columns text-right">Total: {{btx.valueOut}}</div>
+                    <div class="large-4 medium-4 small-4 columns">Fees: {{btx.fees}}</div>
+                    <div class="large-4 medium-4 small-4 columns text-center">Confirmations: {{btx.confirmations || 0}}</div>
+                    <div class="large-4 medium-4 small-4 columns text-right">Total: {{btx.valueOut}}</div>
                   </div>
                 </div>
               </div>

From 836faeee299ffa653c11876606410b759d9aae20 Mon Sep 17 00:00:00 2001
From: Bechi <bechilandia@gmail.com>
Date: Wed, 28 May 2014 17:51:49 -0300
Subject: [PATCH 3/4] login

---
 css/main.css |  4 ++++
 index.html   | 44 ++++++++++++++++++++------------------------
 2 files changed, 24 insertions(+), 24 deletions(-)

diff --git a/css/main.css b/css/main.css
index e364e6216..8c3a1def9 100644
--- a/css/main.css
+++ b/css/main.css
@@ -668,4 +668,8 @@ ul.pagination li.current a:hover, ul.pagination li.current a:focus {
     width: 71px;
   }
 
+  .alert-box.secondary {
+    margin: 0 1rem;
+  }
+
 }
\ No newline at end of file
diff --git a/index.html b/index.html
index feb0f42a5..7932431d4 100644
--- a/index.html
+++ b/index.html
@@ -270,18 +270,16 @@
         </div>
         <div ng-show="!loading">
           <form name="setupForm" ng-submit="create(setupForm)" novalidate>
-          <div class="row">
-            <div class="small-12 medium-8 medium-centered large-8 large-centered columns box-setup">
-              <div class="large-6 columns line-dashed-v">
-                <h6>Select total number of copayers</h6>
-                <select ng-model="totalCopayers" ng-options="totalCopayers as totalCopayers for totalCopayers in TCValues">
-                </select>
-              </div>
-              <div class="large-6 columns">
-                <h6>Select required signatures</h6>
-                <select ng-model="requiredCopayers" ng-options="requiredCopayers as requiredCopayers for requiredCopayers in RCValues">
-                </select>
-              </div>
+          <div class="small-12 medium-8 medium-centered large-8 large-centered columns box-setup">
+            <div class="large-6 columns line-dashed-v">
+              <h6>Select total number of copayers</h6>
+              <select ng-model="totalCopayers" ng-options="totalCopayers as totalCopayers for totalCopayers in TCValues">
+              </select>
+            </div>
+            <div class="large-6 columns">
+              <h6>Select required signatures</h6>
+              <select ng-model="requiredCopayers" ng-options="requiredCopayers as requiredCopayers for requiredCopayers in RCValues">
+              </select>
             </div>
           </div>
           <div class="row">
@@ -300,18 +298,16 @@
               <h6>Wallet name <small>Optional</small></h6>
                 <input type="text" class="form-control" ng-model="walletName">
             </div>
-            <div class="large-6 large-centered columns m30v">
+            <div class="small-12 medium-6 medium-centered large-6 large-centered columns m30v">
               <h6>Your name <small>Optional</small></h6>
                 <input type="text" class="form-control" ng-model="myNickname">
             </div>
           </div>
-          <div class="row">
-            <div class="large-12 columns line-dashed">
-              <button type="submit" class="button primary radius right" ng-disabled="setupForm.$invalid || loading">
-               Create {{requiredCopayers}}-of-{{totalCopayers}} wallet
-              </button>
-              <a class="button secondary radius" href="#signin">Go back</a>
-            </div>
+          <div class="large-12 columns line-dashed">
+            <button type="submit" class="button primary radius right" ng-disabled="setupForm.$invalid || loading">
+             Create {{requiredCopayers}}-of-{{totalCopayers}} wallet
+            </button>
+            <a class="button secondary radius" href="#signin">Go back</a>
           </div>
           </form>
         </div>
@@ -349,10 +345,10 @@
                   </span>
                 </a>
 
-                <button class="button small secondary radius" ng-click="showAll=!showAll" ng-show="(addresses|withoutFunds) > 1"> 
+                <a class="secondary radius" ng-click="showAll=!showAll" ng-show="(addresses|withoutFunds) > 1"> 
                   <span ng-if="!showAll">Show all</span>
                   <span ng-if="showAll">Show less</span>
-                </button>
+                </a>
               </div>
               <div class="large-4 medium-4 columns line-dashed-v text-center" ng-show="selectedAddr">
                 <qrcode size="160" data="{{selectedAddr.address}}"></qrcode>
@@ -488,8 +484,8 @@
           </div>
           <div class="large-12 columns">
             <h4>Last transactions</h4>
-            <button ng-click="toogleLast()" ng-disabled="loading" loading="Updating" ng-hide="lastShowed && !loading">Show</button>
-            <button ng-click="toogleLast()" ng-disabled="loading" loading="Updating" ng-show="lastShowed && !loading">Hide</button>
+            <a ng-click="toogleLast()" ng-disabled="loading" loading="Updating" ng-hide="lastShowed && !loading">Show</a>
+            <a ng-click="toogleLast()" ng-disabled="loading" loading="Updating" ng-show="lastShowed && !loading">Hide</a>
             <div class="btransactions" ng-if="lastShowed">
               <div ng-if="!blockchain_txs[0].txid && !loading">
                 No transactions yet.

From 9cc70398f1856b993d04084f0472b498bada2163 Mon Sep 17 00:00:00 2001
From: Bechi <bechilandia@gmail.com>
Date: Thu, 29 May 2014 15:55:30 -0300
Subject: [PATCH 4/4] sign-up

---
 css/main.css |  4 ----
 index.html   | 30 +++++++++++++++++-------------
 2 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/css/main.css b/css/main.css
index 8c3a1def9..e364e6216 100644
--- a/css/main.css
+++ b/css/main.css
@@ -668,8 +668,4 @@ ul.pagination li.current a:hover, ul.pagination li.current a:focus {
     width: 71px;
   }
 
-  .alert-box.secondary {
-    margin: 0 1rem;
-  }
-
 }
\ No newline at end of file
diff --git a/index.html b/index.html
index 52380d704..0135f5e4c 100644
--- a/index.html
+++ b/index.html
@@ -84,6 +84,7 @@
 
       <div class="row">
         <div ng-if='$root.wallet && !$root.wallet.publicKeyRing.isComplete() && !loading'>
+          <div class="medium-12 small-12 columns">
             <div class="alert-box secondary radius" data-alert>
               <i class="fi-info"></i> 
               Not all copayers have joined your wallet yet. 
@@ -95,20 +96,23 @@
               </span>
               yet to join. 
             </div>
-
-            <div class="panel radius">
-              <h3 class="m15b">Share this secret with your other copayers
-                <small> for them to join your wallet</small>
-              </h3>
-              <div class="row">
-                <div class="large-9 medium-12 small-12 columns line-dashed-v text-gray">
-                  <div class="panel input">
-                    <p class="text-gray">{{$root.wallet.getSecret()}}</p>
+          </div>
+                      
+            <div class="medium-12 small-12 columns "> 
+              <div class="panel radius m30v">
+                <h3 class="m15b">Share this secret with your other copayers
+                  <small> for them to join your wallet</small>
+                </h3>
+                <div class="row">
+                  <div class="large-9 medium-12 small-12 columns line-dashed-v text-gray">
+                    <div class="panel input">
+                      <p class="ellipsis text-gray">{{$root.wallet.getSecret()}}</p>
+                    </div>
+                  </div>
+                  <div class="large-3 columns hide-for-medium hide-for-small" ng-show="$root.wallet">
+                    <h5 class="m0">{{$root.wallet.getName()}}</h5>
+                    <p class="text-gray">{{$root.wallet.requiredCopayers}}-of-{{$root.wallet.totalCopayers}} wallet</p>
                   </div>
-                </div>
-                <div class="large-3 columns hide-for-medium hide-for-small" ng-show="$root.wallet">
-                  <h5 class="m0">{{$root.wallet.getName()}}</h5>
-                  <p class="text-gray">{{$root.wallet.requiredCopayers}}-of-{{$root.wallet.totalCopayers}} wallet</p>
                 </div>
               </div>
             </div>