diff --git a/.gitignore b/.gitignore index 0d31019..5251a52 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ .sass-cache/ +.vscode/ diff --git a/index.html b/index.html index 7e2635d..8d20184 100644 --- a/index.html +++ b/index.html @@ -101,7 +101,7 @@
× -

New: Get the new 2048 app for iOS and Android!

+

Get 2048 for iOS and Android!

diff --git a/index2.html b/index2.html new file mode 100644 index 0000000..abe92ab --- /dev/null +++ b/index2.html @@ -0,0 +1,223 @@ + + + + + 2048 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+

2048 uses cookies to analyse traffic to the site and to serve ads. Learn More

+ Got it +
+ +
+
+

2048

+
+
0
+
0
+
+
+ +
+

Join the numbers and get to the 2048 tile!

+ New Game +
+ +
+ × +

Get 2048 for iOS and Android!

+
+ +
+
+

+
+ Keep going + Try again +
+
+ +
+ Get email updates from Gabriele + + + + +
+ +
+ + +
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+ +
+
+ +
+ + +
+ +

+ How to play: Use your arrow keys to move the tiles. When two tiles with the same number touch, they merge into one! +

+
+

+ Note: The game on this site is the original version of 2048. Apps for iOS and Android are also available. Other versions are derivatives or fakes, and should be used with caution. +

+
+

+ Created by Gabriele Cirulli. Based on 1024 by Veewo Studio and conceptually similar to Threes by Asher Vollmer. +

+ + + +
+ + + + + + + + + + + + + diff --git a/style/main.css b/style/main.css index 8dffd67..31c2f77 100644 --- a/style/main.css +++ b/style/main.css @@ -611,7 +611,7 @@ hr { float: right; } .game-explanation { - margin-top: 50px; } + margin-top: 30px; } .sharing { margin-top: 20px; @@ -984,7 +984,7 @@ hr { -moz-transform: scale(0) translateZ(0); transform: scale(0) translateZ(0); opacity: 0; - margin-top: -56px; } + margin-top: -40px; } 100% { -webkit-transform: scale(1) translateZ(0); @@ -998,7 +998,7 @@ hr { -moz-transform: scale(0) translateZ(0); transform: scale(0) translateZ(0); opacity: 0; - margin-top: -56px; } + margin-top: -40px; } 100% { -webkit-transform: scale(1) translateZ(0); @@ -1012,7 +1012,7 @@ hr { -moz-transform: scale(0) translateZ(0); transform: scale(0) translateZ(0); opacity: 0; - margin-top: -56px; } + margin-top: -40px; } 100% { -webkit-transform: scale(1) translateZ(0); @@ -1026,7 +1026,7 @@ hr { -moz-transform: scale(0) translateZ(0); transform: scale(0) translateZ(0); opacity: 0; - margin-top: -76px; } + margin-top: -40px; } 100% { -webkit-transform: scale(1) translateZ(0); @@ -1040,7 +1040,7 @@ hr { -moz-transform: scale(0) translateZ(0); transform: scale(0) translateZ(0); opacity: 0; - margin-top: -76px; } + margin-top: -40px; } 100% { -webkit-transform: scale(1) translateZ(0); @@ -1054,7 +1054,7 @@ hr { -moz-transform: scale(0) translateZ(0); transform: scale(0) translateZ(0); opacity: 0; - margin-top: -76px; } + margin-top: -40px; } 100% { -webkit-transform: scale(1) translateZ(0); @@ -1069,9 +1069,9 @@ hr { animation: pop-in-big 700ms ease 2s both; background: #edc53f; color: white; - padding: 18px; + padding: 10px; margin-top: 30px; - height: 56px; + height: 40px; box-sizing: border-box; border-radius: 3px; } .app-notice:after { @@ -1096,7 +1096,7 @@ hr { -moz-animation: pop-in-small 700ms ease 2s both; animation: pop-in-small 700ms ease 2s both; margin-top: 10px; - height: 76px; } } + height: 40px; } } .links { text-align: center; @@ -1121,6 +1121,21 @@ hr { .sidebar .adsbygoogle { display: none; } } + +.under-board-container { + height: 50px; + margin-top: 38px; } + + +.under-board-container, +.under-board-container .adsbygoogle { + display: none; } + +@media (max-width: 880px) { + .under-board-container, + .under-board-container .adsbygoogle { + display: block; } } + .cookie-notice { position: fixed; font-size: 15px; diff --git a/style/main.scss b/style/main.scss index 02f027d..2dd4bf5 100644 --- a/style/main.scss +++ b/style/main.scss @@ -551,7 +551,7 @@ hr { } .game-explanation { - margin-top: 50px; + margin-top: 30px; } .sharing { @@ -776,7 +776,7 @@ hr { 0% { @include transform(scale(0) translateZ(0)); opacity: 0; - margin-top: -56px; + margin-top: -40px; } 100% { @@ -790,7 +790,7 @@ hr { 0% { @include transform(scale(0) translateZ(0)); opacity: 0; - margin-top: -76px; + margin-top: -40px; } 100% { @@ -805,9 +805,9 @@ hr { @include animation(pop-in-big 700ms ease 2s both); background: #edc53f; color: white; - padding: 18px; + padding: 10px; margin-top: 30px; - height: 56px; + height: 40px; box-sizing: border-box; border-radius: $tile-border-radius; @@ -841,7 +841,7 @@ hr { @include smaller($mobile-threshold) { @include animation(pop-in-small 700ms ease 2s both); margin-top: 10px; - height: 76px; + height: 40px; } } @@ -876,6 +876,23 @@ hr { } } +.under-board-container { + height: 50px; + margin-top: 38px; +} + +.under-board-container, +.under-board-container .adsbygoogle { + display: none; +} + +@media (max-width: 880px) { + .under-board-container, + .under-board-container .adsbygoogle { + display: block; + } +} + .cookie-notice { position: fixed; font-size: 15px;