mirror of
https://github.com/btcpayserver/btcpayserver.git
synced 2025-02-22 14:22:40 +01:00
Refactoring styles, simplifying the hierarchy
This commit is contained in:
parent
53c53b98e6
commit
b976adeefe
2 changed files with 59 additions and 14 deletions
|
@ -160,26 +160,21 @@
|
|||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bp-view payment manual-flow" id="copy">
|
||||
<div class="manual__step-two__instructions">
|
||||
<span i18n="">{{$t("CompletePay_Body", srvModel)}}</span>
|
||||
</div>
|
||||
<nav v-if="srvModel.isLightning">
|
||||
<div class="manual-box flipped" style="margin-bottom: 30px;">
|
||||
<div class="manual-box__amount">
|
||||
<div class="flipper flipped-initially">
|
||||
<div class="manual-box__address__label label">{{$t("BOLT 11 Invoice")}}</div>
|
||||
<div class="manual-box__address__value copy-cursor" ngxclipboard="" id="btcAddress">
|
||||
<div class="manual-box__address__wrapper">
|
||||
<div class="manual-box__address__wrapper__logo">
|
||||
<img v-bind:src="srvModel.cryptoImage" height="16" />
|
||||
</div>
|
||||
<div class="manual-box__address__wrapper__value" id="btcAddressValue" style="overflow:hidden;max-width:240px;">{{srvModel.btcAddress}}</div>
|
||||
</div>
|
||||
<div class="copied-label" style="top: 5px;">
|
||||
<span>{{$t("Copied")}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<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>
|
||||
<div class="copied-label" style="top: 5px;">
|
||||
<span>{{$t("Copied")}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="manual-box__address">
|
||||
|
|
|
@ -11290,3 +11290,53 @@ low-fee-timeline {
|
|||
.no-bounce * .status-icon__wrapper__outline {
|
||||
animation: none !important;
|
||||
}
|
||||
|
||||
|
||||
/* checkout additions */
|
||||
.copySectionBox label {
|
||||
text-transform: uppercase;
|
||||
font-size: 10px;
|
||||
color: #515664;
|
||||
opacity: .5;
|
||||
letter-spacing: .6px;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.checkoutTextbox {
|
||||
width: 100%;
|
||||
border: 1px solid #e9e9e9;
|
||||
border-radius: 4px;
|
||||
outline: none;
|
||||
padding: 8px 10px;
|
||||
background: #f6f6f6;
|
||||
box-sizing: border-box;
|
||||
transition: .3s;
|
||||
font-size: 10px;
|
||||
color: #4a4a4a;
|
||||
cursor: copy;
|
||||
}
|
||||
|
||||
.inputWithIcon .checkoutTextbox {
|
||||
padding-left: 40px;
|
||||
}
|
||||
|
||||
.inputWithIcon {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.inputWithIcon img {
|
||||
position: absolute;
|
||||
left: 2px;
|
||||
top: 8px;
|
||||
color: #aaa;
|
||||
height: 16px;
|
||||
padding: 0px 6px;
|
||||
border-right: 1px solid #e9e9e9;
|
||||
}
|
||||
|
||||
.inputWithIcon.inputIconBg img {
|
||||
background-color: #aaa;
|
||||
color: #fff;
|
||||
padding: 9px 4px;
|
||||
border-radius: 4px 0 0 4px;
|
||||
}
|
||||
|
|
Loading…
Add table
Reference in a new issue