Both regular and lightning copy tabs with new simplified styles

This commit is contained in:
lepipele 2018-03-29 23:23:39 -05:00 committed by nicolas.dorier
parent fa0fa28949
commit 88818ece29
2 changed files with 44 additions and 41 deletions

View file

@ -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>

View file

@ -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;
}