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.
This commit is contained in:
John "Elwin" Edwards 2012-06-11 12:00:44 -07:00
parent c7cb905b29
commit b24bf3b972
2 changed files with 20 additions and 28 deletions

View file

@ -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 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>
Name: <input type="text" name="name" id="regin_name">
<div><span class="ibutton" onclick="formreg(event)">Sign up</span></div>
<div><span class="ibutton" onclick="setmode('login')">Cancel</span></div>
</div>
<div>
Password: <input type="password" name="pw" id="regin_pw">
</div>
<div>
E-mail (optional): <input type="text" name="email" id="regin_email">
</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>

View file

@ -20,22 +20,22 @@ div.rfloat {
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 @@ span.ibutton {
border-radius: 0.3em;
padding: 0.2em 0.5em;
}
div#register div.formtable span.ibutton {
font-weight: bold;
}