Skip to content

N
nexpie-grafana-theme
Commit ed6d50d6 by Torkel Ödegaard
Options

Updated to profile page design

parent b3a1bb20
Showing with 94 additions and 87 deletions
src/app/features/profile/partials/profile.html
...@@ -5,102 +5,91 @@ ...@@ -5,102 +5,91 @@
show-menu-btn="!grafana.sidemenu"> show-menu-btn="!grafana.sidemenu">
</topnav> </topnav>
<div class="admin-page"> <div class="page-container">
<h2>Personal information</h2> <div class="page">
<div class="gf-box"> <h2>Personal information</h2>
<div class="gf-box-body editor-row">
<div class="section">
<form name="userForm">
<div>
<div class="tight-form">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px">
<strong>Name</strong>
</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" style="margin-top: 10px">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px">
<strong>Email</strong>
</li>
<li>
<input type="text" required ng-model="user.email" class="input-xxlarge tight-form-input last" >
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form" style="margin-top: 10px">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px">
<strong>Username</strong>
</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>
<br> <form name="userForm">
<button type="submit" class="pull-right btn btn-success" ng-click="update()">Update</button> <div>
</form> <div class="tight-form">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 100px">
<strong>Name</strong>
</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" style="margin-top: 5px">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 100px">
<strong>Email</strong>
</li>
<li>
<input type="text" required ng-model="user.email" class="input-xxlarge tight-form-input last" >
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form" style="margin-top: 5px">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 100px">
<strong>Username</strong>
</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> </div>
</div>
</div>
<h2>Your accounts</h2> <br>
<button type="submit" class="pull-right btn btn-success" ng-click="update()">Update</button>
</form>
<div class="gf-box"> <h2>Your accounts</h2>
<div class="gf-box-body">
<table class="grafana-options-table"> <table class="grafana-options-table">
<tr ng-repeat="ac in accounts"> <tr ng-repeat="ac in accounts">
<td style="width: 98%">Name: {{ac.name}}</td> <td style="width: 98%">Name: {{ac.name}}</td>
<td>Role: {{ac.role}}</td> <td>Role: {{ac.role}}</td>
<td> <td>
<span class="btn btn-primary" ng-show="ac.isUsing"> <span class="btn btn-primary" ng-show="ac.isUsing">
Current Current
</span> </span>
<a ng-click="setUsingAccount(ac)" class="btn btn-inverse" ng-show="!ac.isUsing"> <a ng-click="setUsingAccount(ac)" class="btn btn-inverse" ng-show="!ac.isUsing">
Select Select
</a> </a>
</td> </td>
</tr> </tr>
</table> </table>
</div>
</div>
<h2>Add account</h2> <h2 style="margin-top: 30px;">Add account</h2>
<div class="gf-box">
<div class="gf-box-body editor-row"> <form name="form">
<div class="section"> <div>
<form name="form"> <div class="tight-form">
<div> <ul class="tight-form-list">
<div class="tight-form"> <li class="tight-form-item" style="width: 100px;">
<ul class="tight-form-list"> <strong>Account name</strong>
<li class="tight-form-item"> </li>
<strong>Account name</strong> <li>
</li> <input type="text" ng-model="newAccount.name" required class="input-xxlarge tight-form-input last" placeholder="account name">
<li> </li>
<input type="text" ng-model="newAccount.name" required class="input-xxlarge tight-form-input last" placeholder="account name"> <li>
</li> </li>
<li> </ul>
</li> <div class="clearfix"></div>
</ul>
<div class="clearfix"></div>
</div>
</div>
<br>
<button class="btn btn-success pull-right" ng-click="createAccount()">Create</button>
</div> </div>
</div> </div>
<br>
<button class="btn btn-success pull-right" ng-click="createAccount()">Create</button>
</form> </form>
</div> </div>
</div> </div>
src/css/less/gfbox.less
...@@ -59,6 +59,24 @@ ...@@ -59,6 +59,24 @@
} }
} }
.page-container {
margin: 15px;
background: @grafanaPanelBackground;
position: relative;
border: 1px solid @grayDark;
padding: 20px 20px 60px 49px;
h2 {
color: @textColor;
font-weight: normal;
font-size: 22px;
}
}
.page {
max-width: 653px;
}
.admin-page { .admin-page {
max-width: 800px; max-width: 800px;
margin-left: 10px; margin-left: 10px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment