From 11f18a9d3090aa9b48db7fb805eb9cd9d29ba463 Mon Sep 17 00:00:00 2001
From: Gustavo Cortez <cmgustavo83@gmail.com>
Date: Thu, 15 May 2014 18:02:21 -0300
Subject: [PATCH] Fixes import backup form

---
 css/main.css        | 54 +++++++++++----------------------------------
 css/tpl-clean.css   |  6 +++++
 css/tpl-default.css | 39 ++++++++++++++++++++++++++++++++
 index.html          | 39 ++++++++++++++++++++------------
 4 files changed, 83 insertions(+), 55 deletions(-)

diff --git a/css/main.css b/css/main.css
index f44f11a5e..0c9cf06b5 100644
--- a/css/main.css
+++ b/css/main.css
@@ -149,18 +149,6 @@ html, body {height: 100%;}
   padding: 0;
 }
 
-/*.btransactions .txheader {
-  font-size: 12px;
-  margin-bottom: 10px;
-  padding-bottom: 10px;
-}
-
-.btransactions .txbottom {
-  margin-top: 10px;
-  padding-top: 10px;
-  font-size: 12px;
-}*/
-
 .pending table {
   width: 100%;
   border: none;
@@ -496,6 +484,19 @@ a.loading {
  vertical-align:middle
 }
 
+fieldset {
+  border: 1px solid #eee;
+  padding: 1.11111rem;
+  margin: 1rem 0;
+}
+
+fieldset legend {
+  font-weight: bold;
+  padding: 0 0.16667rem;
+  margin: 0;
+  margin-left: -0.16667rem;
+}
+
 /* notifications */
 
 .dr-notification-container {
@@ -532,7 +533,6 @@ a.loading {
 
 .dr-notification {
   width: 380px;
-  background-color: #2C3E50;
   clear: both;
   min-height: 80px;
   max-height: 90px;
@@ -540,8 +540,6 @@ a.loading {
   -moz-border-radius: 5px;
   -ms-border-radius: 5px;
   border-radius: 5px;
-  color: #bfe2de;
-  border: 1px solid rgba(4, 94, 123, 0.85);
   overflow: hidden;
 }
 
@@ -552,10 +550,7 @@ a.loading {
   border-radius: 20px;
   display: inline-block;
   padding: 3px;
-  background-color: #2C3E50;
   font-size: 14px;
-  color: #adfaff;
-  border: 1px solid rgba(4, 94, 123, 0.85);
   position: absolute;
   right: -11px;
   top: 5px;
@@ -595,26 +590,6 @@ a.loading {
   min-width: 48px;
 }
 
-.dr-notification-image.dr-notification-type-info {
-  color: #FFF;
-}
-
-.dr-notification-image.dr-notification-type-warning {
-  color: #FFA226;
-}
-
-.dr-notification-image.dr-notification-type-error {
-  color: #FF4B4F;
-}
-
-.dr-notification-image.dr-notification-type-success {
-  color: #B4D455;
-}
-
-.dr-notification-image.success {
-  color: #B4D455;
-}
-
 .dr-notification-content {
   padding-left: 100px;
   padding-right: 15px;
@@ -632,6 +607,3 @@ p.dr-notification-text {
   font-size: 12px;
 }
 
-input.ng-invalid-wallet-secret {
-  background: #FFB6C1;
-}
diff --git a/css/tpl-clean.css b/css/tpl-clean.css
index af66f4381..0df4a0644 100644
--- a/css/tpl-clean.css
+++ b/css/tpl-clean.css
@@ -6,3 +6,9 @@
   background: #333;
   color: #fff;
 }
+
+.dr-notification {
+  background-color: #000;
+  color: #fff;
+  border: 1px solid #eee;
+}
diff --git a/css/tpl-default.css b/css/tpl-default.css
index 67da29d74..f81b4ff12 100644
--- a/css/tpl-default.css
+++ b/css/tpl-default.css
@@ -282,3 +282,42 @@ button[disabled].warning:focus,
   color: #fff;
 }
 
+fieldset legend {
+  background: #F8F8FB;
+}
+
+input.ng-invalid-wallet-secret {
+  background: #FFB6C1;
+}
+
+.dr-notification {
+  background-color: #2C3E50;
+  color: #bfe2de;
+  border: 1px solid rgba(4, 94, 123, 0.85);
+}
+.dr-notification-close-btn {
+  background-color: #2C3E50;
+  color: #adfaff;
+  border: 1px solid rgba(4, 94, 123, 0.85);
+}
+
+.dr-notification-image.dr-notification-type-info {
+  color: #FFF;
+}
+
+.dr-notification-image.dr-notification-type-warning {
+  color: #FFA226;
+}
+
+.dr-notification-image.dr-notification-type-error {
+  color: #FF4B4F;
+}
+
+.dr-notification-image.dr-notification-type-success {
+  color: #B4D455;
+}
+
+.dr-notification-image.success {
+  color: #B4D455;
+}
+
diff --git a/index.html b/index.html
index 186c92917..1de5fd5d7 100644
--- a/index.html
+++ b/index.html
@@ -221,22 +221,33 @@
           <i class="size-21 fi-bitcoin-circle icon-rotate spinner"></i>
           Importing wallet...
         </div>
-        <div class="large-6 large-centered medium-6 medium-centered columns" ng-init="choosefile=0; pastetext=0" ng-show="!loading">
-          <h2>{{title}}</h2>
+        <div ng-init="choosefile=0; pastetext=0" ng-show="!loading">
+          <h3>{{title}}</h3>
           <form name="importForm" ng-submit="import(importForm)" novalidate>
-            <fieldset>
-            <legend>Select which method want to use to restore</legend>
-              <label for="backupFile" ng-click="choosefile=!choosefile" class="m10b"><i class="fi-upload"></i> Choose backup file from your computer</label>
-              <input type="file" class="form-control" placeholder="Select a backup file" name="backupFile" ng-model="backupFile" ng-file-select ng-show="choosefile">
-              <label for="backupText" ng-click="pastetext=!pastetext" class="m10b"><i class="fi-paperclip"></i> Paste backup plain text code</label>
-              <textarea class="form-control" name="backupText" ng-model="backupText" rows="5" ng-show="pastetext"></textarea>
-            </fieldset>
+            <div class="row">
+              <div class="large-6 large-centered medium-6 medium-centered columns">
+                <fieldset>
+                  <legend>Select which method want to use to restore</legend>
+                  <label for="backupFile" ng-click="choosefile=!choosefile" class="m10b">&middot; Choose backup file from your computer <i class="fi-laptop"></i></label>
+                  <input type="file" class="form-control" placeholder="Select a backup file" name="backupFile" ng-model="backupFile" ng-file-select ng-show="choosefile">
+                  <label for="backupText" ng-click="pastetext=!pastetext" class="m10b">&middot; Paste backup plain text code <i class="fi-clipboard"></i></label>
+                  <textarea class="form-control" name="backupText" ng-model="backupText" rows="5" ng-show="pastetext"></textarea>
+                </fieldset>
 
-            <label for="password">Password <small>Required</small></label>
-            <input type="password" class="form-control" placeholder="Your wallet password" name="password" ng-model="password" required>
-            <button type="submit" class="button primary radius" ng-disabled="importForm.$invalid" loading="Importing">
-              Import backup
-            </button>
+                <div class="large-8 medium-8 columns">
+                  <label for="password">Password <small>Required</small></label>
+                  <input type="password" class="form-control" placeholder="Your wallet password" name="password" ng-model="password" required>
+                </div>
+              </div>
+            </div>
+            <div class="row">
+              <div class="large-12 columns line-dashed">
+                <button type="submit" class="button primary radius right" ng-disabled="importForm.$invalid" loading="Importing">
+                  Import backup
+                </button>
+                <a class="button secondary radius" href="#signin">Go back</a>
+              </div>
+            </div>
           </form>
         </div>
       </div>