feat(coinbase): clearer expectations on coinbase integration onboarding
This commit is contained in:
parent
9ae213c528
commit
c9802c1a0a
2 changed files with 16 additions and 12 deletions
|
|
@ -11,31 +11,34 @@
|
||||||
text-align: center;
|
text-align: center;
|
||||||
&-logo {
|
&-logo {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
margin-bottom: 1em;
|
||||||
img {
|
img {
|
||||||
max-width: 170px;
|
max-width: 170px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&-heading {
|
|
||||||
font-size: 20px;
|
|
||||||
margin: 1rem;
|
|
||||||
}
|
|
||||||
&-description {
|
&-description {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
margin-left: 2rem;
|
margin-left: 2rem;
|
||||||
margin-right: 2rem;
|
margin-right: 2rem;
|
||||||
margin-bottom: 100px;
|
margin-bottom: 130px;
|
||||||
opacity: .6;
|
opacity: .6;
|
||||||
max-width: 300px;
|
max-width: 300px;
|
||||||
}
|
}
|
||||||
&-support-link {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
&-cta, &-oauthform {
|
&-cta, &-oauthform {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 5vh;
|
bottom: 5vh;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
max-width: 350px;
|
||||||
}
|
}
|
||||||
&-oauthform {
|
&-oauthform {
|
||||||
|
.item {
|
||||||
|
border: 0 none;
|
||||||
|
}
|
||||||
|
.item-floating-label {
|
||||||
|
padding-left: 0;
|
||||||
|
margin-left: 1em;
|
||||||
|
margin-right: 1em;
|
||||||
|
}
|
||||||
input {
|
input {
|
||||||
border-bottom: 2px solid $light-gray;
|
border-bottom: 2px solid $light-gray;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -15,11 +15,11 @@
|
||||||
<div class="integration-onboarding-logo">
|
<div class="integration-onboarding-logo">
|
||||||
<img src="img/coinbase-logo.png">
|
<img src="img/coinbase-logo.png">
|
||||||
</div>
|
</div>
|
||||||
<div class="integration-onboarding-heading" translate>Connect a Coinbase Account</div>
|
<div class="integration-onboarding-description" ng-hide="showOauthForm" translate>Coinbase's service is available in 33 countries, and can take 3-5 days to buy or sell bitcoin.</div>
|
||||||
<div class="integration-onboarding-description" translate>If you have trouble with the Coinbase service, please <a class="integration-onboarding-support-link" ng-click="coinbase.openSupportWindow()">contact Coinbase support</a> for direct assistance.</div>
|
<div class="integration-onboarding-description" ng-show="showOauthForm" translate>If you have trouble, contact Coinbase support for direct assistance.</div>
|
||||||
<div class="integration-onboarding-cta" ng-show="!showOauthForm">
|
<div class="integration-onboarding-cta" ng-show="!showOauthForm">
|
||||||
<button class="button button-standard button-primary" ng-click="coinbase.openAuthenticateWindow()" translate>Connect to Coinbase</button>
|
<button class="button button-standard button-primary" ng-click="coinbase.openAuthenticateWindow()" translate>Connect Coinbase Account</button>
|
||||||
<button class="button button-standard button-secondary" ng-click="coinbase.openSignupWindow()" translate>Create an Account</button>
|
<button class="button button-standard button-secondary" ng-click="coinbase.openSignupWindow()" translate>Sign Up for Coinbase</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div ng-show="showOauthForm" class="integration-onboarding-oauthform">
|
<div ng-show="showOauthForm" class="integration-onboarding-oauthform">
|
||||||
|
|
@ -35,6 +35,7 @@
|
||||||
<input
|
<input
|
||||||
class="button button-standard button-primary"
|
class="button button-standard button-primary"
|
||||||
type="submit" value="Connect Coinbase Account" ng-disabled="oauthCodeForm.$invalid">
|
type="submit" value="Connect Coinbase Account" ng-disabled="oauthCodeForm.$invalid">
|
||||||
|
<button type="button" class="button button-standard button-secondary" ng-click="coinbase.openSignupWindow()" translate>Coinbase Support →</button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue