[aur-dev] [PATCH 3/3] Modernize the account search form

[Lukas Fleischer]

Replace the table layout with field sets, labels and CSS formatting.

Signed-off-by: Lukas Fleischer <archlinux at cryptocrack.de>
---
 web/template/search_accounts_form.php | 120 ++++++++++++++--------------------
 1 file changed, 48 insertions(+), 72 deletions(-)

diff --git a/web/template/search_accounts_form.php b/web/template/search_accounts_form.php
index d7f54be..3531eb0 100644
--- a/web/template/search_accounts_form.php
+++ b/web/template/search_accounts_form.php
@@ -1,75 +1,51 @@
 <br />
 <form action="<?= get_uri('/accounts/'); ?>" method="post">
-	<table>
-
-		<tr>
-			<td align="left"><?= __("Username"); ?>:</td>
-			<td align="left">
-				<input type="text" size="30" maxlength="64" name="U" />
-			</td>
-		</tr>
-
-		<tr>
-			<td align="left"><?= __("Account Type"); ?>:</td>
-			<td align="left">
-				<select name="T">
-					<option value=""><?= __("Any type"); ?></option>
-					<option value="u"><?= __("Normal user"); ?></option>
-					<option value="t"><?= __("Trusted user"); ?></option>
-					<option value="d"><?= __("Developer"); ?></option>
-				</select>
-			</td>
-		</tr>
-
-		<tr>
-			<td align="left"><?= __("Account Suspended"); ?>:</td>
-			<td align="left">
-				<input type="checkbox" name="S" />
-			</td>
-		</tr>
-
-		<tr>
-			<td align="left"><?= __("Email Address"); ?>:</td>
-			<td align="left">
-				<input type="text" size="30" maxlength="64" name="E" />
-			</td>
-		</tr>
-
-		<tr>
-			<td align="left"><?= __("Real Name"); ?>:</td>
-			<td align="left">
-				<input type="text" size="30" maxlength="32" name="R" />
-			</td>
-		</tr>
-
-		<tr>
-			<td align="left"><?= __("IRC Nick"); ?>:</td>
-			<td align="left">
-				<input type="text" size="30" maxlength="32" name="I" />
-			</td>
-		</tr>
-
-		<tr>
-			<td align="left"><?= __("Sort by"); ?>:</td>
-			<td align="left">
-				<select name="SB">
-					<option value="u"><?= __("Username"); ?></option>
-					<option value="t"><?= __("Account Type"); ?></option>
-					<option value="r"><?= __("Real Name"); ?></option>
-					<option value="i"><?= __("IRC Nick"); ?></option>
-				</select>
-			</td>
-		</tr>
-
-		<tr>
-			<td> </td>
-			<td align="left">
-				<br />
-				<input type="hidden" name="Action" value="SearchAccounts" />
-				<input type="submit" class="button" value="<?= __("Search"); ?>" />
-				<input type="reset" class="button" value="<?= __("Reset"); ?>" />
-			</td>
-		</tr>
-
-	</table>
+	<fieldset>
+		<input type="hidden" name="Action" value="SearchAccounts" />
+	</fieldset>
+	<fieldset>
+		<p>
+			<label for="id_username"><?= __("Username"); ?>:</label>
+			<input type="text" size="30" maxlength="64" name="U" id="id_username" />
+		</p>
+		<p>
+			<label for="id_type"><?= __("Account Type"); ?>:</label>
+			<select name="T" id="id_type">
+				<option value=""><?= __("Any type"); ?></option>
+				<option value="u"><?= __("Normal user"); ?></option>
+				<option value="t"><?= __("Trusted user"); ?></option>
+				<option value="d"><?= __("Developer"); ?></option>
+			</select>
+		</p>
+		<p>
+			<label for="id_suspended"><?= __("Account Suspended"); ?>:</label>
+			<input type="checkbox" name="S" id="id_suspended" />
+		</p>
+		<p>
+			<label for="id_email"><?= __("Email Address"); ?>:</label>
+			<input type="text" size="30" maxlength="64" name="E" id="id_email" />
+		</p>
+		<p>
+			<label for="id_realname"><?= __("Real Name"); ?>:</label>
+			<input type="text" size="30" maxlength="32" name="R" id="id_realname" />
+		</p>
+		<p>
+			<label for="id_irc"><?= __("IRC Nick"); ?>:</label>
+			<input type="text" size="30" maxlength="32" name="I" id="id_irc" />
+		</p>
+		<p>
+			<label for="id_sortby"><?= __("Sort by"); ?>:</label>
+			<select name="SB" id="id_sortby">
+				<option value="u"><?= __("Username"); ?></option>
+				<option value="t"><?= __("Account Type"); ?></option>
+				<option value="r"><?= __("Real Name"); ?></option>
+				<option value="i"><?= __("IRC Nick"); ?></option>
+			</select>
+		</p>
+		<p>
+			<label></label>
+			<input type="submit" class="button" value="<?= __("Search"); ?>" />  
+			<input type="reset" class="button" value="<?= __("Reset"); ?>" />
+		</p>
+	</fieldset>
 </form>
-- 
1.8.5.4