center cube in screen

tx2z · Feb 21, 2014 · c79686f · c79686f
1 parent 3ed1f01
commit c79686f
Show file tree

Hide file tree

Showing 7 changed files with 59 additions and 18 deletions.
diff --git a/cache.appcache b/cache.appcache
@@ -1,5 +1,5 @@
 CACHE MANIFEST
-# Version 0.6
+# Version 0.7
 css/app.css
 levels/maths-subtractions/img-5-1.png
 levels/maths-subtractions/level-icon.png

diff --git a/css/app.css b/css/app.css
diff --git a/css/app.scss b/css/app.scss
@@ -139,6 +139,20 @@ body {
     text-shadow: 0px 0px 2px hsla(0, 0%, 100%, 1);
 }
 
+/* Center Cube */
+#portrait {
+    height: 100%
+}
+.table {
+    display: table;
+    height: 100%;
+    margin: 0 auto;
+}
+.cell {
+    display:table-cell;
+    vertical-align:middle;
+}
+
 .wrapper {
     margin: 0 auto;
     position: relative;

diff --git a/index.html b/index.html
@@ -22,22 +22,26 @@
 <body>
 <div id="portrait">
   <div class="chrono" data-seconds=""></div>
-  <div class="wrapper">
-    <div data-goto="0" class="turnLink inTop icon-arrow-down"></div>
-    <div id="container" class="index">
-      <div id="cube" class="show-front">
-        <div class="cubeFace front">
-          <h1>MEMORY CUBE</h1>
-          <a href="#" class="startGame">Play</a>
+  <div class="table">
+    <div class="cell">
+      <div class="wrapper">
+        <div data-goto="0" class="turnLink inTop icon-arrow-down"></div>
+        <div id="container" class="index">
+          <div id="cube" class="show-front">
+            <div class="cubeFace front">
+              <h1>MEMORY CUBE</h1>
+              <a href="#" class="startGame">Play</a>
+            </div>
+            <div class="cubeFace top"></div>
+            <div class="cubeFace bottom"></div>
+            <div class="cubeFace left"></div>
+            <div class="cubeFace right"></div>
+            <div class="cubeFace back"></div>
+          </div>
         </div>
-        <div class="cubeFace top"></div>
-        <div class="cubeFace bottom"></div>
-        <div class="cubeFace left"></div>
-        <div class="cubeFace right"></div>
-        <div class="cubeFace back"></div>
+        <div data-goto="1" class="turnLink inBottom icon-arrow-up"></div>
       </div>
     </div>
-    <div data-goto="1" class="turnLink inBottom icon-arrow-up"></div>
   </div>
   <div class="icon-cog"></div>
   <div id="appMenu">

diff --git a/js/app.js b/js/app.js
@@ -220,7 +220,7 @@
             }
         }
 
-        $('#appMenu').append('<div class="gameFinished"><h1>Well Done</h1><p>You have finish "' + level + '" in ' + finalTime + '</p><p class="finishedLevelScore">' + finalScore + '</p><a href="#" class="repeatGame">Play Again</a><a href="#" class="goToLevels">Next Level</a></div>');
+        $('#appMenu').append('<div class="gameFinished"><h1>Well Done</h1><p>You have finished "' + level + '" in ' + finalTime + '</p><p class="finishedLevelScore">' + finalScore + '</p><a href="#" class="repeatGame">Play Again</a><a href="#" class="goToLevels">Next Level</a></div>');
         $('#appMenu .icon-cog, #appMenu .contentAppMenu').css('display','none');
         openLateral();
 

diff --git a/js/app.min.js b/js/app.min.js
diff --git a/web-app-manifest.json b/web-app-manifest.json
@@ -1,6 +1,6 @@
 {
   "verification_key" : "609841b8-a9f1-4844-91a5-f8269c4286eb",
-  "version" : "1.00(0)",
+  "version" : "1.1(0)",
   "type" : "web",
   "last_update" : "2013-12-05 12:15:24+0000"
 }