onboarding backup desktop stylings updates

This commit is contained in:
Jamal Jackson 2016-09-09 13:47:27 -04:00
commit 91a216cf0d
5 changed files with 59 additions and 7 deletions

View file

@ -30,7 +30,7 @@
Just scan the code to pay
</p>
</div>
<div class="row">
<div class="row cta-button">
<button class="button button-positive col col-75 next-slide" ng-click="slideNext()">
Got it <i class="icon ion-ios-arrow-thin-right"></i>
</button>
@ -54,9 +54,9 @@
The exchange rate changes with the market
</p>
</div>
<div class="row">
<div class="row cta-button">
<button class="button button-positive col col-75 next-slide" ng-click="slideNext()">
Makes sense <i class="icon ion-arrow-right-c"></i>
Makes sense <i class="icon ion-ios-arrow-thin-right"></i>
</button>
</div>
</ion-content>
@ -78,7 +78,7 @@
Not even BitPay can access it
</p>
</div>
<div class="row">
<div class="row cta-button">
<button class="button button-positive col col-75 get-started" ng-click="createDefaultWallet()">
Create bitcoin wallet
</button>

View file

@ -10,8 +10,9 @@
}
.cta-buttons{
width:100%;
float:left;
position: relative;
float:none;
position: absolute;
bottom: 0;
}
}
@ -33,6 +34,9 @@
float:none;
bottom:0;
position: absolute;
button{
max-width: 400px;
}
}
}
}
@ -43,4 +47,11 @@
position: relative;
}
}
}
@media (min-height: 980px){
#onboarding-backup-request{
#arrow-down{
margin-top: 15rem;
}
}
}

View file

@ -9,8 +9,13 @@
font-size: 4.2rem;
}
.cta-buttons{
float:left;
float:none;
bottom:46px;
position: absolute;
width:100%;
button{
max-width: 400px;
}
}
}

View file

@ -64,6 +64,19 @@
}
}
}
@media (min-width: 1000px){
#onboarding-collect-email{
#collect-email{
p, form{
max-width: 600px;
@include center-block();
}
form{
margin-top:.5rem;
}
}
}
}
@keyframes topBottom {
0% {

View file

@ -23,6 +23,10 @@
background-position: top;
}
}
.cta-button{
position: absolute;
bottom: 85px;
}
}
@media (max-width: 400px){
@ -34,3 +38,22 @@
}
}
}
@media (min-width: 1000px){
#onboard-tour{
p, h2, h3{
max-width: 600px;
}
button{
max-width: 400px;
}
#cta{
margin: 2rem 0 0;
}
&-control{
#cta{
margin-bottom: 2rem;
}
}
}
}