Adding now deployment targets, an alpha icon and cleaning up the sign…

… in page.

scripts/gameboy.sublime-project

@@ -8,12 +8,17 @@
   "build_systems":
   [
     {
-      "name": "jbmorley.co.uk",
-      "cmd": ["/bin/bash", "deploy.sh", "../settings/jbmorley.json"],
+      "name": "gameplaycolor.com - alpha",
+      "cmd": ["/bin/bash", "deploy.sh", "../settings/alpha.json"],
       "working_dir": "${project_path}"
     },
     {
-      "name": "gameplaycolor.com",
+      "name": "gameplaycolor.com - beta",
+      "cmd": ["/bin/bash", "deploy.sh", "../settings/beta.json"],
+      "working_dir": "${project_path}"
+    },
+    {
+      "name": "gameplaycolor.com - release",
       "cmd": ["/bin/bash", "deploy.sh", "../settings/gameplaycolor.json"],
       "working_dir": "${project_path}"
     }

settings/alpha.json

@@ -0,0 +1,11 @@
+{
+    "remote": "zyloid:~/sites/gameplaycolor/alpha",
+    "client_id": "151379758364",
+    "client_secret": "jn3po_ZX5rmfMm9DZ3Z4yyLd",
+    "scopes": ["https://www.googleapis.com/auth/drive.readonly", "https://www.googleapis.com/auth/userinfo.email"],
+    "analytics": "UA-37991248-2",
+    "domain": "alpha.gameplaycolor.com",
+    "redirect_uri": "https://alpha.gameplaycolor.com/",
+    "icon": "icons/icon-alpha.png",
+    "debug": true
+}

settings/beta.json

@@ -0,0 +1,11 @@
+{
+    "remote": "zyloid:~/sites/gameplaycolor/beta",
+    "client_id": "151379758364",
+    "client_secret": "jn3po_ZX5rmfMm9DZ3Z4yyLd",
+    "scopes": ["https://www.googleapis.com/auth/drive.readonly", "https://www.googleapis.com/auth/userinfo.email"],
+    "analytics": "UA-37991248-2",
+    "domain": "beta.gameplaycolor.com",
+    "redirect_uri": "https://beta.gameplaycolor.com/",
+    "icon": "icons/icon-beta.png",
+    "debug": false
+}

src/css/gameboy.css

@@ -581,34 +581,12 @@ body
   background-color: #222;
 }
 
-.instructions
-{
-  text-align: left;
-  font-size: 0.8em;
-  counter-reset: numList;
-  list-style: none;
-  position: relative;
-}
-
-.instructions li:before {
-  counter-increment: numList;
-  content: counter(numList);
-  float: left;
-  position: absolute;
-  left: 0;
-  font: bold 16px sans-serif;
-  text-align: center;
-  color: #000;
-  line-height: 24px;
-  width: 24px;
-  height: 24px;
-  background-color: #fff;
-  border-radius: 999px
-}
-
-.instructions li
-{
-  padding: 4px 0;
+.sign-in-button {
+  background-size: 24px 24px;
+  background-image: url(images/drive.png);
+  background-repeat: no-repeat;
+  padding-left: 36px;
+  background-position: 20px center;
 }
 
 .body-grey
@@ -1093,12 +1071,22 @@ body
   margin: 8px 0;
   color: #fff;
   padding: 8px;
+
+  border: 0;
+  font-size: 20px;
+  background-color: #666;
+  margin: 8px 0;
+  color: #fff;
+  padding: 8px;
+  border-radius: 6px;
+  font-family: Courier, fixed;
+  text-align: center;
 }
 
 .input-code:focus
 {
   outline: none;
-  border: 3px solid red;
+  background-color: #888;
 }
 
 .auth-code

src/index.html

@@ -128,18 +128,18 @@ <h1>Game Play Color</h1>
     <div id="screen-account" class="screen-instructions" style="display: none">
       <div class="placeholder">
         <div class="appicon"></div>
-        <ol class="instructions">
-          <li>Sign in to Google Drive<br /><a class="simple-button" id="google-drive-auth" href="" target="_blank">Sign In</a></li>
-          <li>Enter the code you receive.<br /><input id="redeem-code" class="input-code" type="text" /></li>
-          <li>Click to continue.<br /><div class="simple-button" id="button-redeem">Continue</div></li>
-        </ol>
+        <div class="instructions">
+          <p><a class="simple-button sign-in-button" id="google-drive-auth" href="" target="_blank">Sign In</a></p>
+          <hr />
+          <p>Enter access code:<br /><input id="redeem-code" class="input-code" type="text" /><br /><div class="simple-button" id="button-redeem">Continue</div></p>
+        </div>
       </div>
     </div>
 
     <div id="screen-authorizing" class="screen-instructions" style="display: none">
       <div class="placeholder">
         <div class="appicon"></div>
-        <p>Copy and paste the code into <strong>Game Play Color</strong> then click <strong>Continue</strong>.</p>
+        <p>Copy and paste the access code into <strong>Game Play Color</strong> then click <strong>Continue</strong>.</p>
         <textarea readonly="yes" rows="6" id="authorization-code" class="auth-code" type="text" onFocus="this.selectionStart=0; this.selectionEnd=this.value.length;" onTouchEnd="this.selectionStart=0; this.selectionEnd=this.value.length;" onMouseUp="return false" />
         <p id="message-success" style="display: none">Success :)</p>
         <p id="message-failure" style="display: none">Failure =(</p>