From af5b19185af76e8aaf974c690488da8ddb994793 Mon Sep 17 00:00:00 2001
From: Bradley Suira <bradleysuira@gmail.com>
Date: Mon, 7 Dec 2020 13:01:12 -0500
Subject: [PATCH 1/3] fixes from qa doc and update unlock and login screens
 acording to ui

---
 src/assets/scss/_overrides.scss             |  2 +-
 src/assets/scss/style.scss                  | 32 +++++++++++++++++++--
 src/components/DetailsContainer.vue         |  5 ++--
 src/components/FeeSelector.vue              |  4 +--
 src/components/NavBar.vue                   |  2 +-
 src/views/ImportWallet.vue                  |  8 ++++--
 src/views/Onboarding/OnboardingPassword.vue | 12 ++++----
 src/views/Receive.vue                       | 23 +++++++++++----
 src/views/Send.vue                          |  2 +-
 src/views/Swap.vue                          | 19 ++++--------
 src/views/UnlockWallet.vue                  | 20 +++++++------
 11 files changed, 84 insertions(+), 45 deletions(-)

diff --git a/src/assets/scss/_overrides.scss b/src/assets/scss/_overrides.scss
index 9c72f66fc..895ecc95b 100644
--- a/src/assets/scss/_overrides.scss
+++ b/src/assets/scss/_overrides.scss
@@ -12,7 +12,7 @@ $color-text-primary: #1D1E21;
 $color-text-secondary: #FFFFFF;
 $color-text-muted: #747E8D;
 
-$font-size-base:              0.875rem; // Assumes the browse, typically `16px`
+$font-size-base:              0.75rem; // Assumes the browse, typically `16px`
 $font-size-lg:                1rem;
 $font-size-sm:                0.8125rem;
 $font-size-tiny:              0.75rem;
diff --git a/src/assets/scss/style.scss b/src/assets/scss/style.scss
index f5e529c46..7e582400e 100644
--- a/src/assets/scss/style.scss
+++ b/src/assets/scss/style.scss
@@ -47,14 +47,25 @@ textarea {
 
 .login-wrapper {
   display: flex;
-
   flex: 1;
-  justify-content: space-between;
   text-align: center;
   padding: 70px $wrapper-padding 0 $wrapper-padding;
   flex-direction: column;
   background: $brand-gradient-secondary;
   color: $color-text-secondary;
+  height: 600px;
+
+  .login-footer {
+    display: flex;
+    justify-content: flex-end;
+    flex-direction: column; 
+    flex: 1;
+    padding-bottom: 1.25rem;
+    .footer-content {
+      display: flex;
+      justify-content: space-between;
+    }
+  }
 
   .form input {
     color: $color-text-secondary;
@@ -75,7 +86,7 @@ textarea {
 }
 
 .login-header {
-  padding-bottom: 40px;
+  padding-bottom: 50px;
 
   svg {
     height: 75px;
@@ -370,4 +381,19 @@ textarea {
 
 .icon-btn {
   cursor: pointer;
+}
+
+svg.copy-icon {
+  cursor: pointer;
+  width: 12px;
+  margin-left: 4px;
+}
+
+svg.qr-icon {
+  cursor: pointer;
+  width: 21px;
+}
+
+.btn-footer {
+ width: 9.5rem;
 }
\ No newline at end of file
diff --git a/src/components/DetailsContainer.vue b/src/components/DetailsContainer.vue
index ffaa82fb6..54aae8b0c 100644
--- a/src/components/DetailsContainer.vue
+++ b/src/components/DetailsContainer.vue
@@ -42,8 +42,8 @@ export default {
     align-items: center;
     flex-wrap: wrap;
     align-content: space-between;
-    font-size: $font-size-sm;
-    line-height: $font-size-sm;
+    font-size: $font-size-tiny;
+    line-height: $font-size-tiny;
 
     svg {
       height: 5px;
@@ -63,6 +63,7 @@ export default {
 
   .details-content {
     padding: 0;
+    font-size: $font-size-tiny;
     ul {
     list-style-type: none;
     background: #ffffff;
diff --git a/src/components/FeeSelector.vue b/src/components/FeeSelector.vue
index 33adf7f3c..12b50aae9 100644
--- a/src/components/FeeSelector.vue
+++ b/src/components/FeeSelector.vue
@@ -21,7 +21,7 @@ export default {
     getTooltip (name) {
       let content = '<div class="text-right">'
       if (this.fees[name].wait) {
-        content += `${this.fees[name].wait} sec`
+        content += `${this.fees[name].wait} sec<br />`
       }
 
       if (this.txTypes) {
@@ -29,7 +29,7 @@ export default {
           return accum.plus(getTxFee(this.asset, tx, this.fees[name].fee))
         }, BN(0))
         const totalFiat = prettyFiatBalance(total, this.fiatRates[this.asset])
-        content += `<br />${total} ${this.asset}`
+        content += `${total} ${this.asset}`
         content += `<br />${totalFiat} USD`
       }
 
diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
index 8aae17302..ac68c3bf1 100644
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@@ -4,7 +4,7 @@
       <router-link v-if="showBack" class="navbar_prev" v-bind:to="backPath">
         <div><ChevronLeftIcon class="navbar_prev_icon" />{{ backLabel }}</div>
       </router-link>
-      <a v-if="showBackButton" class="navbar_prev" href="" @click="backClick">
+      <a v-else-if="showBackButton" class="navbar_prev" href="#" @click="backClick">
         <div><ChevronLeftIcon class="navbar_prev_icon" />{{ backLabel }}</div>
       </a>
       <div class="navbar_title">
diff --git a/src/views/ImportWallet.vue b/src/views/ImportWallet.vue
index 38fb6f22e..92298e376 100644
--- a/src/views/ImportWallet.vue
+++ b/src/views/ImportWallet.vue
@@ -12,8 +12,12 @@
       <form class="form import-wallet_seed" autocomplete="off">
         <div v-for="(e, n) in numWords" :key="n"><input type="text" class="form-control form-control-sm" v-model="wordList[n]" autocomplete="off" required /></div>
       </form>
-      <p><button class="btn btn-primary btn-lg btn-block" :disabled="disableNext" @click="next">Continue</button></p>
-      <p><button class="btn btn-light btn-outline-primary btn-lg btn-block btn-icon" @click="$router.go(-1)">Cancel</button></p>
+    </div>
+    <div class="login-footer bg-white">
+        <div class="footer-content">
+          <button class="btn btn-light btn-outline-primary btn-lg btn-footer btn-icon" @click="$router.go(-1)">Cancel</button>
+          <button class="btn btn-primary btn-lg btn-footer" :disabled="disableNext" @click="next">Continue</button>
+        </div>
     </div>
   </div>
 </template>
diff --git a/src/views/Onboarding/OnboardingPassword.vue b/src/views/Onboarding/OnboardingPassword.vue
index 51bcdae62..bf9cd0f72 100644
--- a/src/views/Onboarding/OnboardingPassword.vue
+++ b/src/views/Onboarding/OnboardingPassword.vue
@@ -21,14 +21,16 @@
         <small v-show="passwordMatch" class="form-text hidden" >Passwords don't match.</small>
         <small class="form-text">Password must be at least 8 characters.</small>
       </div>
-      <p>
-        <button class="btn btn-primary btn-lg btn-block btn-icon" :disabled="loading || disableNext" @click="next">
+    </form>
+    <div class="login-footer">
+      <div class="footer-content">
+        <button class="btn btn-light btn-lg btn-footer btn-icon" @click="$router.go(-1)">Cancel</button>
+        <button class="btn btn-primary btn-lg btn-footer btn-icon" :disabled="loading || disableNext" @click="next">
           <SpinnerIcon class="btn-loading" v-if="loading" />
           <template v-else>Continue</template>
         </button>
-      </p>
-      <p><button class="btn btn-light btn-lg btn-block btn-icon" @click="$router.go(-1)">Cancel</button></p>
-    </form>
+      </div>
+    </div>
   </div>
 </template>
 
diff --git a/src/views/Receive.vue b/src/views/Receive.vue
index bd7183aee..22aa72c17 100644
--- a/src/views/Receive.vue
+++ b/src/views/Receive.vue
@@ -8,7 +8,16 @@
         <div class="form-group">
           <div class="receive_asset"><img :src="getAssetIcon(asset)" class="asset-icon" /></div>
           <label>Your Current {{chainName}} Address</label>
-          <p class="receive_address">{{address}}</p>
+          <p class="receive_address">{{address}}
+            <CopyIcon
+                  class="copy-icon"
+                  @click="copy"
+                  v-tooltip.bottom="{
+                    content: copied ? 'Copied!' : 'Copy',
+                    hideOnTargetClick: false,
+                  }"
+                />
+          </p>
           <p class="receive_message">Scan this QR code with a mobile wallet to send funds to this address.</p>
           <div v-if="qrcode" v-html="qrcode" class="receive_qr"></div>
         </div>
@@ -30,7 +39,7 @@
 <script>
 import { mapActions, mapState } from 'vuex'
 import QRCode from 'qrcode'
-import { getChainFromAsset, getAssetIcon } from '@/utils/asset'
+import { getAssetIcon } from '@/utils/asset'
 import NavBar from '@/components/NavBar'
 import CopyIcon from '@/assets/icons/copy.svg'
 import TickIcon from '@/assets/icons/tick.svg'
@@ -58,12 +67,13 @@ export default {
       return address && cryptoassets[this.asset].formatAddress(address)
     },
     chainName () {
-      const chain = getChainFromAsset(this.asset)
       return ({
         BTC: 'bitcoin',
         ETH: 'ethereum',
-        RBTC: 'ethereum'
-      })[chain]
+        RBTC: 'rbtc/rsk',
+        DAI: 'dai/ethereum',
+        UNI: 'uni/ethereum'
+      })[this.asset]
     }
 
   },
@@ -109,7 +119,8 @@ export default {
     width: 196px;
   }
   &_address {
-    font-size: $font-size-sm;
+    font-size: $font-size-tiny;
+    font-weight: lighter;
   }
 }
 </style>
diff --git a/src/views/Send.vue b/src/views/Send.vue
index 892e3b564..d48fea738 100644
--- a/src/views/Send.vue
+++ b/src/views/Send.vue
@@ -155,7 +155,7 @@
           </label>
           <div class="d-flex align-items-center justify-content-between mt-0">
             <div>
-            {{ totalFee }} {{ feeType }}
+            ~{{ totalFee }} {{ feeType }}
           </div>
           <div class="details-text">${{ totalFeeInFiat }}</div>
           </div>
diff --git a/src/views/Swap.vue b/src/views/Swap.vue
index 7530e843b..fac55d30e 100644
--- a/src/views/Swap.vue
+++ b/src/views/Swap.vue
@@ -167,8 +167,10 @@
               <span class="details-title">Network Speed/Fee</span>
               <span class="text-muted">
                 {{ assetChain }}
-                {{ getSelectedFeeLabel(selectedFee[assetChain]) }} /
-                {{ toAssetChain }}
+                {{ getSelectedFeeLabel(selectedFee[assetChain]) }}
+              </span>
+              <span class="text-muted" v-if="assetChain != toAssetChain">
+                /{{ toAssetChain }}
                 {{ getSelectedFeeLabel(selectedFee[toAssetChain]) }}
               </span>
             </template>
@@ -224,7 +226,7 @@
           <div class="detail-group">
             <label class="text-muted"> Network Fee </label>
             <div class="d-flex align-items-center justify-content-between mt-0">
-              <div>{{ totalFees[assetChain] }} {{ sendFeeType }}</div>
+              <div>~{{ totalFees[assetChain] }} {{ sendFeeType }}</div>
               <div class="details-text">
                 ${{
                   prettyFiatBalance(totalFees[assetChain], fiatRates[asset])
@@ -699,15 +701,4 @@ export default {
     }
   }
 }
-
-svg.copy-icon {
-  cursor: pointer;
-  width: 14px;
-  margin-left: 6px;
-}
-
-svg.qr-icon {
-  cursor: pointer;
-  width: 21px;
-}
 </style>
diff --git a/src/views/UnlockWallet.vue b/src/views/UnlockWallet.vue
index 5ed472ab1..2bb5ad41f 100644
--- a/src/views/UnlockWallet.vue
+++ b/src/views/UnlockWallet.vue
@@ -6,7 +6,7 @@
     <div>
       <h2>Open your wallet</h2>
     </div>
-    <form class="form" autocomplete="off" v-on:submit.prevent="unlock">
+    <form class="form" autocomplete="off">
       <div class="form-group">
         <label for="password">Password</label>
         <div class="input-group">
@@ -19,14 +19,18 @@
           </ul>
         </p>
       </div>
-      <p><router-link to="/onboarding/import">Forgot password? Import with seed phrase</router-link></p>
-      <p>
-        <button class="btn btn-light btn-lg btn-block btn-icon" type="submit" :disabled="loading">
-          <SpinnerIcon v-if="loading" />
-          <template v-else>Unlock</template>
-        </button>
-      </p>
     </form>
+     <div class="login-footer">
+        <p><router-link to="/onboarding/import">Forgot password? Import with seed phrase</router-link></p>
+        <div class="footer-content">
+          <button class="btn btn-light btn-lg btn-block btn-icon" 
+                  :disabled="loading"
+                  @click="unlock">
+            <SpinnerIcon v-if="loading" />
+            <template v-else>Unlock</template>
+          </button>
+        </div>
+      </div>
   </div>
 </template>
 

From e10a2bb0a7995537386cb80df8138445e3731247 Mon Sep 17 00:00:00 2001
From: Bradley Suira <bradleysuira@gmail.com>
Date: Mon, 7 Dec 2020 13:03:08 -0500
Subject: [PATCH 2/3] removed unused class style

---
 src/views/UnlockWallet.vue | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/views/UnlockWallet.vue b/src/views/UnlockWallet.vue
index 2bb5ad41f..c2782c0e7 100644
--- a/src/views/UnlockWallet.vue
+++ b/src/views/UnlockWallet.vue
@@ -23,7 +23,7 @@
      <div class="login-footer">
         <p><router-link to="/onboarding/import">Forgot password? Import with seed phrase</router-link></p>
         <div class="footer-content">
-          <button class="btn btn-light btn-lg btn-block btn-icon" 
+          <button class="btn btn-light btn-lg btn-block btn-icon"
                   :disabled="loading"
                   @click="unlock">
             <SpinnerIcon v-if="loading" />
@@ -71,7 +71,5 @@ export default {
 </script>
 
 <style lang="scss">
-.unlock-wallet {
 
-}
 </style>

From e07d3116d273fe1f68c4456e24b545ae4d1eeaf7 Mon Sep 17 00:00:00 2001
From: Bradley Suira <bradleysuira@gmail.com>
Date: Mon, 7 Dec 2020 13:17:11 -0500
Subject: [PATCH 3/3] bumped version to 0.8.7

---
 package-lock.json         | 2 +-
 package.json              | 2 +-
 src/manifest.json         | 2 +-
 src/views/SwapDetails.vue | 3 ++-
 4 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 3bced13e7..1963fdb39 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "liquality-wallet",
-  "version": "0.8.6",
+  "version": "0.8.7",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/package.json b/package.json
index 0bc024953..02c852778 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "liquality-wallet",
-  "version": "0.8.6",
+  "version": "0.8.7",
   "private": true,
   "license": "MIT",
   "author": "Liquality <info@liquality.io>",
diff --git a/src/manifest.json b/src/manifest.json
index cb5900612..378d797ba 100644
--- a/src/manifest.json
+++ b/src/manifest.json
@@ -1,6 +1,6 @@
 {
   "manifest_version": 2,
-  "version": "0.8.6",
+  "version": "0.8.7",
   "name": "Liquality Wallet",
   "description": "Secure multi-crypto wallet with built-in Atomic Swaps!",
   "homepage_url": "https://liquality.io",
diff --git a/src/views/SwapDetails.vue b/src/views/SwapDetails.vue
index e840ba7b9..cabb74de3 100644
--- a/src/views/SwapDetails.vue
+++ b/src/views/SwapDetails.vue
@@ -21,7 +21,8 @@
             <p>{{prettyBalance(item.fromAmount, item.from)}} {{item.from}}</p>
           </div>
           <div class="col">
-            <h2>Received</h2>
+            <h2 v-if="['SUCCESS', 'REFUNDED'].includes(item.status)">Received</h2>
+            <h2 v-else>Pending Receipt</h2>
             <p>{{prettyBalance(item.toAmount, item.to)}} {{item.to}}</p>
           </div>
         </div>