-
Bitcoin is digital money
-
+
+
+
Bitcoin is secure, digital money
+
+
+
You can spend bitcoin at millions of websites and stores worldwide
-
+
+
+
+
+
Just scan the code to pay
-
+
+
-
-
-
Bitcoin is currency
-
+
+
+
Bitcoin is a currency
+
+
+
You can trade it for other currencies like US Dollars, Euros, or Pounds
-
+
+
+
+
+
The exchange rate changes with the market
-
+
+
-
-
-
You control your bitcoin
-
+
+
+
You control your bitcoin
+
+
+
The BitPay wallet stores your bitcoin with cutting-edge security
-
+
+
+
+
+
Not even BitPay can access it
-
+
+
diff --git a/src/sass/views/onboarding/onboard-tour.scss b/src/sass/views/onboarding/onboard-tour.scss
new file mode 100644
index 000000000..1123a511a
--- /dev/null
+++ b/src/sass/views/onboarding/onboard-tour.scss
@@ -0,0 +1,22 @@
+#onboard-tour {
+ &-secure {
+ #cta {
+ background-image: url(../img/onboarding-tour-phone.svg);
+ }
+ }
+ &-currency {
+ #cta {
+ background-image: url(../img/onboarding-tour-currency-bg.svg);
+ }
+ .next-slide {
+ margin-top: 3rem;
+ }
+ }
+ &-control {
+ #cta {
+ background-image: url(../img/onboarding-tour-control.svg);
+ background-size: 70%;
+ background-position: top;
+ }
+ }
+}
diff --git a/src/sass/views/onboarding/onboarding.scss b/src/sass/views/onboarding/onboarding.scss
index 94b0df66f..72896549a 100644
--- a/src/sass/views/onboarding/onboarding.scss
+++ b/src/sass/views/onboarding/onboarding.scss
@@ -6,8 +6,62 @@
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;
+ color: #fff;
+ ion-header-bar {
+ background: rgb(30, 49, 134);
+ color: #fff;
+ button {
+ color: #fff;
+ }
+ .secondary-buttons {
+ button {
+ color: rgba(255, 255, 255, .5);
+ }
+ }
+ }
+ ion-content {
+ color: #fff;
+ .scroll {}
+ h2 {
+ color: #fff;
+ font-size: 1.8rem;
+ }
+ p {
+ &.tagline {
+ color: rgba(255, 255, 255, .5);
+ }
+ }
+ .col {
+ @include center-block(.5rem);
+ }
+ #cta {
+ background-size: contain;
+ width: 100%;
+ clear: both;
+ height: 20rem;
+ margin-bottom: -3rem;
+ background-position: center;
+ background-repeat: no-repeat;
+ img {
+ height: 16rem;
+ }
+ }
+ button {
+ &.next-slide {
+ background: rgba(215, 215, 215, 0.10);
+ }
+ }
+ }
+ .swiper-pagination {
+ &-bullet {
+ background: rgb(100, 124, 232);
+ &-active {
+ background: rgb(100, 124, 232);
+ }
+ }
+ }
}
@import "terms-of-use";
@import "onboard-welcome";
+@import "onboard-tour";