From 46ea32582c2d19f6b525f69421eb8f99d96cb433 Mon Sep 17 00:00:00 2001
From: perryharlock <perry.harlock@tiscali.co.uk>
Date: Mon, 16 Sep 2013 16:42:53 +0100
Subject: [PATCH] Add markup and stying to add new url form

---
 public/css/site.css |  2 +-
 public/js/site.js   |  2 +-
 view/new.html       | 71 +++++++++++++++++++++++++--------------------
 3 files changed, 41 insertions(+), 34 deletions(-)

diff --git a/public/css/site.css b/public/css/site.css
index 86f73af..bdffa9f 100644
--- a/public/css/site.css
+++ b/public/css/site.css
@@ -243,7 +243,7 @@ ul {
 }
 
 .standards-lists {
-	height:200px;
+	height:300px;
 	overflow:hidden;
 	overflow-y:auto;
 	margin-bottom:15px;
diff --git a/public/js/site.js b/public/js/site.js
index bd5bec4..7a889f8 100644
--- a/public/js/site.js
+++ b/public/js/site.js
@@ -2,7 +2,7 @@ $(document).ready(function(){
 
     var data = {};
 	var standardsList = $('[data-role="standards-list"]');
-	var standardSelect = $('#selectStandard');
+	var standardSelect = $('[data-role="new-task-select"]');
 	var headingBadges = $('.heading-badges');
     var taskListSelector = $('[data-role="task-list"] a');
     var toTopLinks = $('[data-role="top"]');
diff --git a/view/new.html b/view/new.html
index 50d3ed2..86c1704 100644
--- a/view/new.html
+++ b/view/new.html
@@ -1,13 +1,11 @@
 
 {{#content "title"}}
-	Create A Task
+	Add a new url
 {{/content}}
 
-<a href="/">&laquo; all tasks</a>
+<form class="col-md-12 col-xs-" action="/new" method="post">
 
-<h1>Create A Task</h1>
-
-<form action="/new" method="post">
+	<legend>Add a new url</legend>
 
 	{{#error}}
 		<div style="color: #c00;">
@@ -15,40 +13,49 @@
 		</div>
 	{{/error}}
 
-	<div>
-		<label for="new-task-url">URL</label><br/>
-		<input id="new-task-url" type="text" name="url" value="{{task.url}}"/>
+	<div class="form-group clearfix">
+		<div class="row">
+			<div class="col-md-8">
+				<label class="control-label" for="new-task-url">URL</label>
+				<input class="form-control" id="new-task-url" type="url" placeholder="URL" name="url" value="{{task.url}}"/>
+			</div>
+		</div>
 	</div>
 
-	<div>
-		<label for="new-task-standard">Standard</label><br/>
-		<select id="new-task-standard" name="standard">
-			<option value="">Select a standard</option>
-			{{#standards}}
-				<option {{#selected}}selected{{/selected}}>{{title}}</option>
-			{{/standards}}
-		</select>
+	<div class="form-group clearfix">
+		<div class="row">
+			<div class="col-md-4">
+				<label class="control-label" for="new-task-standard">Standard</label>
+				<select data-role="new-task-select" class="form-control" id="new-task-standard" name="standard">
+					<option value="">Select a standard</option>
+					{{#standards}}
+						<option {{#selected}}selected{{/selected}}>{{title}}</option>
+					{{/standards}}
+				</select>
+			</div>
+		</div>
 	</div>
 
-	<div>
-		Ignore Rules<br/>
+	<p class="control-label"><b>Ignore these rules</b> <a target="_blank" href="https://github.com/nature/pa11y/wiki/HTML-CodeSniffer-Rules">(full list of rules here)</a></p>
+
+	<div class="standards-lists">
 		{{#standards}}
-			<b>{{title}}</b>
-			<ul>
-				{{#rules}}
-					<li>
-						<label>
-							<input type="checkbox" name="ignore[]" value="{{name}}" {{#ignored}}checked{{/ignored}}/>
-							{{name}}
-						</label>
-					</li>
-				{{/rules}}
-			</ul>
+			<div data-role="standards-list" data-attr="{{title}}" class="form-group">
+				<p class="control-label"><b>{{title}} Rules</b></p>
+				<ul class="list-unstyled">
+					{{#rules}}
+						<li>
+							<label>
+								<input type="checkbox" name="ignore[]" value="{{name}}" {{#ignored}}checked{{/ignored}}/>
+								{{name}}
+							</label>
+						</li>
+					{{/rules}}
+				</ul>
+			</div>
 		{{/standards}}
 	</div>
 
-	<div>
-		<input type="submit" value="Add"/>
-	</div>
+	<button type="submit" class="btn btn-success"><span class="glyphicon glyphicon-plus"></span> Add url </button>
 
 </form>