ux(more style updates)

public/app/features/profile/partials/password.html

@@ -8,14 +8,14 @@
 <div class="page-container">
 	<div class="page">
 
-		<h2>Change password</h2>
+		<h1>Change password</h1>
 
 		<form name="userForm">
 			<div>
 				<div class="tight-form">
 					<ul class="tight-form-list">
 						<li class="tight-form-item" style="width: 100px">
-							<strong>Old Password</strong>
+							Old Password
 						</li>
 						<li>
 							<input type="password" required ng-model="command.oldPassword" class="input-xxlarge tight-form-input last" >
@@ -23,10 +23,10 @@
 					</ul>
 					<div class="clearfix"></div>
 				</div>
-				<div class="tight-form" style="margin-top: 5px">
+				<div class="tight-form">
 					<ul class="tight-form-list">
 						<li class="tight-form-item" style="width: 100px">
-							<strong>New Password</strong>
+							New Password
 						</li>
 						<li>
 							<input type="password" required ng-model="command.newPassword" ng-minlength="4" class="input-xxlarge tight-form-input last" >
@@ -34,10 +34,10 @@
 					</ul>
 					<div class="clearfix"></div>
 				</div>
-				<div class="tight-form" style="margin-top: 5px">
+				<div class="tight-form">
 					<ul class="tight-form-list">
 						<li class="tight-form-item" style="width: 100px">
-							<strong>Confirm New</strong>
+							Confirm New
 						</li>
 						<li>
 							<input type="password" required ng-model="command.confirmNew" ng-minlength="4" class="input-xxlarge tight-form-input last" >

public/app/features/profile/partials/profile.html

@@ -1,91 +1,98 @@
-<topnav title="{{contextSrv.user.name}}" section="Profile" icon="fa fa-fw fa-user" subnav="true">
-	<ul class="nav">
-		<li class="active"><a href="profile">Overview</a></li>
-		<li><a href="profile/password">Change password</a></li>
-	</ul>
+<topnav title="Account" title-url="profile" icon="fa fa-fw fa-user">
 </topnav>
 
 <div class="page-container" style="background: transparent; border: 0;">
 	<div class="page-wide">
 
-		<h2>Profile</h2>
+		<h1>Account & Preferences</h1>
 
-		<form name="userForm">
-			<div class="tight-form">
-				<ul class="tight-form-list">
-					<li class="tight-form-item" style="width: 100px">
-						Name
-					</li>
-					<li>
-						<input type="text" required ng-model="user.name" class="input-xxlarge tight-form-input last" >
-					</li>
-				</ul>
-				<div class="clearfix"></div>
-			</div>
-			<div class="tight-form">
-				<ul class="tight-form-list">
-					<li class="tight-form-item" style="width: 100px">
-						Email
-					</li>
-					<li>
-						<input type="email" required ng-model="user.email" class="input-xxlarge tight-form-input last" >
-					</li>
-				</ul>
-				<div class="clearfix"></div>
-			</div>
-			<div class="tight-form">
-				<ul class="tight-form-list">
-					<li class="tight-form-item" style="width: 100px">
-						Username
-					</li>
-					<li>
-						<input type="text" required ng-model="user.login" class="input-xxlarge tight-form-input last" >
-					</li>
-				</ul>
-				<div class="clearfix"></div>
-			</div>
+		<section class="simple-box">
+			<h3 class="simple-box-header">Preferences</h3>
+		</section>
+			<form name="userForm">
+				<div class="tight-form">
+					<ul class="tight-form-list">
+						<li class="tight-form-item" style="width: 100px">
+							Name
+						</li>
+						<li>
+							<input type="text" required ng-model="user.name" class="input-xxlarge tight-form-input last" >
+						</li>
+					</ul>
+					<div class="clearfix"></div>
+				</div>
+				<div class="tight-form">
+					<ul class="tight-form-list">
+						<li class="tight-form-item" style="width: 100px">
+							Email
+						</li>
+						<li>
+							<input type="email" required ng-model="user.email" class="input-xxlarge tight-form-input last" >
+						</li>
+					</ul>
+					<div class="clearfix"></div>
+				</div>
+				<div class="tight-form">
+					<ul class="tight-form-list">
+						<li class="tight-form-item" style="width: 100px">
+							Username
+						</li>
+						<li>
+							<input type="text" required ng-model="user.login" class="input-xxlarge tight-form-input last" >
+						</li>
+					</ul>
+					<div class="clearfix"></div>
+				</div>
 
-			<div class="tight-form last">
-				<ul class="tight-form-list">
-					<li class="tight-form-item" style="width: 100px">
-						UI Theme
-					</li>
-					<li>
-						<select class="input-small tight-form-input" ng-model="user.theme" ng-options="f for f in ['dark', 'light']"></select>
-					</li>
-				</ul>
+				<div class="tight-form last">
+					<ul class="tight-form-list">
+						<li class="tight-form-item" style="width: 100px">
+							UI Theme
+						</li>
+						<li>
+							<select class="input-small tight-form-input" ng-model="user.theme" ng-options="f for f in ['dark', 'light']"></select>
+						</li>
+					</ul>
+					<div class="clearfix"></div>
+				</div>
+				<br>
+				<button type="submit" class="pull-right btn btn-success" ng-click="update()">Update</button>
 				<div class="clearfix"></div>
-			</div>
-			<br>
-			<button type="submit" class="pull-right btn btn-success" ng-click="update()">Update</button>
-		</form>
+			</form>
 
-		<h3>Organizations</h3>
-
-		<table class="filter-table form-inline">
-			<thead>
-				<tr>
-					<th>Name</th>
-					<th>Role</th>
-					<th></th>
-				</tr>
-			</thead>
-			<tbody>
-				<tr ng-repeat="org in orgs">
-					<td>{{org.name}}</td>
-					<td>{{org.role}}</td>
-					<td class="text-right">
-						<span class="btn btn-primary btn-mini" ng-show="org.orgId === contextSrv.user.orgId">
-							Current
-						</span>
-						<a ng-click="setUsingOrg(org)" class="btn btn-inverse btn-mini" ng-show="org.orgId !== contextSrv.user.orgId">
-							Select
-						</a>
-					</td>
-				</tr>
-			</tbody>
-		</table>
+			<section class="simple-box">
+				<a class="btn btn-inverse btn-small pull-right" href="profile/password" style="margin: 7px 10px 0 0">Change Password</a>
+				<h3 class="simple-box-header">
+					Password
+				</h3>
+			</section>
 
+			<section class="simple-box">
+				<h3 class="simple-box-header">Organizations</h3>
+				<table class="filter-table form-inline">
+					<thead>
+						<tr>
+							<th>Name</th>
+							<th>Role</th>
+							<th></th>
+						</tr>
+					</thead>
+					<tbody>
+						<tr ng-repeat="org in orgs">
+							<td>{{org.name}}</td>
+							<td>{{org.role}}</td>
+							<td class="text-right">
+								<span class="btn btn-primary btn-mini" ng-show="org.orgId === contextSrv.user.orgId">
+									Current
+								</span>
+								<a ng-click="setUsingOrg(org)" class="btn btn-inverse btn-mini" ng-show="org.orgId !== contextSrv.user.orgId">
+									Select
+								</a>
+							</td>
+						</tr>
+					</tbody>
+				</table>
+			</div>
+		</section>
 	</div>
-</div>