Skip to content
This repository has been archived by the owner on Nov 9, 2017. It is now read-only.

Commit

Permalink
Review HAWKULAR-67 implementation
Browse files Browse the repository at this point in the history
  • Loading branch information
cardosogabriel committed Oct 1, 2015
1 parent 4a2557d commit 2900df8
Show file tree
Hide file tree
Showing 4 changed files with 117 additions and 86 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,15 @@
<button type="button" class="close" dismiss="modal" aria-label="Close" ng-click="cancel()">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">Create organization</h4>
<h4 class="modal-title">Create Organization</h4>
</div>

<div class="modal-body">
<form role="form" class="form-horizontal">
<div class="form-group">
<label for="name" class="col-md-4 control-label">Organization name</label>
<div class="col-md-6">
<input type="text" class="form-control" id="name" placeholder="Name" ng-model="organizationNew.name">
<input type="text" class="form-control" id="name" ng-model="organizationNew.name" autofocus>
</div>
</div>
</form>
Expand Down
78 changes: 40 additions & 38 deletions console/src/main/scripts/plugins/accounts/html/organizations.html
Original file line number Diff line number Diff line change
@@ -1,63 +1,65 @@
<div class="row">
<div class="col-md-12" ng-controller="HawkularAccounts.OrganizationsController">
<div class="hk-organizations" ng-controller="HawkularAccounts.OrganizationsController">

<div class="pull-right" ng-show="organizations.length && !loading">
<button class="btn btn-primary" type="button" role="button" ng-click="showCreateForm()">Create</button>
</div>
<h1>Organizations</h1>
<h1 class="text-center">Organizations</h1>

<div class="progress-description" ng-show="loading">
<div class="spinner spinner-xs spinner-inline"></div>
<strong>Loading:</strong> Organizations
</div>
<div class="text-center hk-spinner-container-alone" ng-show="loading">
<div class="spinner spinner-lg"></div>
<p class="hk-spinner-legend-below">Loading...</p>
</div>

<div class="row text-center" ng-show="!organizations.length && !loading && !isOrganization">
<div class="blank-slate-pf" ng-show="!organizations.length && !loading && !isOrganization">
<div class="blank-slate-pf-icon">
<i class="fa fa-users" id="empty-organizations-icon"></i>
<h2>No organizations created.</h2>
<p>
With organizations, multiple users can have access<br/>
to the same resources, with multiple roles.
</p>
<button class="btn btn-primary" type="button" role="button" ng-click="showCreateForm()">
</div>
<h1>No organizations created.</h1>
<p>
With organizations, multiple users can have access to the same resources, with multiple roles.
</p>
<div class="blank-slate-pf-main-action">
<button class="btn btn-primary btn-lg" type="button" role="button" ng-click="showCreateForm()">
Create Organization
</button>
</div>
</div>

<div class="row text-center" ng-show="isOrganization">
<div class="blank-slate-pf" ng-show="isOrganization">
<div class="blank-slate-pf-icon">
<i class="fa fa-users" id="empty-organizations-icon-for-organizations"></i>
<h2>You cannot create an organization.</h2>
<p>
You are currently logged in as an organization. At this moment, sub-organizations are not supported.<br/>
To create an organization, select your main account on the account switcher, at the top-right corner of this
screen.
</p>
</div>
<h2>You cannot create an organization.</h2>
<p>
You are currently logged in as an organization. At this moment, sub-organizations are not supported. To create an organization, switch to your user account.
</p>
</div>

<div ng-show="organizations.length && !loading">
<table class="table table-striped table-bordered">
<thead>
<div class="text-right" ng-show="organizations.length && !loading">
<button class="btn btn-primary" type="button" role="button" ng-click="showCreateForm()">Create Organization</button>
</div>
<div ng-show="organizations.length && !loading">
<table class="table table-striped table-bordered hk-table-clean">
<thead>
<tr>
<th>Name</th>
<th>&nbsp;</th>
<th></th>
</tr>
</thead>
<tbody>
</thead>
<tbody>
<tr ng-repeat="organization in organizations">
<td>
<a href="/hawkular-ui/organization/{{organization.id}}/memberships">
{{organization.name}}
</a>
</td>
<td>
<button type="button" class="btn btn-default" aria-label="Remove" ng-click="remove(organization)">
<span class="pficon pficon-delete" aria-hidden="true"></span>
<td class="hk-actions-one">
<button type="button" class="btn btn-link" aria-label="Delete" ng-click="remove(organization)" data-toggle="tooltip" data-placement="top" data-original-title="Remove">
<i class="fa fa-trash-o"></i>
</button>
</td>
</tr>
</tbody>
</table>
</div>
</tbody>
</table>
</div>
<!-- /col -->

</div>
<!-- /col -->

</div>
118 changes: 73 additions & 45 deletions console/src/main/scripts/plugins/metrics/less/metrics.less
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,8 @@
@import "../../../libs/patternfly/less/variables.less";


// Variables Override
// Variables

@body-bg: #f5f5f5;
@danger-bg: rgba(204,0,0,0.07);


Expand All @@ -30,6 +29,7 @@
\*------------------------------------*/

body {
background-color: #f5f5f5;
line-height: 1.4;
padding-bottom: @grid-gutter-width/2;
}
Expand Down Expand Up @@ -93,16 +93,32 @@ h3 {
line-height: 1.66666667;
}

