Index: lams_central/web/passwordChangeContent.jsp
===================================================================
diff -u -r3c6472ccf0dd4f38e288496a8eeee7442ea19502 -r171f124aefe163dee7e1d196a006ce11039631a6
--- lams_central/web/passwordChangeContent.jsp	(.../passwordChangeContent.jsp)	(revision 3c6472ccf0dd4f38e288496a8eeee7442ea19502)
+++ lams_central/web/passwordChangeContent.jsp	(.../passwordChangeContent.jsp)	(revision 171f124aefe163dee7e1d196a006ce11039631a6)
@@ -1,75 +1,94 @@
-<%@page import="org.lamsfoundation.lams.web.PasswordChangeActionForm" %>
-<%@page import="org.apache.struts.action.ActionMessages" %>
-<%@ taglib uri="tags-html" prefix="html" %>
-<%@ taglib uri="tags-logic" prefix="logic" %>
-<%@ taglib uri="tags-bean" prefix="bean" %>
-<%@ taglib uri="tags-fmt" prefix="fmt" %>
+<%@page import="org.lamsfoundation.lams.web.PasswordChangeActionForm"%>
+<%@page import="org.apache.struts.action.ActionMessages"%>
+<%@ taglib uri="tags-html" prefix="html"%>
+<%@ taglib uri="tags-logic" prefix="logic"%>
+<%@ taglib uri="tags-bean" prefix="bean"%>
+<%@ taglib uri="tags-fmt" prefix="fmt"%>
+<script type="text/javascript"
+	src="<lams:LAMSURL/>includes/javascript/jquery.js"></script>
+<script type="text/javascript"
+	src="<lams:LAMSURL/>includes/javascript/jquery.validate.js"></script>
+<link rel="stylesheet" href="css/defaultHTML_learner.css"
+	type="text/css" />
+<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" />
+<script type="text/javascript">
+	function checkPasswordField(field) {
+		if (/^\s*$/.test(field.value)) {
+			alert("Password cannot be empty");
+		}
+	};
+</script>
 
+
 <html:form action="/passwordChanged" method="post">
 
 
-<div style="clear:both"></div>
+	<div style="clear: both"></div>
 
+	<div class="container">
+		<div class="row vertical-center-row">
+			<div
+				class="col-xs-12 col-sm-8 col-sm-offset-2 col-md-6 col-md-offset-3">
+				<div class="panel panel-default">
+					<div class="panel-heading">
+						<div class="panel-title">
+							<fmt:message key="title.password.change.screen" />
+						</div>
+					</div>
+					<logic:messagesPresent message="true">
+						<p class="warning">
+							<html:messages message="true" id="errMsg">
+								<bean:write name="errMsg" />
+								<br>
+							</html:messages>
+						</p>
+					</logic:messagesPresent>
+					<div class="panel-body">
+						<form class="form-horizontal">
+							<html:hidden name="<%=PasswordChangeActionForm.formName%>"
+								property="login" />
+							<div class="form-group">
+								<b><label><fmt:message
+											key="label.password.old.password" />:</label></b>
+								<html:password name="<%=PasswordChangeActionForm.formName%>"
+									property="oldPassword" size="50" maxlength="50"
+									onblur="checkPasswordField(this)" styleClass="form-control" />
+							</div>
 
-<h2 class="small-space-top"><fmt:message key="title.password.change.screen"/></h2>
+							<div class="form-group">
+								<b><label><fmt:message
+											key="label.password.new.password" />:</label></b>
+								<html:password name="<%=PasswordChangeActionForm.formName%>"
+									property="password" size="50" maxlength="50"
+									onblur="checkPasswordField(this)" styleClass="form-control" />
+							</div>
+							<div class="form-group">
+								<b><label><fmt:message
+											key="label.password.confirm.new.password" />:</label></b>
+								<html:password name="<%=PasswordChangeActionForm.formName%>"
+									property="passwordConfirm" size="50" maxlength="50"
+									onblur="checkPasswordField(this)" styleClass="form-control" />
+							</div>
 
-	
-			
-<div class="shading-bg">
+							<div class="form-group" align="right">
+								<html:cancel styleClass="btn btn-sm btn-default voffset5">
+									<fmt:message key="button.cancel" />
+								</html:cancel>
+								&nbsp;&nbsp;
+								<html:submit styleClass="btn btn-sm btn-default voffset5">
+									<fmt:message key="button.save" />
+								</html:submit>
 
+							</div>
 
-			<logic:messagesPresent message="true"> 
-				<p class="warning">
-				<html:messages message="true" id="errMsg" >
-					<bean:write name="errMsg"/><br>
-				</html:messages>
-				</p>
-			</logic:messagesPresent>
-			
-		
-			<table class="body">
-				<tr>
-					<td class="align-right" width="50%">
-						<fmt:message key="label.username"/>:
-					</td>
-					<td class="align-left" width="50%">
-						<html:hidden name="<%=PasswordChangeActionForm.formName%>" property="login"/>
-						<bean:write name="<%=PasswordChangeActionForm.formName%>" property="login"/>
-					</td>
-				</tr>
-				<tr>
-					<td class="align-right">
-						<fmt:message key="label.password.old.password"/>:
-					</td>
-					<td class="align-left">
-						<html:password name="<%=PasswordChangeActionForm.formName%>" property="oldPassword" size="50" maxlength="50"/>
-					</td>
-				</tr>
-				<tr>
-					<td class="align-right">
-						<fmt:message key="label.password.new.password"/>:
-					</td>
-					<td class="align-left">
-						<html:password name="<%=PasswordChangeActionForm.formName%>" property="password" size="50" maxlength="50"/>
-					</td>
-				</tr>
-				<tr>
-					<td class="align-right">
-						<fmt:message key="label.password.confirm.new.password"/>:
-					</td>
-					<td class="align-left">
-						<html:password name="<%=PasswordChangeActionForm.formName%>" property="passwordConfirm" size="50" maxlength="50"/>
-					</td>
-				</tr>
-				<tr>
-					<td>&nbsp;</td>
-				
-					<td class="align-center">
-						<html:cancel  styleClass="button"><fmt:message key="button.cancel"/></html:cancel>
-						<html:submit styleClass="button"><fmt:message key="button.save"/></html:submit> 
-					</td>
-				</tr>
-			</table>
+						</form>
+					</div>
 
+				</div>
+			</div>
+		</div>
+	</div>
 </html:form>
-			
\ No newline at end of file
+
+
+