mirror of https://github.com/BTCPrivate/copay.git
feat(design): correct bitcoin icon across all views
This commit is contained in:
parent
b78dd84a23
commit
c19bbc539e
|
@ -14,6 +14,19 @@
|
||||||
padding-left: 74px;
|
padding-left: 74px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.icon-svg {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
> img {
|
||||||
|
background-repeat:no-repeat;
|
||||||
|
background-clip: padding-box;
|
||||||
|
background-size: contain;
|
||||||
|
height: 18px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.big-icon-svg {
|
.big-icon-svg {
|
||||||
padding: 0 7px;
|
padding: 0 7px;
|
||||||
> .bg {
|
> .bg {
|
||||||
|
|
|
@ -27,3 +27,14 @@ ion-tabs.ion-tabs-transparent {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// .placeholder-icon padding cannot be modified by a variable
|
||||||
|
$placeholder-icon-padding: 10px;
|
||||||
|
.placeholder-icon {
|
||||||
|
&:first-child {
|
||||||
|
padding-right: $placeholder-icon-padding;
|
||||||
|
}
|
||||||
|
&:last-child {
|
||||||
|
padding-left: $placeholder-icon-padding;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -32,9 +32,6 @@
|
||||||
font-size: .8rem;
|
font-size: .8rem;
|
||||||
i {
|
i {
|
||||||
font-size: 1.3rem;
|
font-size: 1.3rem;
|
||||||
&.ion-social-bitcoin-outline {
|
|
||||||
border-right: 1px solid rgb(228, 228, 228);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.bit-address {
|
.bit-address {
|
||||||
|
@ -111,6 +108,10 @@
|
||||||
margin-bottom:1rem;
|
margin-bottom:1rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.receive-tab-bitcoin-icon {
|
||||||
|
border-right: 1px solid rgb(228, 228, 228);
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes fadeIn {
|
@keyframes fadeIn {
|
||||||
|
|
|
@ -0,0 +1,13 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="Bitcoin_Symbol" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||||
|
y="0px" viewBox="0 0 12 16" style="enable-background:new 0 0 12 16;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:#5D5D5D;}
|
||||||
|
</style>
|
||||||
|
<path class="st0" d="M7.4,2.5l0-2.4L6,0.2l0,2.3c-0.4,0-0.8,0-1.2,0l0-2.3l-1.5,0l0,2.4c-0.3,0-0.6,0-0.9,0l-2,0l0,1.5
|
||||||
|
c0,0,1.1,0,1,0c0.6,0,0.8,0.3,0.8,0.6l0,6.5c0,0.2-0.2,0.5-0.6,0.5c0,0-1.1,0-1.1,0l-0.3,1.7l1.9,0c0.4,0,0.7,0,1,0l0,2.4l1.5,0
|
||||||
|
l0-2.4c0.4,0,0.8,0,1.2,0l0,2.3l1.5,0l0-2.4c2.5-0.1,4.2-0.7,4.4-3c0.2-1.8-0.7-2.6-2.1-3C10.5,7,11,6.2,10.9,5
|
||||||
|
C10.7,3.3,9.3,2.7,7.4,2.5z M8.8,10.1c0,1.8-3.1,1.6-4.1,1.6l0-3.2C5.7,8.5,8.8,8.2,8.8,10.1L8.8,10.1z M8.2,5.6
|
||||||
|
c0,1.6-2.6,1.4-3.4,1.4l0-2.9C5.6,4.2,8.2,3.9,8.2,5.6L8.2,5.6z"/>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 939 B |
|
@ -56,7 +56,7 @@
|
||||||
|
|
||||||
<div class="list">
|
<div class="list">
|
||||||
<div class="item item-icon-left" ng-show="btx.action == 'sent'">
|
<div class="item item-icon-left" ng-show="btx.action == 'sent'">
|
||||||
<i class="icon ion-social-bitcoin-outline"></i>
|
<i class="icon icon-svg"><img src="img/icon-bitcoin-symbol.svg"></i>
|
||||||
<div ng-if="!btx.hasMultiplesOutputs && btx.addressTo && btx.addressTo != 'N/A'" copy-to-clipboard="btx.addressTo">
|
<div ng-if="!btx.hasMultiplesOutputs && btx.addressTo && btx.addressTo != 'N/A'" copy-to-clipboard="btx.addressTo">
|
||||||
<span ng-if="btx.merchant">
|
<span ng-if="btx.merchant">
|
||||||
<span ng-show="btx.merchant.pr.ca"><i class="fi-lock color-greeni"></i> {{btx.merchant.domain}}</span>
|
<span ng-show="btx.merchant.pr.ca"><i class="fi-lock color-greeni"></i> {{btx.merchant.domain}}</span>
|
||||||
|
|
|
@ -52,7 +52,7 @@
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<span translate>To</span>
|
<span translate>To</span>
|
||||||
<span class="payment-proposal-to" copy-to-clipboard="tx.toAddress">
|
<span class="payment-proposal-to" copy-to-clipboard="tx.toAddress">
|
||||||
<i class="icon ion-social-bitcoin"></i>
|
<i class="icon icon-svg"><img src="img/icon-bitcoin-symbol.svg"></i>
|
||||||
<contact ng-if="!tx.hasMultiplesOutputs" class="ellipsis" address="{{tx.toAddress}}"></contact>
|
<contact ng-if="!tx.hasMultiplesOutputs" class="ellipsis" address="{{tx.toAddress}}"></contact>
|
||||||
<span ng-if="tx.hasMultiplesOutputs" translate>Multiple recipients</span>
|
<span ng-if="tx.hasMultiplesOutputs" translate>Multiple recipients</span>
|
||||||
</span>
|
</span>
|
||||||
|
|
|
@ -18,7 +18,7 @@
|
||||||
<div class="row border-top">
|
<div class="row border-top">
|
||||||
<div class="col col-90 center-block bit-address text-center">
|
<div class="col col-90 center-block bit-address text-center">
|
||||||
<div class="item item-icon-left">
|
<div class="item item-icon-left">
|
||||||
<i class="icon ion-social-bitcoin-outline"></i>
|
<i class="icon icon-svg receive-tab-bitcoin-icon"><img src="img/icon-bitcoin-symbol.svg"></i>
|
||||||
<span class="bit-address-gen-address">...</span>
|
<span class="bit-address-gen-address">...</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -39,7 +39,7 @@
|
||||||
<div class="row border-top">
|
<div class="row border-top">
|
||||||
<div class="col col-90 center-block bit-address text-center">
|
<div class="col col-90 center-block bit-address text-center">
|
||||||
<div class="item item-icon-left">
|
<div class="item item-icon-left">
|
||||||
<i class="icon ion-social-bitcoin-outline"></i>
|
<i class="icon icon-svg receive-tab-bitcoin-icon"><img src="img/icon-bitcoin-symbol.svg"></i>
|
||||||
<span class="bit-address-gen-address" ng-if="!generatingAddress" translate>address not yet available</span>
|
<span class="bit-address-gen-address" ng-if="!generatingAddress" translate>address not yet available</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -76,7 +76,7 @@
|
||||||
<div class="row border-top">
|
<div class="row border-top">
|
||||||
<div class="col col-90 center-block bit-address text-center">
|
<div class="col col-90 center-block bit-address text-center">
|
||||||
<div class="item item-icon-left">
|
<div class="item item-icon-left">
|
||||||
<i class="icon ion-social-bitcoin-outline"></i>
|
<i class="icon icon-svg receive-tab-bitcoin-icon"><img src="img/icon-bitcoin-symbol.svg"></i>
|
||||||
<span class="bit-address-gen-address" ng-if="generatingAddress">...</span>
|
<span class="bit-address-gen-address" ng-if="generatingAddress">...</span>
|
||||||
<span class="bit-address-gen-address" ng-if="!generatingAddress" copy-to-clipboard="addr">{{addr}}</span>
|
<span class="bit-address-gen-address" ng-if="!generatingAddress" copy-to-clipboard="addr">{{addr}}</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
<ion-content>
|
<ion-content>
|
||||||
<div class="item item-heading" translate>Recipient</div>
|
<div class="item item-heading" translate>Recipient</div>
|
||||||
<label class="item item-input bitcoin-address">
|
<label class="item item-input bitcoin-address">
|
||||||
<i class="icon ion-social-bitcoin placeholder-icon"></i>
|
<i class="icon icon-svg placeholder-icon"><img src="img/icon-bitcoin-symbol.svg"></i>
|
||||||
<div class="qr-scan-icon" ng-style="{'width': '100%'}">
|
<div class="qr-scan-icon" ng-style="{'width': '100%'}">
|
||||||
<a ui-sref="tabs.scan" ng-style="{'top': '6px'}"><i class="icon ion-qr-scanner"></i></a>
|
<a ui-sref="tabs.scan" ng-style="{'top': '6px'}"><i class="icon ion-qr-scanner"></i></a>
|
||||||
<input type="text"
|
<input type="text"
|
||||||
|
|
Loading…
Reference in New Issue