From fa0fa28949ab4912ae18ebc6a84a9dc9efb0ba03 Mon Sep 17 00:00:00 2001
From: lepipele <lepipele@users.noreply.github.com>
Date: Thu, 29 Mar 2018 23:02:09 -0500
Subject: [PATCH] Complete switch to new styles for regular copy tab

---
 .../Views/Invoice/Checkout-Body.cshtml        | 23 ++++------
 BTCPayServer/wwwroot/css/normalizer.css       | 46 ++++++++++++++++---
 2 files changed, 47 insertions(+), 22 deletions(-)

diff --git a/BTCPayServer/Views/Invoice/Checkout-Body.cshtml b/BTCPayServer/Views/Invoice/Checkout-Body.cshtml
index 81565dd8b..785671607 100644
--- a/BTCPayServer/Views/Invoice/Checkout-Body.cshtml
+++ b/BTCPayServer/Views/Invoice/Checkout-Body.cshtml
@@ -195,26 +195,19 @@
             </div>
         </nav>
         <nav v-else>
-            <div class="manual-box flipped" style="margin-bottom: 30px;">
-                <div class="manual-box__amount copySectionBox">
+            <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>
                 </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("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>
+                <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>
diff --git a/BTCPayServer/wwwroot/css/normalizer.css b/BTCPayServer/wwwroot/css/normalizer.css
index 40885b376..646cc1010 100644
--- a/BTCPayServer/wwwroot/css/normalizer.css
+++ b/BTCPayServer/wwwroot/css/normalizer.css
@@ -11293,13 +11293,45 @@ low-fee-timeline {
 
 
 /* checkout additions */
-.copySectionBox label {
-    text-transform: uppercase;
-    font-size: 10px;
-    color: #515664;
-    opacity: .5;
-    letter-spacing: .6px;
-    margin-bottom: 10px;
+.copyBox {
+    text-align: center;
+    position: relative;
+    border-radius: 5px;
+    border: 1px solid #E9E9E9;
+    background: #fff;
+}
+
+.copySectionBox {
+    padding: 12px;
+}
+
+    .copySectionBox label {
+        text-transform: uppercase;
+        font-size: 10px;
+        color: #515664;
+        opacity: .5;
+        letter-spacing: .6px;
+        margin-bottom: 10px;
+    }
+
+    .copySectionBox.bottomBorder {
+        border-bottom: 1px solid #e9e9e9;
+    }
+
+.separatorGem {
+    position: relative;
+    height: 10px;
+    width: 10px;
+    left: 50%;
+    border-right: 1px solid #E9E9E9;
+    border-bottom: 1px solid #E9E9E9;
+    transform: rotateZ(45deg);
+    margin-left: -5px;
+    top: -5px;
+    background: #329F80;
+    transform-style: preserve-3d;
+    backface-visibility: hidden;
+    margin-bottom: -10px;
 }
 
 .checkoutTextbox {