Redo styles to be "pure"/simple bootstrap, and fix found issues with forms.

13 files changed, 370 insertions, 401 deletions

diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index 1c8b233..4c4405c 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -6,7 +6,7 @@
  * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
  *
  *= require_self
- *= require_tree ./application
+ *= require ./application/main
  */
 
 /* If you put any styles in this file directly, I will knife you. */
diff --git a/app/assets/stylesheets/application/bootstrapify.scss b/app/assets/stylesheets/application/bootstrapify.scss
new file mode 100644
index 0000000..0416b1e
--- /dev/null
+++ b/app/assets/stylesheets/application/bootstrapify.scss
@@ -0,0 +1,66 @@
+@import "bootstrap";
+
+.btn {
+	@extend .btn-default;
+}
+
+a[role="button"], button, input[type="submit"] {
+	@extend .btn;
+}
+
+.navbar {
+	form {
+		@extend .navbar-form;
+	}
+	.nav {
+		@extend .navbar-nav;
+	}
+	ul {
+		@extend .nav;
+	}
+}
+form {
+	input[type="text"],
+	input[type="search"],
+	input[type="tel"],
+	input[type="url"],
+	input[type="email"],
+	input[type="password"],
+	input[type="datetime"],
+	input[type="date"],
+	input[type="month"],
+	input[type="week"],
+	input[type="time"],
+	input[type="number"],
+	input[type="range"],
+	input[type="color"],
+	select, textarea{
+		@extend .form-control;
+	}
+	label {
+		@extend .control-label;
+	}
+}
+
+header nav {
+	@extend .navbar;
+	@extend .navbar-default;
+}
+
+.alert { @extend .alert-default; }
+.alert-success { @extend .alert; }
+.alert-info    { @extend .alert; }
+.alert-warning { @extend .alert; }
+.alert-danger  { @extend .alert; }
+
+.panel-primary { @extend .panel; }
+.panel-success { @extend .panel; }
+.panel-info    { @extend .panel; }
+.panel-warning { @extend .panel; }
+.panel-danger  { @extend .panel; }
+.panel {
+	h1, h2, h3, h4, h5, h6 {
+		@extend .panel-heading;
+		@extend .panel-title;
+	}
+}
diff --git a/app/assets/stylesheets/application/main.css.scss b/app/assets/stylesheets/application/main.css.scss
new file mode 100644
index 0000000..36e285b
--- /dev/null
+++ b/app/assets/stylesheets/application/main.css.scss
@@ -0,0 +1,241 @@
+// See this file for a complete list of variables:
+//    vendor/bundle/ruby/2.0.0/gems/bootstrap-sass-3.1.1.1/vendor/assets/stylesheets/bootstrap/_variables.scss
+/*
+$gray-darker:            lighten(#000, 13.5%) !default; // #222
+$gray-dark:              lighten(#000, 20%) !default;   // #333
+$gray:                   lighten(#000, 33.5%) !default; // #555
+$gray-light:             lighten(#000, 60%) !default;   // #999
+$gray-lighter:           lighten(#000, 93.5%) !default; // #eee
+
+$brand-primary:         #428bca !default;
+$brand-success:         #5cb85c !default;
+$brand-info:            #5bc0de !default;
+$brand-warning:         #f0ad4e !default;
+$brand-danger:          #d9534f !default;
+*/
+$legend-border-color: #ccc; // matches the default $input-border and $btn-default-border
+@import "bootstrapify";
+
+/* Mixins ***********************************************************/
+/* These are just here for other things to @extend. */
+/* Ok, they're really classes, but we don't use them like it. */
+
+/* More elegant version of .input-group, which is over-complicated
+   because it supports all kind of things we don't always need to.
+   This is useful because it doesn't require extra HTML elements,
+   where .input-group does. */
+.simple-input-group {
+	white-space: nowrap;
+	.btn, .form-control {
+		display: table-cell;
+		&:not(:last-child) {
+			@include border-right-radius(0);
+		}
+		&:not(:first-child) {
+			@include border-left-radius(0);
+			border-left: 0;
+		}
+	}
+}
+
+/* IDs **************************************************************/
+/* Specific page elements */
+
+#notice {
+	@extend .alert-success;
+	@extend .container;
+	text-align: center;
+}
+
+#error_explanation {
+	@extend .panel-danger;
+	@extend .container;
+	padding-left: 0;
+	padding-right: 0;
+	ul {
+		list-style: disc outside none;
+	}
+}
+
+#alerts-ajax {
+	display: none;
+}
+
+
+form#search {
+	@extend .navbar-right;
+	@extend .simple-input-group;
+}
+
+#user-actions {
+	@extend .navbar-btn;
+	@extend .navbar-left;
+	* { display: table-cell; }
+	div {
+		@extend .simple-input-group;
+		padding-right: .25em;
+	}
+}
+
+/* Classes **********************************************************/
+
+/*
+.btn {
+	&.user    { @extend .btn-info; }
+	&.signup  { @extend .btn-success; }
+	&.signin  { @extend .btn-warning; }
+	&.signout { @extend .btn-danger; }
+	&.server  { @extend .btn-warning; }
+	&.create-alert {
+		color: white;
+		background-color: rgb(255, 69, 0);
+		border-color: rgb(255, 69, 0);
+	}
+	&.alerts {
+		color: white;
+		background-color: hsl(0, 69%, 22%);
+	}
+}
+*/
+
+.field_with_errors {
+	@extend .has-error;
+	display: inline;
+	label {
+		@extend .control-label;
+	}
+}
+
+/* Elements *********************************************************/
+
+footer {
+	@extend .container;
+	margin-top: 1em;
+	border-top: solid 1px $hr-border;
+	text-align: center;
+}
+
+fieldset {
+	border: solid 1px $legend-border-color;
+	border-radius: .5em;
+	padding: 1em;
+	margin: 1em 0;
+	legend {
+		display: block;
+		margin: 0;
+		padding: .25em .5em;
+		width: auto;
+		border: solid 1px $legend-border-color;
+		border-radius: .5em;
+	}
+}
+
+form ul {
+	list-style: none;
+}
+
+pre {
+	text-align: left;
+}
+
+/* Misc *************************************************************/
+
+.tournament-listing {
+	margin: 10px 0px;
+	border-radius: 5px;
+	box-shadow: 0px 0px 3px #B8B8B8;
+	background-color: rgba(0, 0, 0, 0.6);
+	border: 1px solid #AAAAAA;
+	min-height: 100px;
+	padding: 8px 4px;
+
+	div.row {
+		margin-left: 2%;
+	}
+	p.message {
+		margin-top: 10px;
+	}
+
+	/* AKA the listing title */
+	h3 {
+		margin-top: 0px;
+		color: #F0AD4E;
+		font-weight: bold;
+	}
+
+	h3:hover {
+		color: #D09D3E;
+	}
+
+	/* host of the tournament */
+	.host {
+		font-weight: bold;
+		color: #FFF;
+	}
+
+	.col-md-8 {
+		padding: 0;
+		a {
+			padding: 5px 0 0 0;
+		}
+	}
+
+	.t-game{
+		font-weight: bold;
+		text-align: center;
+	}
+
+	.t-image{
+		display: block;
+		margin:auto;
+	}
+}
+
+
+.user-listing {
+	margin: 10px 0px;
+	border-radius: 5px;
+	box-shadow: 0px 0px 3px #B8B8B8;
+	background-color: rgba(0, 0, 0, 0.6);
+	border: 1px solid #AAAAAA;
+	min-height: 100px;
+	padding: 8px 4px;
+	display: inline-table;
+
+	/* AKA the listing title */
+	h3 {
+		margin-top: 0px;
+		color: #F0AD4E;
+		font-weight: bold;
+	}
+
+	h3:hover {
+		color: #D09D3E;
+	}
+
+	.things {
+		padding: 0px 10px;
+	}
+
+	p {
+		margin: 0;
+	}
+	div.row {
+		margin-left: 2%;
+	}
+}
+
+// Limitation: Only one box can be expanded at a time
+.collapsible {
+	.collapsed { display: block; }
+	.expanded { display: none; }
+	&:target {
+		.collapsed { display: none; }
+		.expanded { display: block; }
+	}
+}
+
+.simple_captcha {
+	background-color: rgba(255, 255, 255, 0.7);
+	margin: 10px 0px;
+}
diff --git a/app/assets/stylesheets/application/scaffolds.css.scss b/app/assets/stylesheets/application/scaffolds.css.scss
deleted file mode 100644
index 4f0c781..0000000
--- a/app/assets/stylesheets/application/scaffolds.css.scss
+++ /dev/null
@@ -1,329 +0,0 @@
-@import "bootstrap";
-@import "colors";
-
-/* Layout ***********************************************************/
-
-html {
-	body {
-		background: asset-url("bg.png", image) repeat scroll 0 0 $toolbar-color;
-		color: $page-color;
-		font-family: verdana, arial, helvetica, sans-serif;
-		font-size: 13px;
-		line-height: 18px;
-
-		header > nav {
-			@extend .navbar;
-			@extend .navbar-inverse;
-			color: white;
-
-			.navbar-brand {
-				@extend .no-dec;
-				a{
-					color: white;
-					&:hover, &:active, &:focus {
-						color: white;
-						font-weight: normal;
-						text-decoration: none;
-					}
-				}
-			}
-
-			#log-buttons {
-				margin-top: 8px;
-				form { display: inline; }
-				#alerts-ajax {
-					display: none;
-				}
-			}
-
-			form.search {
-				@extend .navbar-form;
-				float: right;
-				input[type="text"], input[type="search"] {
-					background-color: #303030;
-					border: 2px solid #ED9C28;
-					border-radius: 5px;
-					color: #FFF;
-					font-weight: bold;
-					height: 30px;
-					padding: 0px 5px;
-				}
-				input[type="submit"] {
-					@extend .btn-warning;
-				}
-			}
-		}
-
-		#notice {
-			background-color: rgba(0,0,0,0.5);
-			border-radius: 7px;
-			padding: 10px;
-			width: 80%;
-			margin: 0px auto;
-			text-align: center;
-
-			p {
-				color: lightgreen !important;
-				font-weight: bold;
-			}
-		}
-
-		.wrapper {
-			width: 80%;
-			margin: 10px auto 0;
-		}
-
-		footer {
-			clear: both;
-			border-top: solid 1px $orange;
-			text-align: center;
-			margin: 1em auto 0;
-			width: 90%;
-		}
-	}
-}
-
-/* General styles ***************************************************/
-
-h1, h2, h3, h4, h5, p, li, label{
-	color: $orange;
-}
-
-h1, h2, h3, h4, h5 {
-	text-shadow: 0px 0px 2px $darker-orange;
-}
-
-p, ol, ul, td {
-	font-family: verdana, arial, helvetica, sans-serif;
-	font-size: 13px;
-	line-height: 18px;
-}
-
-fieldset {
-	border: solid 1px $orange;
-	border-radius: .5em;
-	padding: 1em;
-	margin: 1em 0;
-	legend {
-		color: $orange;
-		display: block;
-		margin: 0;
-		padding: .25em .5em;
-		width: auto;
-		border: solid 1px $orange;
-		border-radius: .5em;
-	}
-}
-
-form ul {
-	list-style: none;
-}
-
-a, button, input[type="submit"] {
-	@extend .btn;
-	&.user { @extend .btn-info; }
-	&.signup { @extend .btn-success; }
-	&.signin { @extend .btn-warning; }
-	&.signout { @extend .btn-danger; }
-	&.server { @extend .btn-warning; }
-	&.create-alert {
-		color: white;
-		background-color: rgb(255, 69, 0);
-		border-color: rgb(255, 69, 0);
-	}
-	&.alerts {
-		@extend .navbar-right;
-		@extend .glyphicon;
-		@extend .glyphicon-exclamation-sign;
-		color: white;
-		background-color: hsl(0, 69%, 22%) !important;
-	}
-	font-weight: bold !important;
-}
-
-input, textarea{
-	-webkit-box-shadow: inset 0 0 8px  rgba(0,0,0,0.1), 0 0 16px rgba(0,0,0,0.1);
-	   -moz-box-shadow: inset 0 0 8px  rgba(0,0,0,0.1), 0 0 16px rgba(0,0,0,0.1);
-	        box-shadow: inset 0 0 8px  rgba(0,0,0,0.1), 0 0 16px rgba(0,0,0,0.1);
-
-	border: 3px inset #A5A5A5;
-	padding: 8px;
-	color: $orange;
-	background: rgba(0,0,0,0.5);
-	margin: 0 0 5px 0;
-}
-
-select {
-	background-color: #333;
-	padding: 5px;
-	border: none;
-	color: $orange;
-}
-
-pre {
-	text-align: left;
-	background-color: #eee;
-	padding: 10px;
-	font-size: 11px;
-}
-
-a {
-	color: $link-yellow;
-  	&:hover {
-		color: white;
-
-	}
-}
-
-p, li {
-    color: #DD9125;
-}
-
-td, th {
-    color: #DD9125;
-}
-
-svg {
-    min-width: 600px;
-}
-
-div.field, div.actions {
-	margin-bottom: 10px;
-}
-
-#error_explanation {
-	width: 450px;
-	border: 2px solid red;
-	padding: 7px;
-	padding-bottom: 0;
-	margin-bottom: 20px;
-	background-color: #f0f0f0;
-	h2 {
-		text-align: left;
-		font-weight: bold;
-		padding: 5px 5px 5px 15px;
-		font-size: 12px;
-		margin: -7px;
-		margin-bottom: 0px;
-		background-color: #c00;
-		color: #fff;
-	}
-	ul li {
-		font-size: 12px;
-		list-style: square;
-	}
-}
-.field_with_errors {
-	padding: 1px;
-	background-color: #FF4C4C;
-	box-shadow: 0px 0px 5px red;
-	display: table;
-}
-.errors {
-	background-color: rgba(0,0,0,0.5);;
-	color: red;
-	border-radius: 7px;
-	padding: 10px;
-}
-
-/* Specific styles **************************************************/
-
-.tournament-listing {
-	margin: 10px 0px;
-	border-radius: 5px;
-	box-shadow: 0px 0px 3px #B8B8B8;
-	background-color: rgba(0, 0, 0, 0.6);
-	border: 1px solid #AAAAAA;
-	min-height: 100px;
-	padding: 8px 4px;
-
-	div.row {
-		margin-left: 2%;
-	}
-	p.message {
-		margin-top: 10px;
-	}
-
-	/* AKA the listing title */
-	h3 {
-		margin-top: 0px;
-		color: #F0AD4E;
-		font-weight: bold;
-	}
-
-	h3:hover {
-		color: #D09D3E;
-	}
-
-	/* host of the tournament */
-	.host {
-		font-weight: bold;
-		color: #FFF;
-	}
-
-	.col-md-8 {
-		padding: 0;
-		a {
-			padding: 5px 0 0 0;
-		}
-	}
-
-	.t-game{
-		font-weight: bold;
-		text-align: center;
-	}
-
-	.t-image{
-		display: block;
-		margin:auto;
-	}
-}
-
-
-.user-listing {
-	margin: 10px 0px;
-	border-radius: 5px;
-	box-shadow: 0px 0px 3px #B8B8B8;
-	background-color: rgba(0, 0, 0, 0.6);
-	border: 1px solid #AAAAAA;
-	min-height: 100px;
-	padding: 8px 4px;
-	display: inline-table;
-
-	/* AKA the listing title */
-	h3 {
-		margin-top: 0px;
-		color: #F0AD4E;
-		font-weight: bold;
-	}
-
-	h3:hover {
-		color: #D09D3E;
-	}
-
-	.things {
-		padding: 0px 10px;
-	}
-
-	p {
-		margin: 0;
-	}
-	div.row {
-		margin-left: 2%;
-	}
-}
-
-// Limitation: Only one box can be expanded at a time
-.collapsible {
-	.collapsed { display: block; }
-	.expanded { display: none; }
-	&:target {
-		.collapsed { display: none; }
-		.expanded { display: block; }
-	}
-}
-
-.simple_captcha {
-	background-color: rgba(255, 255, 255, 0.7);
-	margin: 10px 0px;
-}
diff --git a/app/assets/stylesheets/colors.css.scss b/app/assets/stylesheets/colors.css.scss
index c875caa..7ab3024 100644
--- a/app/assets/stylesheets/colors.css.scss
+++ b/app/assets/stylesheets/colors.css.scss
@@ -1,5 +1,5 @@
 $darker-orange: #9D4102;
 $link-yellow: #FFC50D;
 $orange: #DD9125;
