minor design tweaks to register page

less/register.less

@@ -10,3 +10,47 @@
 		line-height: 2rem;
 	}
 }
+
+.register-block {
+	margin-top: 15px;
+	
+	.help-block {
+		font-size: 13px;
+	}
+	
+	.register-success {
+		.form-control {
+			border-color: #5cb85c;
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E");
+			padding-right: 2.25rem;
+		    background-repeat: no-repeat;
+		    background-position: center right .625rem;
+		    -webkit-background-size: 1.25rem 1.25rem;
+		    background-size: 1.25rem 1.25rem;
+		}
+		
+		.register-feedback {
+			color: #5cb85c;
+			display: block;
+			margin-top: .25rem;
+		}
+	}
+	
+	.register-danger {
+		.form-control {
+			border-color: #d9534f;
+			background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='-2 -2 7 7'%3E%3Cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3E%3Ccircle r='.5'/%3E%3Ccircle cx='3' r='.5'/%3E%3Ccircle cy='3' r='.5'/%3E%3Ccircle cx='3' cy='3' r='.5'/%3E%3C/svg%3E");
+			padding-right: 2.25rem;
+		    background-repeat: no-repeat;
+		    background-position: center right .625rem;
+		    -webkit-background-size: 1.25rem 1.25rem;
+		    background-size: 1.25rem 1.25rem;
+		}
+		
+		.register-feedback {
+			color: #d9534f;
+			display: block;
+			margin-top: .25rem;
+		}
+	}
+}

templates/register.tpl

@@ -2,7 +2,7 @@
 
 <div class="row register">
 	<div class="{register_window:spansize}">
-		<div class="well well-lg">
+		<div class="register-block">
 			<div class="alert alert-danger<!-- IF !error --> hidden<!-- ENDIF !error -->" id="register-error-notify" >
 				<strong>[[error:registration-error]]</strong>
 				<p>{error}</p>
@@ -11,48 +11,32 @@
 				<div class="form-group">
 					<label for="email" class="col-lg-4 control-label">[[register:email_address]]</label>
 					<div class="col-lg-8">
-						<div class="input-group">
+						<input class="form-control" type="email" placeholder="[[register:email_address_placeholder]]" name="email" id="email" autocorrect="off" autocapitalize="off" />
-							<input class="form-control" type="email" placeholder="[[register:email_address_placeholder]]" name="email" id="email" autocorrect="off" autocapitalize="off" />
+						<span class="register-feedback" id="email-notify"></span>
-							<span class="input-group-addon">
-								<span id="email-notify"><i class="fa fa-circle-o"></i></span>
-							</span>
-						</div>
 						<span class="help-block">[[register:help.email]]</span>
 					</div>
 				</div>
 				<div class="form-group">
 					<label for="username" class="col-lg-4 control-label">[[register:username]]</label>
 					<div class="col-lg-8">
-						<div class="input-group">
+						<input class="form-control" type="text" placeholder="[[register:username_placeholder]]" name="username" id="username" autocorrect="off" autocapitalize="off" autocomplete="off" />
-							<input class="form-control" type="text" placeholder="[[register:username_placeholder]]" name="username" id="username" autocorrect="off" autocapitalize="off" autocomplete="off" />
+						<span class="register-feedback" id="username-notify"></span>
-							<span class="input-group-addon">
-								<span id="username-notify"><i class="fa fa-circle-o"></i></span>
-							</span>
-						</div>
 						<span class="help-block">[[register:help.username_restrictions, {minimumUsernameLength}, {maximumUsernameLength}]]</span>
 					</div>
 				</div>
 				<div class="form-group">
 					<label for="password" class="col-lg-4 control-label">[[register:password]]</label>
 					<div class="col-lg-8">
-						<div class="input-group">
+						<input class="form-control" type="password" placeholder="[[register:password_placeholder]]" name="password" id="password" />
-							<input class="form-control" type="password" placeholder="[[register:password_placeholder]]" name="password" id="password" />
+						<span class="register-feedback" id="password-notify"></span>
-							<span class="input-group-addon">
-								<span id="password-notify"><i class="fa fa-circle-o"></i></span>
-							</span>
-						</div>
 						<span class="help-block">[[register:help.minimum_password_length, {minimumPasswordLength}]]</span>
 					</div>
 				</div>
 				<div class="form-group">
 					<label for="password-confirm" class="col-lg-4 control-label">[[register:confirm_password]]</label>
 					<div class="col-lg-8">
-						<div class="input-group">
+						<input class="form-control" type="password" placeholder="[[register:confirm_password_placeholder]]" name="password-confirm" id="password-confirm" />
-							<input class="form-control" type="password" placeholder="[[register:confirm_password_placeholder]]" name="password-confirm" id="password-confirm" />
+						<span class="register-feedback" id="password-confirm-notify"></span>
-							<span class="input-group-addon">
-								<span id="password-confirm-notify"><i class="fa fa-circle-o"></i></span>
-							</span>
-						</div>
 					</div>
 				</div>
 
@@ -78,7 +62,7 @@
 
 	<!-- IF alternate_logins -->
 	<div class="col-md-6">
-		<div class="well well-lg">
+		<div class="alt-register-block">
 			<h4>[[register:alternative_registration]]</h4>
 			<ul class="alt-logins">
 				<!-- BEGIN authentication -->