finished get started launch view designs

This commit is contained in:
Jamal Jackson 2016-08-30 15:40:32 -04:00
commit b3085a9744
8 changed files with 60 additions and 10 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 234 KiB

View file

@ -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>

View file

@ -992,5 +992,5 @@ input[type=number] {
}
}
@import 'general/layout';
@import 'views/onboarding/terms-of-use';
@import 'mixins/mixins';
@import 'views/onboarding/onboarding';

View file

@ -0,0 +1,4 @@
@mixin center-block($topBottom: 0) {
float:none;
margin: $topBottom auto;
}

View file

@ -0,0 +1 @@
@import "layout";

View 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;
}
}
}
}

View 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";