changeset 50:bef5629f50d8

RLG-Web client: improve the forms. Put the forms into CSS tables so they look nicer. Also remove the <form> elements so they won't be submitted as forms.
author John "Elwin" Edwards <elwin@sdf.org>
date Mon, 11 Jun 2012 12:00:44 -0700
parents 423ef87ddc9b
children 2eda3909f6a3
files index-rlg.html style-rlg.css
diffstat 2 files changed, 20 insertions(+), 28 deletions(-) [+]
line wrap: on
line diff
--- a/index-rlg.html	Mon Jun 11 09:15:33 2012 -0700
+++ b/index-rlg.html	Mon Jun 11 12:00:44 2012 -0700
@@ -86,38 +86,26 @@
 </div>
 </div>
 <div class="modal" id="startgame">
-<div id="opttable"><div><div>Game</div><div>Actions</div></div></div>
+<div id="opttable" class="formtable"><div><div>Game</div><div>Actions</div></div></div>
 </div>
 <div class="modal" id="login">
-<form id="loginform" action="/login" method="post">
-<div>
-Name: <input type="text" name="name" id="input_name"> 
+<div class="formtable">
+<div><div>Name:</div><div><input type="text" name="name" id="input_name"></div></div>
+<div><div>Password:</div><div><input type="password" name="pw" id="input_pw"></div></div>
+<div><div><span class="ibutton" onclick="formlogin(event)">Log in</span></div></div>
 </div>
-<div>
-Password: <input type="password" name="pw" id="input_pw">
-</div>
-<div>
-<input type="submit" value="Log in" onclick="formlogin(event)">
-</div>
-</form>
-<div class="rbutton" onclick="setmode('register')">Register</div>
+<div class="rfloat"><span class="ibutton" onclick="setmode('register')">New name</span></div>
 </div>
 <div class="modal" id="register">
-<form id="regform" action="/addacct" method="post">
-<div>
-Name: <input type="text" name="name" id="regin_name"> 
-</div>
-<div>
-Password: <input type="password" name="pw" id="regin_pw">
-</div>
+<div class="formtable">
+<div><div>Name:</div><div><input type="text" name="name" id="regin_name"></div></div>
+<div><div>Password:</div><div><input type="password" name="pw" id="regin_pw"></div></div>
+<div><div>E-mail (optional):</div><div><input type="text" name="email" id="regin_email"></div></div>
 <div>
-E-mail (optional): <input type="text" name="email" id="regin_email">
+<div><span class="ibutton" onclick="formreg(event)">Sign up</span></div>
+<div><span class="ibutton" onclick="setmode('login')">Cancel</span></div>
 </div>
-<div>
-<input type="submit" value="Sign up" onclick="formreg(event)">
-<input type="reset" value="Cancel" onclick="setmode('login', event)">
 </div>
-</form>
 </div>
 <div id="debug">
 <p>Debugging Output</p>
--- a/style-rlg.css	Mon Jun 11 09:15:33 2012 -0700
+++ b/style-rlg.css	Mon Jun 11 12:00:44 2012 -0700
@@ -20,22 +20,22 @@
 	padding: 0.4em;
 }
 
-div#opttable {
+div.formtable {
 	display: table;
 	margin: 1em auto;
 	border: 2px solid #101040;
 }
 
-div#opttable > div {
+div.formtable > div {
 	display: table-row;
 }
 
-div#opttable > div > div {
+div.formtable > div > div {
 	display: table-cell;
 	padding: 0.4em 2em;
 }
 
-div#opttable > div > div:first-child {
+div.formtable > div > div:first-child {
 	font-weight: bold;
 	text-align: center;
 }
@@ -46,3 +46,7 @@
 	border-radius: 0.3em;
 	padding: 0.2em 0.5em;
 }
+
+div#register div.formtable span.ibutton {
+	font-weight: bold;
+}