Index: lams_central/web/profile.jsp
===================================================================
diff -u -r94a4ee377b6f565f4b5228bdfe4fcc4c1c4e5030 -r171f124aefe163dee7e1d196a006ce11039631a6
--- lams_central/web/profile.jsp	(.../profile.jsp)	(revision 94a4ee377b6f565f4b5228bdfe4fcc4c1c4e5030)
+++ lams_central/web/profile.jsp	(.../profile.jsp)	(revision 171f124aefe163dee7e1d196a006ce11039631a6)
@@ -5,73 +5,105 @@
 <%@ taglib uri="tags-fmt" prefix="fmt"%>
 <%@ taglib uri="tags-logic" prefix="logic"%>
 <%@ taglib uri="tags-core" prefix="c"%>
-<%@ page import="org.lamsfoundation.lams.usermanagement.AuthenticationMethod" 
-		 import="org.lamsfoundation.lams.util.Configuration" 
-		 import="org.lamsfoundation.lams.util.ConfigurationKeys" %>
-		 
+<%@ page
+	import="org.lamsfoundation.lams.usermanagement.AuthenticationMethod"
+	import="org.lamsfoundation.lams.util.Configuration"
+	import="org.lamsfoundation.lams.util.ConfigurationKeys"%>
+<link rel="stylesheet" href="css/defaultHTML_learner.css"
+	type="text/css" />
+
+<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" />
+
+
 <c:set var="showAllMyLessonLink"><%=Configuration.get(ConfigurationKeys.SHOW_ALL_MY_LESSON_LINK)%></c:set>
-	
-<div style="clear:both;"></div>
 
-<h2 class="small-space-top"><fmt:message key="index.myprofile" /></h2>
 
-<div class="shading-bg">
-<table>
-	<tr>
-		<td class="align-right"><span class="field-name"><fmt:message
-			key="label.name" />:</span></td>
-		<td><bean:write name="fullName" /></td>
+<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="index.myprofile" />
+					</div>
+				</div>
+				<div class="panel-body">
+					<div class="text-center">
 
-		<td rowspan="3" class="userpage-td" valign="top">
-		<ul>
-			<li class="no-list-type"><a
-				href="index.do?state=active&tab=editprofile"><fmt:message
-				key="title.profile.edit.screen" /> </a></li>
+						<c:choose>
+							<c:when test="${empty portraitUuid}">
+								<div class="text-center">
+									<span class="fa-stack fa-4x text-muted"
+										title="<fmt:message key="msg.portrait.none" />"> <i
+										class="fa fa-circle fa-stack-2x"></i> <i
+										class="fa fa-user fa-stack-1x fa-inverse"></i>
+									</span>
+								</div>
 
-			<c:set var="authenticationMethodId"><lams:user property="authenticationMethodId"/></c:set>
-			<c:set var="dbId"><%= AuthenticationMethod.DB %></c:set>
-			<c:if test="${authenticationMethodId eq dbId}">
-			<li class="no-list-type"><a
-				href="index.do?state=active&tab=password"><fmt:message
-				key="title.password.change.screen" /></a></li>
-			</c:if>
+							</c:when>
+							<c:otherwise>
+								<img style="margin: 0 auto;" class="img-circle img-responsive"
+									title="<bean:write name="fullName" />"
+									src="/lams/download/?uuid=<bean:write name="portraitUuid" />&preferDownload=false" />
+							</c:otherwise>
+						</c:choose>
 
-			<li class="no-list-type"><a
-				href="index.do?state=active&tab=portrait"><fmt:message
-				key="title.portrait.change.screen" /></a></li>
-				
-			<c:if test="${showAllMyLessonLink}">				
-				<li class="no-list-type"><a
-					href="index.do?state=active&tab=lessons"><fmt:message
-					key="title.all.my.lessons" /></a></li>
-			</c:if>				
-		</ul>
+						<p class="text-center">
+							<bean:write name="fullName" />
+							<br /> <i class="fa fa-envelope small"></i>
+							<bean:write name="email" />
+						</p>
+					</div>
+					<hr>
+					<!-- Split button -->
+					<div class="col-xs-12 text-center">
+						<a class="btn btn-sm btn-default offset5"
+							href="index.do?state=active&tab=editprofile" role="button"><i
+							class="fa fa-fw fa-pencil"></i> <span class="hidden-xs"><fmt:message
+									key="title.profile.edit.screen" /></span></i></a>&nbsp;&nbsp;
+						<c:set var="authenticationMethodId">
+							<lams:user property="authenticationMethodId" />
+						</c:set>
+						<c:set var="dbId"><%=AuthenticationMethod.DB%></c:set>
+						<c:if test="${authenticationMethodId eq dbId}">
 
-		</td>
-	</tr>
-	<tr>
-		<td class="align-right"><span class="field-name"><fmt:message
-			key="label.email" />:</span></td>
-		<td><bean:write name="email" /></td>
-	</tr>
-	<tr>
-		<td class="align-right" valign="top"><span class="field-name"><fmt:message
-			key="label.portrait.current" />:</span></td>
-		<td valign="top">
-			<c:choose>
-				<c:when test="${empty portraitUuid}">
-					<em><fmt:message key="msg.portrait.none" /></em>
-					<div class="small-space-top">
-						<img src="<lams:LAMSURL />images/default_user.gif" alt="User Portrait"
-						class="img-border">
+							<a class="btn btn-sm btn-default voffset5"
+								href="index.do?state=active&tab=password" role="button"><i
+								class="fa fa-fw fa-lock"></i> <span class="hidden-xs"><fmt:message
+										key="title.password.change.screen" /></span></i></a>
+						</c:if>
+						<a class="btn btn-sm btn-default offset5"
+							href="index.do?state=active&tab=portrait" role="button"><i
+							class="fa fa-fw fa-camera"></i> <span class="hidden-xs"><fmt:message
+									key="title.portrait.change.screen" /></span></i></a>&nbsp;&nbsp;
+
+						<c:if test="${showAllMyLessonLink}">
+							<a class="btn btn-sm btn-default offset5"
+								href="index.do?state=active&tab=lessons" role="button"><i
+								class="fa fa-fw fa-book"></i> <span class="hidden-xs"><fmt:message
+										key="title.all.my.lessons" /></span></i></a>
+						</c:if>
 					</div>
-				</c:when>
-				<c:otherwise>
-					<img class="img-border"	src="/lams/download/?uuid=<bean:write name="portraitUuid" />&preferDownload=false" />
-				</c:otherwise>
-			</c:choose>
-		</td>
-	<tr>
-</table>
+				</div>
+			</div>
+		</div>
+	</div>
 
-</div>
\ No newline at end of file
+</div>
+</div>
+
+</div>
+</div>
+</div>
+
+</div>
+</div>
+</div>
+
+
+
+
+
+
+