From 0a444508f8de86cc701a0d1dcabb51089bda38d8 Mon Sep 17 00:00:00 2001
From: Dennis Reimann <mail@dennisreimann.de>
Date: Wed, 9 Dec 2020 09:45:25 +0100
Subject: [PATCH] UI: Improve mobile store setup view

According to [this comment](https://github.com/btcpayserver/btcpayserver/pull/2117#issuecomment-741255465).
---
 BTCPayServer/Views/Stores/UpdateStore.cshtml | 24 ++++++++++----------
 BTCPayServer/wwwroot/main/site.css           |  4 ++++
 2 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/BTCPayServer/Views/Stores/UpdateStore.cshtml b/BTCPayServer/Views/Stores/UpdateStore.cshtml
index 00f4c82a5..9cc5f1160 100644
--- a/BTCPayServer/Views/Stores/UpdateStore.cshtml
+++ b/BTCPayServer/Views/Stores/UpdateStore.cshtml
@@ -48,26 +48,26 @@
                                     }
                                 }
                             </span>
-                            <span class="d-flex align-items-center">
+                            <span class="d-flex align-items-center fw-semibold">
                                 @if (scheme.Enabled)
                                 {
-                                    <strong class="d-flex align-items-center text-success">
+                                    <span class="d-flex align-items-center text-success">
                                         <span class="mr-2 btcpay-status btcpay-status--enabled"></span>
                                         Enabled
-                                    </strong>
+                                    </span>
                                 }
                                 else
                                 {
-                                    <strong class="d-flex align-items-center text-danger">
+                                    <span class="d-flex align-items-center text-danger">
                                         <span class="mr-2 btcpay-status btcpay-status--disabled"></span>
                                         Disabled
-                                    </strong>
+                                    </span>
                                 }
                                 @if (isSetUp)
                                 {
                                     <span class="text-light ml-3 mr-2">|</span>
                                 }
-                                <a asp-action="AddDerivationScheme" asp-route-cryptoCode="@scheme.Crypto" asp-route-storeId="@Context.GetRouteValue("storeId")" id="@($"Modify{scheme.Crypto}")" class="btn btn-sm btn-@(isSetUp ? "link" : "primary ml-4 px-3") py-1">
+                                <a asp-action="AddDerivationScheme" asp-route-cryptoCode="@scheme.Crypto" asp-route-storeId="@Context.GetRouteValue("storeId")" id="@($"Modify{scheme.Crypto}")" class="btn btn-@(isSetUp ? "link px-1" : "primary btn-sm ml-4 px-3") py-1 fw-semibold">
                                     @(isSetUp ? "Modify" : "Setup")
                                 </a>
                             </span>
@@ -109,26 +109,26 @@
                                     <span class="smMaxWidth text-truncate text-secondary mr-3">@scheme.Address</span>
                                 }
                             </span>
-                            <span class="d-flex align-items-center">
+                            <span class="d-flex align-items-center fw-semibold">
                                 @if (scheme.Enabled)
                                 {
-                                    <strong class="d-flex align-items-center text-success">
+                                    <span class="d-flex align-items-center text-success">
                                         <span class="mr-2 btcpay-status btcpay-status--enabled"></span>
                                         Enabled
-                                    </strong>
+                                    </span>
                                 }
                                 else
                                 {
-                                    <strong class="d-flex align-items-center text-danger">
+                                    <span class="d-flex align-items-center text-danger">
                                         <span class="mr-2 btcpay-status btcpay-status--disabled"></span>
                                         Disabled
-                                    </strong>
+                                    </span>
                                 }
                                 @if (isSetUp)
                                 {
                                     <span class="text-light ml-3 mr-2">|</span>
                                 }
-                                <a asp-action="AddLightningNode" asp-route-cryptoCode="@scheme.CryptoCode" asp-route-storeId="@Context.GetRouteValue("storeId")" id="@($"Modify-Lightning{scheme.CryptoCode}")" class="btn btn-sm btn-@(isSetUp ? "link" : "primary ml-4 px-3") py-1">
+                                <a asp-action="AddLightningNode" asp-route-cryptoCode="@scheme.CryptoCode" asp-route-storeId="@Context.GetRouteValue("storeId")" id="@($"Modify-Lightning{scheme.CryptoCode}")" class="btn btn-@(isSetUp ? "link px-1" : "primary btn-sm ml-4 px-3") py-1 fw-semibold">
                                     @(isSetUp ? "Modify" : "Setup")
                                 </a>
                             </span>
diff --git a/BTCPayServer/wwwroot/main/site.css b/BTCPayServer/wwwroot/main/site.css
index c10cba36f..c68354096 100644
--- a/BTCPayServer/wwwroot/main/site.css
+++ b/BTCPayServer/wwwroot/main/site.css
@@ -261,6 +261,10 @@ pre {
 .w-175px { width: 175px; }
 .w-200px { width: 200px; }
 
+.fw-semibold {
+    font-weight: 600;
+}
+
 /* Chrome, Safari, Edge, Opera */
 input[type=number].hide-number-spin::-webkit-outer-spin-button,
 input[type=number].hide-number-spin::-webkit-inner-spin-button {