-$page-color: #444;
-$toolbar-color: black;
+/*$page-color: #444;*/
+/*$toolbar-color: black;*/
diff --git a/app/assets/stylesheets/main.css.scss b/app/assets/stylesheets/main.css.scss
index 15f5ac5..e69de29 100644
--- a/app/assets/stylesheets/main.css.scss
+++ b/app/assets/stylesheets/main.css.scss
@@ -1,13 +0,0 @@
-// Place all the styles related to the main controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
-
-.jumbotron {
-	background-color: #FFF;
-	box-shadow: 1px 1px 20px black;
-	width: 93%;
-
-	p {
-		line-height: 1.5em;
-	}
-}
diff --git a/app/assets/stylesheets/tournaments.css.scss b/app/assets/stylesheets/tournaments.css.scss
index 0b8aa99..92ac3e1 100644
--- a/app/assets/stylesheets/tournaments.css.scss
+++ b/app/assets/stylesheets/tournaments.css.scss
@@ -22,7 +22,7 @@
 	}
 
 }
-
+/*
 ul#tournament-users {
 	list-style: none;
 	padding: 0;
@@ -38,7 +38,7 @@ ul#tournament-users {
 		color: white;
 	}
 }
-
+*/
 div.leave-buttons {
 	margin-top: 50px;
 	form {
diff --git a/app/controllers/servers_controller.rb b/app/controllers/servers_controller.rb
index 83a9f31..6ae879f 100644
--- a/app/controllers/servers_controller.rb
+++ b/app/controllers/servers_controller.rb
@@ -13,7 +13,7 @@ class ServersController < ApplicationController
 	def update
 		respond_to do |format|
 			if @server.update(server_params)
-				format.html { redirect_to @server, notice: 'Server was successfully updated.' }
+				format.html { redirect_to edit_server_url, notice: 'Server was successfully updated.' }
 				format.json { head :no_content }
 			else
 				format.html { render action: 'edit' }
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index af26e29..28ec6f7 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html lang="en">
 <head>
 	<title>Leaguer</title>
 
@@ -16,42 +16,51 @@
 <body>
 <header>
 	<nav>
-	<%# This is the logo %>
-	<div class="navbar-brand"><%= link_to('Leaguer', root_path) %></div>
-
-	<%# This is the search bar  #%>
-	<div>
-		<%= form_tag("/search", method: "get", :class => "search") do %>
-			<%= text_field_tag(:query, params[:query], type: "search") %>
-			<%= submit_tag("Search", :name=>nil) %>
-		<% end %>
-	</div>
-
-	<%# these are the log in buttons #%>
-	<div id="log-buttons">
-		<% if signed_in? %>
-			<%= link_to current_user.user_name, current_user, :class => "user" %>
-			<%= link_to "Messages", pms_path, :class => "signup" %>
-			<% if current_user.can? :edit_server %>
-				<%= link_to "Server settings", edit_server_path, :class => "server" %>
-			<% end %>
-			<% if current_user.can? :create_alert %>
-				<%= link_to "Create Alert", new_alert_path, :class => "create-alert" %>
-			<% end %>
-			<%= link_to "Sign out", session_path("current"), method: "delete", :class => "signout" %>
-			<%# if there is an unread alert then I wanna be able to show the notification icon by saying :style => display:inline. This will be Done by Guntas once he figures out how to get unread alerts. Psuedo if alerts.unread > 0 then display else don't.%>
-			<%= link_to "", alerts_path, :class => "alerts", :id => "alerts-ajax"%>
-		<% else %>
-			<%= link_to "Log in", new_session_path, :class => "signin" %>
-			<%= link_to "Sign up", new_user_path, :class => "signup" %>
-		<% end %>
-	</div>
+		<div class="container-fluid">
+			<div class="navbar-header">
+				<%= link_to('Leaguer', root_path, class: "navbar-brand") %>
+			</div>
+			<div class="navbar-collapse">
+				<div id="user-actions">
+					<div>
+						<% if signed_in? %>
+							<%= link_to current_user.user_name, current_user, :class => "user", :role => :button %>
+							<%= link_to "Sign out", session_path("current"), method: "delete", :class => "signout", :role => :button %>
+						<% else %>
+							<%= link_to "Log in", new_session_path, :class => "signin", :role => :button %>
+							<%= link_to "Sign up", new_user_path, :class => "signup", :role => :button %>
+						<% end %>
+					</div>
+					<% if current_user.can? :create_alert %>
+						<%= link_to "Create Alert", new_alert_path, :class => "create-alert", :role => :button %>
+					<% end %>
+				</div>
+				<% if signed_in? %>
+					<ul>
+						<li><%= link_to "Messages", pms_path %></li>
+						<% if current_user.can? :edit_server %>
+							<li><%= link_to "Server settings", edit_server_path, :class => "server" %></li>
+						<% end %>
+					</ul>
+					<%# If there is an unread alert then I want to be able
+					    to show the notification icon by saying :style =>
+					    display:inline. This will be Done by Guntas once
+					    he figures out how to get unread alerts. Psuedo if
+					    alerts.unread > 0 then display else don't.%>
+					<%= link_to "", alerts_path, :class => "alerts", :id => "alerts-ajax"%>
+				<% end %>
+				<%= form_tag("/search", method: :get, :id => "search") do %><div>
+					<%= text_field_tag(:query, params[:query], type: :search) %>
+					<button type="submit">Search</button>
+				</div><% end %>
+			</div>
+		</div>
 	</nav>
 </header>
 
 <% if notice %><div id="notice"><p><%= notice %></p></div><% end %>
 
-<div class="wrapper">
+<div class="container">
 	<%= yield %>
 </div>
 
diff --git a/app/views/main/homepage.html.erb b/app/views/main/homepage.html.erb
index 3ca8176..5acd4ae 100644
--- a/app/views/main/homepage.html.erb
+++ b/app/views/main/homepage.html.erb
@@ -1,18 +1,13 @@
-<div role="main" class="container theme-showcase">
-
-      <div class="jumbotron">
-        <h1>Welcome to Leaguer</h1>
-        <p>This is a tournment management system designed to be used for any team sport. Our peer review system ensures that the best players move on to the next round! Try creating a new tournament and having people sign up for it. </p>
-        <p id="jumbo-buttons">
-        <% if !signed_in? %>
-        <%= link_to 'Log In', new_session_path, :class => "btn btn-warning btn-lg", :role => "button" %>
-        <%= link_to 'Sign Up', new_user_path, :class => "btn btn-warning btn-lg", :role => "button" %>
-        <% else %>
-        <%= link_to 'Start a Tournament', new_tournament_path, :class => "btn btn-warning btn-lg", :role => "button" %> 
-        <% end %>
-        <%= link_to 'See Ongoing Tournaments', tournaments_path, :class => "btn btn-warning btn-lg", :role => "button" %>
-
-         </p>
-      </div>
-
-    </div>
+<div class="jumbotron">
+	<h1>Welcome to Leaguer</h1>
+	<p>This is a tournment management system designed to be used for any team sport. Our peer review system ensures that the best players move on to the next round! Try creating a new tournament and having people sign up for it. </p>
+	<p id="jumbo-buttons">
+		<% if !signed_in? %>
+			<%= link_to 'Log In', new_session_path, :class => "signin", :role => "button" %>
+			<%= link_to 'Sign Up', new_user_path, :class => "signup", :role => "button" %>
+		<% else %>
+			<%= link_to 'Start a Tournament', new_tournament_path, :role => "button" %>
+		<% end %>
+		<%= link_to 'See Ongoing Tournaments', tournaments_path, :role => "button" %>
+	</p>
+</div>
diff --git a/app/views/servers/_form.html.erb b/app/views/servers/_form.html.erb
index fd887f3..22e3e82 100644
--- a/app/views/servers/_form.html.erb
+++ b/app/views/servers/_form.html.erb
@@ -6,7 +6,7 @@
 			<legend>Default permissions for new users</legend>
 			<ul>
 				<% @server.default_user_abilities.keys.each do |ability| %>
-					<li><label><%= a.check_box(ability) %> <%= ability.to_s.humanize %></label></li>
+					<li><%= a.check_box(ability) %> <%= a.label(ability) %></li>
 				<% end %>
 			</ul>
 		</fieldset>
diff --git a/app/views/tournaments/_form.html.erb b/app/views/tournaments/_form.html.erb
index f53927d..fe2a5c6 100644
--- a/app/views/tournaments/_form.html.erb
+++ b/app/views/tournaments/_form.html.erb
@@ -86,7 +86,7 @@
 			<fieldset>
 				<legend>Stages</legend>
 				<label for="num_stages">Number of Tournament Stages</label>
-				<input type="number" name="num_stages" min="1" value="<%= params[:num_stages].to_i %>">
+				<input type="number" id="num_stages" name="num_stages" min="1" value="<%= params[:num_stages].to_i %>">
 				<%# stage_fields.submit("Set Stages") %>
 				<% for i in 1..(params[:num_stages].to_i) do %>
 					<%= stages_fields.fields_for i.to_s do |stage_fields| %>
diff --git a/app/views/users/_form.html.erb b/app/views/users/_form.html.erb
index 1feebf8..23f8977 100644
--- a/app/views/users/_form.html.erb
+++ b/app/views/users/_form.html.erb
@@ -31,7 +31,7 @@
     <ul>
     <%= fields_for "user[abilities]", @user.abilities do |abilities_fields| %>
       <% @user.abilities.keys.each do |ability| %>
-      <li><label><%= abilities_fields.check_box(ability) %> <%= ability.to_s.humanize %></label></li>
+      <li><%= abilities_fields.check_box(ability) %> <%= abilities_fields.label(ability) %></li>
       <% end %>
     <% end %>
     </ul>