From 88818ece29fe09b94114f449bb304989959b9470 Mon Sep 17 00:00:00 2001
From: lepipele <lepipele@users.noreply.github.com>
Date: Thu, 29 Mar 2018 23:23:39 -0500
Subject: [PATCH] Both regular and lightning copy tabs with new simplified
 styles

---
 .../Views/Invoice/Checkout-Body.cshtml        | 61 ++++++++-----------
 BTCPayServer/wwwroot/css/normalizer.css       | 24 ++++++--
 2 files changed, 44 insertions(+), 41 deletions(-)

diff --git a/BTCPayServer/Views/Invoice/Checkout-Body.cshtml b/BTCPayServer/Views/Invoice/Checkout-Body.cshtml
index 785671607..2a01e8e2e 100644
--- a/BTCPayServer/Views/Invoice/Checkout-Body.cshtml
+++ b/BTCPayServer/Views/Invoice/Checkout-Body.cshtml
@@ -168,47 +168,36 @@
         <div class="copied-label" style="display:none;">
             <span>{{$t("Copied")}}</span>
         </div>
-        <nav v-if="srvModel.isLightning">
-            <div class="manual-box flipped" style="margin-bottom: 30px;">
-                <div class="manual-box__amount copySectionBox">
-                    <label>{{$t("BOLT 11 Invoice")}}</label>
-                    <div class="inputWithIcon">
-                        <input type="text" class="checkoutTextbox" v-bind:value="srvModel.btcAddress" readonly="readonly" />
-                        <img v-bind:src="srvModel.cryptoImage" />
-                    </div>
+        <nav v-if="srvModel.isLightning" class="copyBox">
+            <div class="copySectionBox bottomBorder">
+                <label>{{$t("BOLT 11 Invoice")}}</label>
+                <div class="inputWithIcon">
+                    <input type="text" class="checkoutTextbox" v-bind:value="srvModel.btcAddress" readonly="readonly" />
+                    <img v-bind:src="srvModel.cryptoImage" />
                 </div>
-                <div class="manual-box__address">
-                    <div class="flipper flipped-initially">
-                        <div class="back"></div>
-                        <div class="front">
-                            <div class="manual-box__address__arrow"></div>
-                            <div class="copySectionBox">
-                                <label>{{$t("Peer Info")}}</label>
-                                <div class="inputWithIcon">
-                                    <input type="text" class="checkoutTextbox" v-bind:value="srvModel.peerInfo" readonly="readonly" />
-                                    <img v-bind:src="srvModel.cryptoImage" />
-                                </div>
-                            </div>
-                        </div>
-                    </div>
+            </div>
+            <div class="separatorGem"></div>
+            <div class="copySectionBox">
+                <label>{{$t("Peer Info")}}</label>
+                <div class="inputWithIcon">
+                    <input type="text" class="checkoutTextbox" v-bind:value="srvModel.peerInfo" readonly="readonly" />
+                    <img v-bind:src="srvModel.cryptoImage" />
                 </div>
             </div>
         </nav>
-        <nav v-else>
-            <div class="copyBox">
-                <div class="copySectionBox bottomBorder">
-                    <label>{{$t("Amount")}}</label>
-                    <div class="manual-box__amount__value copy-cursor" ngxclipboard="">
-                        <span>{{srvModel.btcDue}}</span> {{ srvModel.cryptoCode }}
-                    </div>
+        <nav v-else class="copyBox">
+            <div class="copySectionBox bottomBorder">
+                <label>{{$t("Amount")}}</label>
+                <div class="copyAmountText copy-cursor">
+                    <span>{{srvModel.btcDue}}</span> {{ srvModel.cryptoCode }}
                 </div>
-                <div class="separatorGem"></div>
-                <div class="copySectionBox">
-                    <label>{{$t("Address")}}</label>
-                    <div class="inputWithIcon">
-                        <input type="text" class="checkoutTextbox" v-bind:value="srvModel.btcAddress" readonly="readonly" />
-                        <img v-bind:src="srvModel.cryptoImage" />
-                    </div>
+            </div>
+            <div class="separatorGem"></div>
+            <div class="copySectionBox">
+                <label>{{$t("Address")}}</label>
+                <div class="inputWithIcon">
+                    <input type="text" class="checkoutTextbox" v-bind:value="srvModel.btcAddress" readonly="readonly" />
+                    <img v-bind:src="srvModel.cryptoImage" />
                 </div>
             </div>
         </nav>
diff --git a/BTCPayServer/wwwroot/css/normalizer.css b/BTCPayServer/wwwroot/css/normalizer.css
index 646cc1010..04e73a1cf 100644
--- a/BTCPayServer/wwwroot/css/normalizer.css
+++ b/BTCPayServer/wwwroot/css/normalizer.css
@@ -8625,10 +8625,10 @@ strong {
         max-height: 300px;
     }
 
-.copy-cursor {
-    cursor: copy;
-}
-
+/* 
+    After refactoring Copy tab, this section until EOF REFACTOR can likely be deleted 
+    Leaving it since there are some references in refund that I need to look into
+*/
 .manual-box {
     border-radius: 5px;
     margin-left: calc(-40px + 10%);
@@ -8907,6 +8907,7 @@ strong {
     font-size: 10.2px;
     color: #4A4A4A;
 }
+/* EOF REFACTOR */
 
 .status-block {
     position: relative;
@@ -11343,7 +11344,7 @@ low-fee-timeline {
     background: #f6f6f6;
     box-sizing: border-box;
     transition: .3s;
-    font-size: 10px;
+    font-size: 11px;
     color: #4a4a4a;
     cursor: copy;
 }
@@ -11372,3 +11373,16 @@ low-fee-timeline {
         padding: 9px 4px;
         border-radius: 4px 0 0 4px;
     }
+
+.copyAmountText {
+    color: #4A4A4A;
+    font-size: 30px;
+    font-weight: 300;
+    letter-spacing: 1px;
+    margin-top: -10px;
+    position: relative;
+}
+
+.copy-cursor {
+    cursor: copy;
+}