feat: caps lock warning styling

less/register.less

@@ -13,11 +13,11 @@
 
 .register-block {
 	margin-top: 15px;
-	
+
 	.help-block {
 		font-size: 13px;
 	}
-	
+
 	.register-success {
 		.form-control {
 			border-color: #5cb85c;
@@ -28,14 +28,14 @@
 		    -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;
@@ -46,7 +46,7 @@
 		    -webkit-background-size: 1.25rem 1.25rem;
 		    background-size: 1.25rem 1.25rem;
 		}
-		
+
 		.register-feedback {
 			color: #d9534f;
 			display: block;
@@ -57,12 +57,18 @@
 
 .login-block {
 	margin-top: 15px;
-	
+
 	#login {
 		margin-bottom: 10px;
 	}
 }
 
+.register-block, .login-block {
+	#caps-lock-warning {
+		margin-top: 10px;
+	}
+}
+
 @media (max-width: @screen-xs-max) {
 	.alt-login-block {
 		margin-bottom: 20px;

templates/login.tpl

@@ -21,6 +21,9 @@
 					<label for="password" class="col-lg-2 control-label">[[user:password]]</label>
 					<div class="col-lg-10">
 						<input class="form-control" type="password" placeholder="[[user:password]]" name="password" id="password" <!-- IF username -->autocomplete="off"<!-- ENDIF username -->/>
+						<p id="caps-lock-warning" class="text-danger hidden">
+							<i class="fa fa-exclamation-triangle"></i> [[login:caps-lock-enabled]]
+						</p>
 					</div>
 				</div>
 				<div class="form-group">

templates/register.tpl

@@ -30,6 +30,9 @@
 						<input class="form-control" type="password" placeholder="[[register:password_placeholder]]" name="password" id="password" />
 						<span class="register-feedback" id="password-notify"></span>
 						<span class="help-block">[[register:help.minimum_password_length, {minimumPasswordLength}]]</span>
+						<p id="caps-lock-warning" class="text-danger hidden">
+							<i class="fa fa-exclamation-triangle"></i> [[login:caps-lock-enabled]]
+						</p>
 					</div>
 				</div>
 				<div class="form-group">