finished get started launch view designs
This commit is contained in:
parent
e24e13aa20
commit
b3085a9744
8 changed files with 60 additions and 10 deletions
BIN
public/img/onboarding-welcome-bg.png
Normal file
BIN
public/img/onboarding-welcome-bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 234 KiB |
|
|
@ -1,13 +1,20 @@
|
|||
<ion-view>
|
||||
<ion-view id="onboard-welcome" class="onboarding">
|
||||
<ion-content>
|
||||
<div class="text-center">
|
||||
<h2>bitpay</h2>
|
||||
|
||||
<span translate>
|
||||
Take control of your money - get started with bitcoin
|
||||
</span>
|
||||
<button class="button button-block button-positive" href ui-sref="onboarding.tour" translate>Get started</button>
|
||||
<button class="button button-block button-light" translate>Restore</button>
|
||||
<div class="row">
|
||||
<img src='../../img/bitpay-logo.svg' class="logo col col-50" />
|
||||
</div>
|
||||
<div class="row">
|
||||
<p translate class="text-center col col-60">
|
||||
Take control of your money - get started with bitcoin
|
||||
</p>
|
||||
</div>
|
||||
<div class="row">
|
||||
<button class="button button-block get-started col col-75" href ui-sref="onboarding.tour" translate>Get started</button>
|
||||
</div>
|
||||
<div class="row">
|
||||
<button class="button button-block restore col col-75" translate>Restore</button>
|
||||
</div>
|
||||
</div>
|
||||
</ion-content>
|
||||
</ion-view>
|
||||
|
|
|
|||
|
|
@ -992,5 +992,5 @@ input[type=number] {
|
|||
}
|
||||
}
|
||||
|
||||
@import 'general/layout';
|
||||
@import 'views/onboarding/terms-of-use';
|
||||
@import 'mixins/mixins';
|
||||
@import 'views/onboarding/onboarding';
|
||||
|
|
|
|||
4
src/sass/mixins/layout.scss
Normal file
4
src/sass/mixins/layout.scss
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
@mixin center-block($topBottom: 0) {
|
||||
float:none;
|
||||
margin: $topBottom auto;
|
||||
}
|
||||
1
src/sass/mixins/mixins.scss
Normal file
1
src/sass/mixins/mixins.scss
Normal file
|
|
@ -0,0 +1 @@
|
|||
@import "layout";
|
||||
25
src/sass/views/onboarding/onboard-welcome.scss
Normal file
25
src/sass/views/onboarding/onboard-welcome.scss
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
#onboard-welcome {
|
||||
ion-content {
|
||||
background: url(../img/onboarding-welcome-bg.png);
|
||||
background-position: top center;
|
||||
background-size: contain;
|
||||
background-repeat-y: no-repeat;
|
||||
.logo, p {
|
||||
@include center-block();
|
||||
}
|
||||
.logo{
|
||||
margin-top:15rem;
|
||||
}
|
||||
button {
|
||||
@include center-block(1rem);
|
||||
color: #fff;
|
||||
&.get-started {
|
||||
background: rgb(100, 124, 232);
|
||||
margin-top: 4rem;
|
||||
}
|
||||
&.restore {
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
13
src/sass/views/onboarding/onboarding.scss
Normal file
13
src/sass/views/onboarding/onboarding.scss
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
.onboarding {
|
||||
background: rgba(30, 49, 134, 1);
|
||||
background: -moz-linear-gradient(top, rgba(30, 49, 134, 1) 0%, rgba(17, 27, 73, 1) 100%);
|
||||
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(30, 49, 134, 1)), color-stop(100%, rgba(17, 27, 73, 1)));
|
||||
background: -webkit-linear-gradient(top, rgba(30, 49, 134, 1) 0%, rgba(17, 27, 73, 1) 100%);
|
||||
background: -o-linear-gradient(top, rgba(30, 49, 134, 1) 0%, rgba(17, 27, 73, 1) 100%);
|
||||
background: -ms-linear-gradient(top, rgba(30, 49, 134, 1) 0%, rgba(17, 27, 73, 1) 100%);
|
||||
background: linear-gradient(to bottom, rgba(30, 49, 134, 1) 0%, rgba(17, 27, 73, 1) 100%);
|
||||
color:#fff;
|
||||
}
|
||||
|
||||
@import "terms-of-use";
|
||||
@import "onboard-welcome";
|
||||
Loading…
Add table
Add a link
Reference in a new issue