<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
- <meta charset="utf-8"/>
- <title>GameStick activation: Code</title>
- <link rel="stylesheet" href="css/css.css">
-</head>
-<body>
- <h1 id="logo_small"><a href="#">Game Stick</a></h1>
- <div id="gs">
+ <head>
+ <meta charset="utf-8"/>
+ <title>GameStick activation: Code</title>
+ <link rel="stylesheet" href="css/css.css"/>
+ </head>
+ <body>
+ <h1 id="logo_small"><a href="#">Game Stick</a></h1>
+ <div id="gs">
- <div id="page_1" class="page">
+ <div id="page_1" class="page">
- <h2>Welcome</h2>
+ <h2>Welcome</h2>
- <div class="register_bar"><img style="width: 100%" src="img/register_bar.png">
- </div>
-
- <p>Almost there, just few more steps and you will have activated your GameStick.</p>
- <p>Please enter the code displayed on your TV screen below.</p>
-
- <form id="code_form" method="post" action="activate.php">
+ <div class="register_bar"><img style="width: 100%" src="img/register_bar.png"/></div>
- <label for="code">Verification code:</label><br>
- <input id="code_input" name="code" type="text" value="<?= htmlspecialchars($code) ?>"/>
- </div>
- <?php if ($error): ?>
- <div>
- <p class="error"><?= htmlspecialchars($error) ?></p>
- </div>
- <?php endif ?>
+ <p>Almost there, just few more steps and you will have activated your GameStick.</p>
+ <p>Please enter the code displayed on your TV screen below.</p>
- <button class="button" type="submit">Continue</button>
- </form>
-</div></div>
+ <form id="code_form" method="post" action="activate.php">
+ <label for="code">Verification code:</label><br/>
+ <input id="code_input" name="code" type="text" value="<?= htmlspecialchars($code) ?>"/>
+ <?php if ($error): ?>
+ <div>
+ <p class="error"><?= htmlspecialchars($error) ?></p>
+ </div>
+ <?php endif ?>
-</body>
+ <button class="button" type="submit">Continue</button>
+ </form>
+ </div>
+ </div>
+ </body>
</html>
-
<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
- <meta charset="utf-8"/>
- <title>GameStick activation: Profile</title>
- <link rel="stylesheet" href="css/css.css">
-</head>
-<body>
- <h1 id="logo_small"><a href="#">Game Stick</a></h1>
- <div id="gs" >
-
- <div id="page_1" class="page">
- <h2>PlayJam GameStick activation: Profile</h2>
- <div class="register_bar"><img style="width: 100%" src="img/register_bar.png"></div>
-
- <div class="prawy">
- <p>Create your own unique PlayTag and choose a profile image to personalise your account</p>
-
- <p>
- Also you can sign yourself as a Founder.
- </p>
- <form method="post" action="activate.php">
- <input type="hidden" name="code" value="<?= htmlspecialchars($code) ?>"/>
-
- <?php if ($input['submit'] && count($errors)): ?>
- <div style="color: red">
- Errors:
- <ul>
- <?php foreach ($errors as $msg): ?>
+ <head>
+ <meta charset="utf-8"/>
+ <title>GameStick activation: Profile</title>
+ <link rel="stylesheet" href="css/css.css"/>
+ </head>
+ <body>
+ <h1 id="logo_small"><a href="#">Game Stick</a></h1>
+ <div id="gs" >
+
+ <div id="page_1" class="page">
+ <h2>PlayJam GameStick activation: Profile</h2>
+ <div class="register_bar"><img style="width: 100%" src="img/register_bar.png"/></div>
+
+ <div class="prawy">
+ <p>Create your own unique PlayTag and choose a profile image to personalise your account</p>
+
+ <p>
+ Also you can sign yourself as a Founder.
+ </p>
+ <form method="post" action="activate.php">
+ <input type="hidden" name="code" value="<?= htmlspecialchars($code) ?>"/>
+
+ <?php if ($input['submit'] && count($errors)): ?>
+ <div style="color: red">
+ Errors:
+ <ul>
+ <?php foreach ($errors as $msg): ?>
<li><?= htmlspecialchars($msg) ?></li>
- <?php endforeach ?>
- </ul>
- </div>
- <?php endif ?>
-
- <div>
- <label style="font-size: 16px;" for="gamerTag">PlayTag:</label>
- <input style="float: right;" id="gamerTag" name="gamerTag" type="text"
- value="<?= htmlspecialchars($input['gamerTag']) ?>"
- pattern="[a-zA-Z0-9 ]+"
- required=""
- title="Allowed: A-Z, a-z, 0-9, space"
- />
- </div>
-
- <div>
- <label>
- <input id="founderFlag" name="founderFlag" type="checkbox"
- value="1"
- <?php if ($input['founderFlag']) { echo 'checked=""';} ?>
- />
- I am a founder
- </label>
- </div>
+ <?php endforeach ?>
+ </ul>
+ </div>
+ <?php endif ?>
+
+ <div>
+ <label style="font-size: 16px;" for="gamerTag">PlayTag:</label>
+ <input style="float: right;" id="gamerTag" name="gamerTag" type="text"
+ value="<?= htmlspecialchars($input['gamerTag']) ?>"
+ pattern="[a-zA-Z0-9 ]+"
+ required=""
+ title="Allowed: A-Z, a-z, 0-9, space"
+ />
+ </div>
- <div>
- <br>
- <label style="font-size: 16px;" for="founderName">Founder name:</label>
- <input style="float: right;" id="founderName" name="founderName" type="text"
- value="<?= htmlspecialchars($input['founderName']) ?>"
- pattern="[a-zA-Z0-9 ]*"
- title="Allowed: A-Z, a-z, 0-9, space"
- />
- </div>
- <br>
- <label style="font-size: 14px;">Show games suitable for ages:</label><br>
- <label>
- <input type="radio" name="minAge" value="3"
- <?php if ($input['minAge'] == 3) { echo 'checked=""';} ?>
- />
- 3+
- </label>
-
- <label>
- <input type="radio" name="minAge" value="7"
- <?php if ($input['minAge'] == 7) { echo 'checked=""';} ?>
- />
- 7+
- </label>
-
- <label>
- <input type="radio" name="minAge" value="12"
- <?php if ($input['minAge'] == 12) { echo 'checked=""';} ?>
- />
- 12+
- </label>
-
- <label>
- <input type="radio" name="minAge" value="17"
- <?php if ($input['minAge'] == 17) { echo 'checked=""';} ?>
- />
- 17+
- </label>
- </div>
- <div name="lewy" style="width: 48%;">
- <label>Avatar image:</label>
- <div id="avatary"> <br>
- <br>
+ <div>
+ <label>
+ <input id="founderFlag" name="founderFlag" type="checkbox"
+ value="1"
+ <?php if ($input['founderFlag']) { echo 'checked=""';} ?>
+ />
+ I am a founder
+ </label>
+ </div>
+ <div>
+ <br/>
+ <label style="font-size: 16px;" for="founderName">Founder name:</label>
+ <input style="float: right;" id="founderName" name="founderName" type="text"
+ value="<?= htmlspecialchars($input['founderName']) ?>"
+ pattern="[a-zA-Z0-9 ]*"
+ title="Allowed: A-Z, a-z, 0-9, space"
+ />
+ </div>
+ <br/>
- <?php foreach ($avatars as $key => $smallImagePath): ?>
- <br>
- <div id="test">
+ <div>
+ <label style="font-size: 14px;">Show games suitable for ages:</label><br/>
<label>
+ <input type="radio" name="minAge" value="3"
+ <?php if ($input['minAge'] == 3) { echo 'checked=""';} ?>
+ />
+ 3+
+ </label>
+ <label>
+ <input type="radio" name="minAge" value="7"
+ <?php if ($input['minAge'] == 7) { echo 'checked=""';} ?>
+ />
+ 7+
+ </label>
-
- <img src="<?= htmlspecialchars($smallImagePath) ?>"
- alt="Avatar <?= htmlspecialchars($key) ?>"
- width="118" height="118"
+ <label>
+ <input type="radio" name="minAge" value="12"
+ <?php if ($input['minAge'] == 12) { echo 'checked=""';} ?>
/>
- <br>
- <input style="
- align-items: center;" type="radio" name="avatar" id="radioo" value="<?= htmlspecialchars($key) ?>"
- <?php if ($input['avatar'] == $key) { echo 'checked=""';} ?>
+ 12+
+ </label>
+
+ <label>
+ <input type="radio" name="minAge" value="17"
+ <?php if ($input['minAge'] == 17) { echo 'checked=""';} ?>
/>
+ 17+
</label>
</div>
- <?php endforeach ?>
- </div>
+ <div name="lewy" style="width: 48%;">
+ <label>Avatar image:</label>
+ <div id="avatary">
+ <br/>
+ <br/>
+
+
+ <?php foreach ($avatars as $key => $smallImagePath): ?>
+ <br/>
+ <div id="test">
+ <label>
+ <img src="<?= htmlspecialchars($smallImagePath) ?>"
+ alt="Avatar <?= htmlspecialchars($key) ?>"
+ width="118" height="118"
+ />
+ <br/>
+ <input style="
+ align-items: center;" type="radio" name="avatar" id="radioo"
+ value="<?= htmlspecialchars($key) ?>"
+ <?php if ($input['avatar'] == $key) { echo 'checked=""';} ?>
+ />
+ </label>
+ </div>
+ <?php endforeach ?>
+
+ </div>
+
+ <button style="float:right; " name="submit" value="1" type="submit">Submit</button>
+ </div>
+ </form>
- <button style="float:right; " name="submit" value="1" type="submit">Submit</button>
+ </div>
</div>
- </form>
-
- </div>
-</div>
-</body>
+ </div>
+ </body>
</html>
- .error {
- color: red;
+.error {
+ color: red;
+}
+input[type="radio"]:checked+label {
+ display:none;
}
-input[type="radio"]:checked+label { display:none; }
-
- body {font-size:12px;
- color:#fff;
- background:url(/img/web_background_24.png) no-repeat rgb(146,155,155); background-size:100%;
- overflow:auto;
- font-family:Avenir,Arial,sans-serif;}
- .register_bar{width:100%; margin-bottom:5%; }
- .prawy{
- width: 48%;float:right;
-}
-#avatary{width:100%;display:flex;flex-wrap: wrap; }
-
-
-#content{}
-.succes{
- clear:left;display: flex; align-content: center;flex-wrap: wrap;
- align-items: center;
- justify-content: center;
-}
-.button{
- color: white;
- font-size: 16px;
- width: 200px;
- background-color: grey;
- height: 40px;
- position: absolute;
- right: 0;
- margin-top:20px;
-}
-.button:hover{
- background-color: #f652c3;
-}
-.page h2{margin-bottom:5px; font-size:24px; font-weight:normal;}
-#gs{ margin: auto;
- width: 75%;
-padding: 10px;margin-top:10%;/* font-size:16px; */}
-#page_1 p{margin:30px 0;font-size:18px;text-align:left;line-height:40px;}
-#logo a{width:137px; height:67px; background:url(/web/20150908165227im_/https://www.gamestick.tv/img/logo.png) no-repeat 0 0; position:absolute; top:52px; left:21px; display:block; text-indent:-9999em;}
-#logo_small a{width:176px; height:24px; background:url(/img/logo_2.png) no-repeat 0 0; position:absolute; top:45px; left:21px; display:block; text-indent:-9999em;}
+body {
+ font-size: 12px;
+ color: #fff;
+ background: url(/img/web_background_24.png) no-repeat rgb(146,155,155);
+ background-size: 100%;
+ overflow: auto;
+ font-family: Avenir, Arial, sans-serif;
+}
+.register_bar {
+ width: 100%;
+ margin-bottom: 5%;
+}
+.prawy {
+ width: 48%;
+ float: right;
+}
+#avatary{
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+}
+.succes {
+ clear:left;
+ display: flex;
+ align-content: center;
+ flex-wrap: wrap;
+ align-items: center;
+ justify-content: center;
+}
+.button {
+ color: white;
+ font-size: 16px;
+ width: 200px;
+ background-color: grey;
+ height: 40px;
+ position: absolute;
+ right: 0;
+ margin-top:20px;
+}
+.button:hover {
+ background-color: #f652c3;
+}
+.page h2 {
+ margin-bottom: 5px;
+ font-size: 24px;
+ font-weight: normal;
+}
+#gs {
+ margin: auto;
+ width: 75%;
+ padding: 10px;
+ margin-top: 10%;
+ /* font-size:16px; */
+}
+#page_1 p {
+ margin: 30px 0;
+ font-size: 18px;
+ text-align: left;
+ line-height: 40px;
+}
+#logo a {
+ width: 137px;
+ height: 67px;
+ background: url(/web/20150908165227im_/https://www.gamestick.tv/img/logo.png) no-repeat 0 0;
+ position: absolute;
+ top: 52px;
+ left: 21px;
+ display: block;
+ text-indent: -9999em;
+}
+#logo_small a {
+ width: 176px;
+ height: 24px;
+ background: url(/img/logo_2.png) no-repeat 0 0;
+ position: absolute;
+ top: 45px;
+ left: 21px;
+ display: block;
+ text-indent: -9999em;
+}
-#code_form{text-align:center;background:#f652c3;height:66px;margin: auto;
- width: 80%;
+#code_form{
+ text-align: center;
+ background: #f652c3;
+ height: 66px;
+ margin: auto;
+ width: 80%;
+ padding: 10px;
+ margin-top: 10%;
+}
- padding: 10px;margin-top:10%;}
- #code_form input{margin: auto;
+#code_form input {
width: 90%;
+ height: 36px;
- padding: 10px;margin-top:10%; height:36px; padding:4px 4px; margin:9px; font-size:34px; border:2px solid #787e7d;}
- .page h2{margin-bottom:5px; font-size:24px; font-weight:normal;}
+ padding: 4px 4px;
+ margin-top: 10%;
+ margin: 9px;
+ font-size: 34px;
+ border: 2px solid #787e7d;
+}
+.page h2 {
+ margin-bottom: 5px;
+ font-size: 24px;
+ font-weight: normal;
+}