diff options
| author | kumavis <kumavis@users.noreply.github.com> | 2018-03-14 01:53:21 +0800 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2018-03-14 01:53:21 +0800 |
| commit | 6a17a0cdf1bb3a13b5354606f1cfdac40659689a (patch) | |
| tree | 3d6a214b845790c96e2c98e6c140ed6724d261e4 /ui/app/css | |
| parent | 1fa5cec2ec784ace2dd8d1afab6c0d8cc195feb5 (diff) | |
| parent | 572234e383f944eb2be28c4192f209c3972747b7 (diff) | |
| download | tangerine-wallet-browser-6a17a0cdf1bb3a13b5354606f1cfdac40659689a.tar tangerine-wallet-browser-6a17a0cdf1bb3a13b5354606f1cfdac40659689a.tar.gz tangerine-wallet-browser-6a17a0cdf1bb3a13b5354606f1cfdac40659689a.tar.bz2 tangerine-wallet-browser-6a17a0cdf1bb3a13b5354606f1cfdac40659689a.tar.lz tangerine-wallet-browser-6a17a0cdf1bb3a13b5354606f1cfdac40659689a.tar.xz tangerine-wallet-browser-6a17a0cdf1bb3a13b5354606f1cfdac40659689a.tar.zst tangerine-wallet-browser-6a17a0cdf1bb3a13b5354606f1cfdac40659689a.zip | |
Merge pull request #3468 from danjm/i3033-responsive-newui-onboarding
Make new-ui create password screen responsive.
Diffstat (limited to 'ui/app/css')
| -rw-r--r-- | ui/app/css/itcss/components/index.scss | 3 | ||||
| -rw-r--r-- | ui/app/css/itcss/components/newui-sections.scss | 1 | ||||
| -rw-r--r-- | ui/app/css/itcss/components/welcome-screen.scss | 59 |
3 files changed, 62 insertions, 1 deletions
diff --git a/ui/app/css/itcss/components/index.scss b/ui/app/css/itcss/components/index.scss index 0219f9fb2..f107b7aca 100644 --- a/ui/app/css/itcss/components/index.scss +++ b/ui/app/css/itcss/components/index.scss @@ -55,3 +55,6 @@ @import './new-account.scss'; @import './tooltip.scss'; + +@import './welcome-screen.scss'; + diff --git a/ui/app/css/itcss/components/newui-sections.scss b/ui/app/css/itcss/components/newui-sections.scss index a6d03a6c7..5cdda5e6c 100644 --- a/ui/app/css/itcss/components/newui-sections.scss +++ b/ui/app/css/itcss/components/newui-sections.scss @@ -292,7 +292,6 @@ $wallet-view-bg: $alabaster; padding-right: 6px; } - // first time .first-view-main { display: flex; diff --git a/ui/app/css/itcss/components/welcome-screen.scss b/ui/app/css/itcss/components/welcome-screen.scss new file mode 100644 index 000000000..bfd174ad9 --- /dev/null +++ b/ui/app/css/itcss/components/welcome-screen.scss @@ -0,0 +1,59 @@ +.welcome-screen { + display: flex; + flex-flow: column; + justify-content: center; + align-items: center; + font-family: Roboto; + font-weight: 400; + width: 100%; + flex: 1 0 auto; + padding: 70px 0; + background: $white; + + @media screen and (max-width: 575px) { + padding: 0; + } + + &__info { + display: flex; + flex-flow: column; + width: 100%; + height: 100%; + align-items: center; + + &__header { + font-size: 1.65em; + margin-bottom: 14px; + + @media screen and (max-width: 575px) { + font-size: 1.5em; + } + } + + &__copy { + font-size: 1em; + width: 400px; + max-width: 90vw; + text-align: center; + + @media screen and (max-width: 575px) { + font-size: 0.9em; + } + } + } + + &__button { + height: 54px; + width: 198px; + box-shadow: 0 2px 4px 0 rgba(0,0,0,0.14); + color: #FFFFFF; + font-size: 20px; + font-weight: 500; + line-height: 26px; + text-align: center; + text-transform: uppercase; + margin: 35px 0 14px; + transition: 200ms ease-in-out; + background-color: rgba(247, 134, 28, 0.9); + } +} |