diff --git a/src/css/states/mobile_warning.scss b/src/css/states/mobile_warning.scss index 8b6ddd61..2e68b56a 100644 --- a/src/css/states/mobile_warning.scss +++ b/src/css/states/mobile_warning.scss @@ -4,6 +4,8 @@ background: #333438 !important; @include S(padding, 20px); box-sizing: border-box; + justify-content: center; + flex-direction: column; .logo { width: 80%; @@ -17,20 +19,23 @@ margin-bottom: 13px; font-size: 16px; line-height: 20px; + max-width: 300px; + text-align: left; a { color: $colorBlueBright; } } .standaloneLink { - width: 100%; + width: 200px; height: 80px; + min-height: 40px; background: uiResource("get_on_itch_io.svg") center center / contain no-repeat; overflow: hidden; display: block; text-indent: -999em; cursor: pointer; - margin-top: 20px; + margin-top: 10px; pointer-events: all; transition: all 0.12s ease-in; transition-property: opacity, transform; diff --git a/src/js/states/mobile_warning.js b/src/js/states/mobile_warning.js index b0d271ac..c6903164 100644 --- a/src/js/states/mobile_warning.js +++ b/src/js/states/mobile_warning.js @@ -9,22 +9,20 @@ export class MobileWarningState extends GameState { getInnerHTML() { return ` - -
- + + -

- I'm sorry, but shapez.io is not yet available on mobile devices! - (There is also no estimate when this will change, but feel to make a contribution! It's -  open source!)

- -

If you want to play on your computer, you can also get the standalone on itch.io:

+

+ I'm sorry, but shapez.io is not yet available on mobile devices! + (There is also no estimate when this will change, but feel to make a contribution! It's +  open source!)

+ +

If you want to play on your computer, you can also get the standalone on itch.io:

- - Get the shapez.io standalone! -
+ + Get the shapez.io standalone! `; }