diff --git a/public/views/onboarding/backupRequest.html b/public/views/onboarding/backupRequest.html index f7099033f..0284f8bdf 100644 --- a/public/views/onboarding/backupRequest.html +++ b/public/views/onboarding/backupRequest.html @@ -16,12 +16,14 @@
-
- -
-
- +
+
+ +
+
+ +
diff --git a/public/views/onboarding/backupWarning.html b/public/views/onboarding/backupWarning.html index d3406fb13..19f21d0ac 100644 --- a/public/views/onboarding/backupWarning.html +++ b/public/views/onboarding/backupWarning.html @@ -8,7 +8,7 @@
-

+

Are you being watched?

@@ -18,14 +18,14 @@

- +

Anyone with your backup phrase can access or spend your bitcoin.

-
+
diff --git a/public/views/onboarding/tour.html b/public/views/onboarding/tour.html index 8df77f256..d4be4de4a 100644 --- a/public/views/onboarding/tour.html +++ b/public/views/onboarding/tour.html @@ -30,7 +30,7 @@ Just scan the code to pay

-
+
@@ -54,9 +54,9 @@ The exchange rate changes with the market

-
+
@@ -78,7 +78,7 @@ Not even BitPay can access it

-
+
diff --git a/src/sass/views/onboarding/onboard-backup-request.scss b/src/sass/views/onboarding/onboard-backup-request.scss index 0ad4d641d..8ed5a36d8 100644 --- a/src/sass/views/onboarding/onboard-backup-request.scss +++ b/src/sass/views/onboarding/onboard-backup-request.scss @@ -8,4 +8,50 @@ #arrow-down{ font-size: 4.2rem; } + .cta-buttons{ + width:100%; + float:none; + position: absolute; + bottom: 0; + } +} + +@media (max-width: 400px){ + #onboarding-backup-request{ + .warning{ + margin: 2rem auto 1rem; + height: 8rem; + } + h3{ + font-size:1.3rem; + } + p{ + font-size:.9rem; + max-width: 80%; + flex: 0 0 80%; + } + .cta-buttons{ + float:none; + bottom:0; + position: absolute; + button{ + max-width: 400px; + } + } + } +} +@media (max-height: 540px){ + #onboarding-backup-request{ + .cta-buttons{ + float:left; + position: relative; + } + } +} +@media (min-height: 980px){ + #onboarding-backup-request{ + #arrow-down{ + margin-top: 15rem; + } + } } \ No newline at end of file diff --git a/src/sass/views/onboarding/onboard-backup-warning.scss b/src/sass/views/onboarding/onboard-backup-warning.scss index 0ee7b5c1b..7eaeacbca 100644 --- a/src/sass/views/onboarding/onboard-backup-warning.scss +++ b/src/sass/views/onboarding/onboard-backup-warning.scss @@ -8,4 +8,46 @@ #arrow-down{ font-size: 4.2rem; } + .cta-buttons{ + float:none; + bottom:46px; + position: absolute; + width:100%; + button{ + max-width: 400px; + } + } +} + +@media (max-width: 400px){ + #onboarding-backup-warning{ + .warning{ + margin: 2rem auto 1rem; + height: 8rem; + } + h3{ + font-size:1.3rem; + } + p{ + font-size:.9rem; + max-width: 80%; + flex: 0 0 80%; + } + .warning-image{ + height: 11rem; + } + .cta-buttons{ + float:none; + bottom:46px; + position: absolute; + } + } +} +@media (max-height: 540px){ + #onboarding-backup-warning{ + .cta-buttons{ + float:left; + position: relative; + } + } } \ No newline at end of file diff --git a/src/sass/views/onboarding/onboard-collect-email.scss b/src/sass/views/onboarding/onboard-collect-email.scss index 125d21a93..3cc60ce01 100644 --- a/src/sass/views/onboarding/onboard-collect-email.scss +++ b/src/sass/views/onboarding/onboard-collect-email.scss @@ -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% { diff --git a/src/sass/views/onboarding/onboard-tour.scss b/src/sass/views/onboarding/onboard-tour.scss index ddb13b75e..b955d6c53 100644 --- a/src/sass/views/onboarding/onboard-tour.scss +++ b/src/sass/views/onboarding/onboard-tour.scss @@ -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; + } + } + } +} diff --git a/src/sass/views/onboarding/onboarding.scss b/src/sass/views/onboarding/onboarding.scss index 0c5522ac3..c84b0e3df 100644 --- a/src/sass/views/onboarding/onboarding.scss +++ b/src/sass/views/onboarding/onboarding.scss @@ -81,6 +81,12 @@ h2{ font-size: 1.2rem; } + p,h2,h3{ + max-width: 600px !important; + } + button{ + max-width: 400px !important; + } } } }