Move yellow and red completeboxes into CSS classes

client/css/style.css

@@ -63,6 +63,15 @@ body {
 	-moz-border-radius: 25%;
 	border-radius: 25%;
 }
+
+.completeBox-warning {
+	border-color: #fbb03b;
+}
+
+.completeBox-danger {
+	border-color: #a0222a;
+}
+
 .taskRowTop {
 	padding-left: 45px;
 	cursor: pointer;

client/views/main.html

@@ -34,14 +34,14 @@
 							</small>
 						</div>
 						<div class="taskListItem">
-							<a href="#" class="completeBox" style="border: 3px solid #a0222a;"></a>
+							<a href="#" class="completeBox completeBox-danger"></a>
 							<div class="taskRowTop">Dolor, provident odit pariatur</div>
 							<small class="taskRowBottom">
 								<span class="dueDate">21 Aug 2012</span> | <span class="taskItemList">Programming</span>
 							</small>
 						</div>
 						<div class="taskListItem">
-							<a href="#" class="completeBox" style="border: 3px solid #fbb03b;"></a>
+							<a href="#" class="completeBox completeBox-warning"></a>
 							<div class="taskRowTop">Aperiam, eos, mollitia! Iure</div>
 							<small class="taskRowBottom">
 								<span class="dueDate">16 Oct 2012</span> | <span class="taskItemList">Personal</span>