.dl-horizontal dt {
margin-bottom: 5px;
.dl-horizontal {
dt {
@media (min-width: @screen-sm-min) {
text-align: left;
}
}

dd {
margin-bottom: 5px;

.btn {
margin-top: 15px;

&:first-child {
margin-right: 10px;
}
}
}
}

.info-top {
font-size: ceil(@font-size-base + 1);
}

a:hover {
cursor: pointer;
.hk-spinner-container-alone {
margin-top: @grid-gutter-width*5.5
}


Expand Down Expand Up @@ -235,7 +251,7 @@ a:hover {

.hk-graph-container {
margin: 0 auto;
//width: 750px;
width: 750px;

&.hk-graph-availability svg { /* top 40px, bottom 30px, align center */
margin-bottom: -18px;
Expand All @@ -244,7 +260,7 @@ a:hover {
}

&.hk-graph-metrics {
//height: 262px;
height: 262px;

svg {
margin-bottom: -13px;
Expand All @@ -254,7 +270,7 @@ a:hover {
}

&.hk-graph-jvm {
//height: 262px;
height: 262px;

svg {
margin-bottom: -13px;
Expand All @@ -273,28 +289,26 @@ a:hover {
font-size: ceil(@font-size-base - 1);
margin-bottom: 10px;
margin-left: 38px;
margin-top: 30px;
margin-top: 15px;

&.hk-legend-availability {
//margin-left: 248px;
margin-left: 12%;
margin-left: 248px;

//@media (max-width: @screen-md-max) {
// margin-left: 148px;
//}
@media (max-width: @screen-md-max) {
margin-left: 148px;
}
}
// TODO: be reviewed by Gabriel

&.hk-legend-metrics {
//margin-left: 270px;
margin-left: 12%;
margin-left: 270px;

//@media (max-width: @screen-md-max) {
// margin-left: 170px;
//}
@media (max-width: @screen-md-max) {
margin-left: 170px;
}
}

&.hk-legend-inline {
margin-top: 24px;
margin-top: 8px;

> div {
padding-left: 0;
Expand Down Expand Up @@ -1048,6 +1062,10 @@ a:hover .fa-spinner {
}
}
}

h2 {
margin-top: 12px;
}
}

.hk-info-top + .hk-panel-table-list {
Expand Down Expand Up @@ -1096,12 +1114,8 @@ a:hover .fa-spinner {
text-decoration: underline;
}

.table > tbody > tr.hk-alert-open {
background-color: rgba(204, 0, 0, 0.07);

&:nth-child(odd) > td {
background-color: transparent;
}
.table > tbody > tr.hk-alert-open td:nth-child(2) {
font-weight: bold;
}

.table-striped > tbody {
Expand Down Expand Up @@ -1129,8 +1143,6 @@ a:hover .fa-spinner {
}
}

/* In case of the whole line selectable
.hk-table-select > tbody > tr:hover > td {
background-color: #d4edfa;
cursor: pointer;
Expand All @@ -1141,7 +1153,6 @@ a:hover .fa-spinner {
background-color: #d4edfa;
}
}
*/

.hk-table-select > tbody > tr.hk-selected > td {
background-color: @brand-primary;
Expand Down Expand Up @@ -1212,30 +1223,37 @@ a:hover .fa-spinner {
padding: 7px 5px 9px 5px;
}

.actions-table {
.actions-table,
.hk-actions-table {
position: absolute;
top: 46px;
z-index: 10;
right: 5px;

.btn:first-child {
margin-right: 8px;
}
}

.actions-table {
top: 46px;

.add,
.dropdown {
display:inline-block;
}

.add {
margin-right: 8px;
}
}

.hk-table-container {
background-color: white;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
position: relative;

.hk-actions-table {
position: absolute;
top: 6px;
z-index: 10;
right: 5px;
}

.dataTables_wrapper {
margin: 0;
}
}

Expand All @@ -1245,10 +1263,8 @@ a:hover .fa-spinner {
}
}

.hk-table-alerts {

background-color: white;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
.hk-table-alerts,
.hk-table-clean {

&.hk-alerts-contextual {
border-left: none;
Expand Down Expand Up @@ -1641,6 +1657,7 @@ td.hk-actions-two {
}
}


// Application servers screen

.hk-application-servers {
Expand Down Expand Up @@ -1715,6 +1732,10 @@ section {
}
}

.hk-alert-center .hk-info-top h3 {
margin-bottom: 0;
}


// Datasources tab

Expand Down Expand Up @@ -1755,7 +1776,7 @@ section {

.hk-collapsible-area {
display: block!important;
max-height: 1120px;
max-height: 950px;
overflow: hidden;
-webkit-transition: max-height 0.3s ease;
-moz-transition: max-height 0.3s ease;
Expand Down Expand Up @@ -1801,3 +1822,10 @@ section {
padding-left: 15px;
}
}


// Organizations screen

.hk-organizations .text-right .btn-primary {
margin-bottom: @grid-gutter-width/4;
}
3 changes: 2 additions & 1 deletion console/src/main/webapp/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -68,8 +68,9 @@
</li>
<li class="divider" ng-show="personas.length"></li>
<li>
<a id="organizationsOption" href="/hawkular-ui/organizations">Organizations</a>
<a id="organizationsOption" href="/hawkular-ui/organizations">Manage Organizations</a>
</li>
<li class="divider"></li>
<li>
<a id="logout" href="#" ng-click="userDetails.logout()">Log Out</a>
</li>
Expand Down

0 comments on commit 2900df8

Please sign in to comment.