design(tour): improve tour responsiveness, better scss organization
This commit is contained in:
parent
bdbbc1808e
commit
3fbb626141
10 changed files with 146 additions and 179 deletions
|
|
@ -5,6 +5,7 @@
|
|||
text-align: center;
|
||||
.bar.bar-header {
|
||||
background: none;
|
||||
border: 0 none transparent;
|
||||
color: #fff;
|
||||
button {
|
||||
color: #fff;
|
||||
|
|
@ -15,9 +16,6 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.bar.bar-stable {
|
||||
border: 0 none transparent;
|
||||
}
|
||||
ion-content {
|
||||
height: 100%;
|
||||
.scroll{
|
||||
|
|
@ -79,6 +77,12 @@
|
|||
}
|
||||
}
|
||||
|
||||
%cta-buttons {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@import "terms-of-use";
|
||||
@import "onboarding-buttons";
|
||||
@import "onboard-welcome";
|
||||
|
|
@ -88,3 +92,28 @@
|
|||
@import "../backup-warning";
|
||||
@import "onboard-disclaimer";
|
||||
@import "onboard-push-notifications";
|
||||
|
||||
%onboarding-illustration {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 40%;
|
||||
margin-top: 25vh;
|
||||
top: 0;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
.onboarding-illustration {
|
||||
&-secure {
|
||||
@extend %onboarding-illustration;
|
||||
background-image: url(../img/onboarding-tour-phone.svg);
|
||||
}
|
||||
&-currency {
|
||||
@extend %onboarding-illustration;
|
||||
background-image: url(../img/onboarding-tour-currency-bg.svg);
|
||||
}
|
||||
&-control {
|
||||
@extend %onboarding-illustration;
|
||||
background-image: url(../img/onboarding-tour-control.svg);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue