mirror of
https://github.com/btcpayserver/btcpayserver.git
synced 2024-11-19 18:11:36 +01:00
Hover indicator and handling case with only one currency
This commit is contained in:
parent
a2d17bfa7e
commit
c40b47b1dd
@ -42,27 +42,36 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="single-item-order__right">
|
||||
<div class="payment__currencies" onclick="openPaymentMethodDialog()">
|
||||
<img v-bind:src="srvModel.cryptoImage" />
|
||||
<span>
|
||||
@if (Model.AvailableCryptos.Count == 1)
|
||||
{
|
||||
<div class="payment__currencies">
|
||||
<img v-bind:src="srvModel.cryptoImage" />
|
||||
{{srvModel.paymentMethodName}}
|
||||
({{srvModel.cryptoCode}})
|
||||
</span>
|
||||
</div>
|
||||
<div id="vexPopupDialog">
|
||||
<ul class="vexmenu">
|
||||
@foreach (var crypto in Model.AvailableCryptos)
|
||||
{
|
||||
<li class="vexmenuitem">
|
||||
<a href="@crypto.Link" onclick="return closePaymentMethodDialog('@crypto.PaymentMethodId');">
|
||||
<img alt="@crypto.PaymentMethodName" src="@crypto.CryptoImage" />
|
||||
@crypto.PaymentMethodName
|
||||
<span>@crypto.CryptoCode</span>
|
||||
</a>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="payment__currencies" onclick="openPaymentMethodDialog()">
|
||||
<img v-bind:src="srvModel.cryptoImage" />
|
||||
<span class="clickable_underline">{{srvModel.paymentMethodName}} ({{srvModel.cryptoCode}})</span>
|
||||
<span class="clickable_indicator fa fa-angle-right"></span>
|
||||
</div>
|
||||
<div id="vexPopupDialog">
|
||||
<ul class="vexmenu">
|
||||
@foreach (var crypto in Model.AvailableCryptos)
|
||||
{
|
||||
<li class="vexmenuitem">
|
||||
<a href="@crypto.Link" onclick="return closePaymentMethodDialog('@crypto.PaymentMethodId');">
|
||||
<img alt="@crypto.PaymentMethodName" src="@crypto.CryptoImage" />
|
||||
@crypto.PaymentMethodName
|
||||
<span>@crypto.CryptoCode</span>
|
||||
</a>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
}
|
||||
<div class="payment__spinner">
|
||||
<partial name="Checkout-Spinner" />
|
||||
</div>
|
||||
|
@ -28,13 +28,13 @@
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.vexmenuitem:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
.vexmenuitem:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.vexmenuitem:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
.vexmenuitem:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
#vexPopupDialog {
|
||||
display: none;
|
||||
@ -49,6 +49,19 @@
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
.payment__currencies span {
|
||||
border-bottom: 1px dotted gray;
|
||||
}
|
||||
.clickable_underline {
|
||||
border-bottom: 1px dotted #ccc;
|
||||
}
|
||||
|
||||
.payment__currencies:hover .clickable_underline {
|
||||
border-bottom: 1px dotted black;
|
||||
}
|
||||
|
||||
.clickable_indicator {
|
||||
margin-right: -10px;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.payment__currencies:hover .clickable_indicator {
|
||||
opacity: 1;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user