mirror of https://github.com/BTCPrivate/copay.git
fix click to pay button to bottom of screen like the slide to pay component
This commit is contained in:
parent
57ab21dd55
commit
e858462107
|
@ -19,8 +19,7 @@ $button-secondary-border: transparent;
|
||||||
$button-secondary-active-bg: darken($subtle-gray, 5%);
|
$button-secondary-active-bg: darken($subtle-gray, 5%);
|
||||||
$button-secondary-active-border: transparent;
|
$button-secondary-active-border: transparent;
|
||||||
|
|
||||||
%button-standard,
|
%button-standard {
|
||||||
click-to-accept {
|
|
||||||
width: 85%;
|
width: 85%;
|
||||||
max-width: 300px;
|
max-width: 300px;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
|
|
|
@ -1,7 +1,18 @@
|
||||||
click-to-accept {
|
click-to-accept {
|
||||||
|
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
height: 92px;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
.click-to-accept {
|
.click-to-accept {
|
||||||
|
|
||||||
|
&__button.button.button-primary.button-standard {
|
||||||
|
height: 100%;
|
||||||
|
max-width: 9999px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
&__button.disable {
|
&__button.disable {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
@ -18,6 +29,9 @@ click-to-accept {
|
||||||
transform: translateY(2rem);
|
transform: translateY(2rem);
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
&.enter {
|
&.enter {
|
||||||
transition: transform 250ms ease, opacity 250ms ease;
|
transition: transform 250ms ease, opacity 250ms ease;
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
.list {
|
.list {
|
||||||
background: #f5f5f5;
|
background: #f5f5f5;
|
||||||
}
|
}
|
||||||
.slide-to-pay {
|
.add-bottom-for-cta {
|
||||||
bottom: 92px;
|
bottom: 92px;
|
||||||
}
|
}
|
||||||
.head {
|
.head {
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
</ion-nav-back-button>
|
</ion-nav-back-button>
|
||||||
</ion-nav-bar>
|
</ion-nav-bar>
|
||||||
|
|
||||||
<ion-content ng-class="{'slide-to-pay': isCordova && !insuffientFunds && !noMatchingWallet}">
|
<ion-content ng-class="{'add-bottom-for-cta': !insuffientFunds && !noMatchingWallet}">
|
||||||
<div class="list">
|
<div class="list">
|
||||||
<div class="item head">
|
<div class="item head">
|
||||||
<div class="sending-label">
|
<div class="sending-label">
|
||||||
|
@ -77,13 +77,13 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</ion-content>
|
||||||
<click-to-accept
|
<click-to-accept
|
||||||
ng-click="approve(statusChangeHandler)"
|
ng-click="approve(statusChangeHandler)"
|
||||||
ng-if="!isCordova && wallets[0]"
|
ng-if="!isCordova && wallets[0]"
|
||||||
click-send-status="sendStatus">
|
click-send-status="sendStatus">
|
||||||
Click to pay
|
Click to pay
|
||||||
</click-to-accept>
|
</click-to-accept>
|
||||||
</ion-content>
|
|
||||||
<slide-to-accept
|
<slide-to-accept
|
||||||
ng-if="isCordova && wallets[0]"
|
ng-if="isCordova && wallets[0]"
|
||||||
slide-on-confirm="onConfirm()"
|
slide-on-confirm="onConfirm()"
|
||||||
|
|
|
@ -11,7 +11,7 @@
|
||||||
</button>
|
</button>
|
||||||
</ion-header-bar>
|
</ion-header-bar>
|
||||||
|
|
||||||
<ion-content ng-init="updateCopayerList()" ng-class="{'slide-to-pay': tx.pendingForUs && canSign && !hasClick}">
|
<ion-content ng-init="updateCopayerList()" ng-class="{'add-bottom-for-cta': tx.pendingForUs && canSign}">
|
||||||
<div class="list">
|
<div class="list">
|
||||||
<div class="item head">
|
<div class="item head">
|
||||||
<div class="sending-label">
|
<div class="sending-label">
|
||||||
|
@ -150,12 +150,6 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<click-to-accept
|
|
||||||
ng-click="onConfirm(statusChangeHandler)"
|
|
||||||
ng-if="tx.pendingForUs && canSign && !paymentExpired && hasClick"
|
|
||||||
click-send-status="sendStatus">
|
|
||||||
Click to accept
|
|
||||||
</click-to-accept>
|
|
||||||
<div class="m30t text-center" ng-if="tx.canBeRemoved || (tx.status == 'accepted' && !tx.broadcastedOn)">
|
<div class="m30t text-center" ng-if="tx.canBeRemoved || (tx.status == 'accepted' && !tx.broadcastedOn)">
|
||||||
<div class="size-12 padding proposal-deletion-help" ng-show="!tx.isGlidera && isShared" translate>
|
<div class="size-12 padding proposal-deletion-help" ng-show="!tx.isGlidera && isShared" translate>
|
||||||
* A payment proposal can be deleted if 1) you are the creator, and no other copayer has signed, or 2) 24 hours have passed since the proposal was created.
|
* A payment proposal can be deleted if 1) you are the creator, and no other copayer has signed, or 2) 24 hours have passed since the proposal was created.
|
||||||
|
@ -167,6 +161,12 @@
|
||||||
</div>
|
</div>
|
||||||
</ion-content>
|
</ion-content>
|
||||||
|
|
||||||
|
<click-to-accept
|
||||||
|
ng-click="onConfirm(statusChangeHandler)"
|
||||||
|
ng-if="tx.pendingForUs && canSign && !paymentExpired && hasClick"
|
||||||
|
click-send-status="sendStatus">
|
||||||
|
Click to accept
|
||||||
|
</click-to-accept>
|
||||||
<slide-to-accept
|
<slide-to-accept
|
||||||
ng-if="tx.pendingForUs && canSign && !paymentExpired && !hasClick"
|
ng-if="tx.pendingForUs && canSign && !paymentExpired && !hasClick"
|
||||||
slide-on-confirm="onConfirm()"
|
slide-on-confirm="onConfirm()"
|
||||||
|
|
Loading…
Reference in New Issue