Add css for host status page
Change-Id: I65e18724b9cd4d988a47f5b9c048ea183d961b29
This commit is contained in:
Thibault Cohen
parent
6e385ecdd6
commit
fddd4693e3
@ -30,3 +30,76 @@
|
||||
width: 85px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
// host/service status page
|
||||
|
||||
.data-table thead th:first-child + th {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.subcomponent__live {
|
||||
background-color: #252C35;
|
||||
//background-color: #353D48;
|
||||
|
||||
padding: 0px 15px;
|
||||
float: left;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.subcomponent__live .data-table thead th:first-child {
|
||||
border-width: 0 0 0 0px;
|
||||
}
|
||||
|
||||
.subcomponent__live table {
|
||||
background-color: #49515C;
|
||||
}
|
||||
.subcomponent__live h2 {
|
||||
margin: 15px 0px 20px 0px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.subcomponent__live p {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.subcomponent__live label {
|
||||
color: #A2AAB4;
|
||||
}
|
||||
|
||||
.subcomponent__title {
|
||||
width: 94%;
|
||||
clear: both;
|
||||
background-color: #49515C;
|
||||
}
|
||||
|
||||
.subcomponent__title h1 {
|
||||
font-size: 2em;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.subcomponent__title h1 span {
|
||||
font-size: 20px;
|
||||
color: #A2AAB4;
|
||||
}
|
||||
|
||||
.subcomponent__small {
|
||||
min-height: 160px;
|
||||
}
|
||||
|
||||
|
||||
.subcomponent__medium {
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
.subcomponent__live .state--error .data-table__data:before,
|
||||
.subcomponent__live .state--warning .data-table__data:before,
|
||||
.subcomponent__live .state--ok .data-table__data:before {
|
||||
position: relative;
|
||||
left: -10px;
|
||||
}
|
||||
|
||||
bansho-host-services-list .subcomponent__live {
|
||||
min-width: 700px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -1,18 +1,17 @@
|
||||
<article ng-controller="HostCtrl">
|
||||
<section class="main__content tabpanel" ng-if="data.live && data.config">
|
||||
<h1>{{host.config.host_name}}</h1>
|
||||
<bansho-host-main></bansho-host-main>
|
||||
|
||||
<h2>Services</h2>
|
||||
<bansho-host-services-list></bansho-host-services-list>
|
||||
<bansho-host-live></bansho-host-live>
|
||||
|
||||
<h2>Load</h2>
|
||||
<bansho-host-load></bansho-host-load>
|
||||
|
||||
<h2>Cpu</h2>
|
||||
<bansho-host-cpu></bansho-host-cpu>
|
||||
|
||||
<h2>Info</h2>
|
||||
<bansho-host-info></bansho-host-info>
|
||||
|
||||
<bansho-host-services-list></bansho-host-services-list>
|
||||
|
||||
|
||||
</section>
|
||||
</article>
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
|
||||
angular.module('bansho.host', ['bansho.surveil',
|
||||
'bansho.host.main',
|
||||
'bansho.host.live',
|
||||
'bansho.host.load',
|
||||
'bansho.host.cpu',
|
||||
'bansho.host.info',
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
<div>
|
||||
<p>State: <bansho-service-state-icon state="host.cpuService.state"></bansho-service-state-icon> {{host.cpuService.state}}</p>
|
||||
<p>Plugin output: {{host.cpuService.plugin_output}}</p>
|
||||
<div class="subcomponent__live subcomponent__small">
|
||||
<h2>Cpu</h2>
|
||||
<p><label>State: </label><bansho-service-state-icon state="host.cpuService.state"></bansho-service-state-icon> {{host.cpuService.state}}</p>
|
||||
<p><label>Output: </label>{{host.cpuService.plugin_output}}</p>
|
||||
</div>
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
<div ng-controller="HostInfoCtrl">
|
||||
<div ng-controller="HostInfoCtrl" class="subcomponent__live">
|
||||
<h2>Info</h2>
|
||||
<table class="data-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
|
||||
7
app/components/host/host_live/host_live.html
Normal file
7
app/components/host/host_live/host_live.html
Normal file
@ -0,0 +1,7 @@
|
||||
<div ng-controller="HostLiveCtrl" class="subcomponent__live subcomponent__small">
|
||||
<h2>Status</h2>
|
||||
<p>
|
||||
<label>Current state: </label><bansho-host-state-icon state="host.live.state"></bansho-host-state-icon> {{host.live.state}}
|
||||
</p>
|
||||
<p><label>Output: </label>{{host.live.plugin_output}}</p>
|
||||
</div>
|
||||
17
app/components/host/host_live/host_live.js
Normal file
17
app/components/host/host_live/host_live.js
Normal file
@ -0,0 +1,17 @@
|
||||
'use strict';
|
||||
|
||||
angular.module('bansho.host.live', [])
|
||||
|
||||
.controller('HostLiveCtrl', ['$scope', function ($scope) {
|
||||
angular.noop();
|
||||
}])
|
||||
|
||||
.directive('banshoHostLive', function () {
|
||||
return {
|
||||
restrict: 'E',
|
||||
compile: function (scope, element, attrs) {
|
||||
scope.host = attrs.host;
|
||||
},
|
||||
templateUrl: 'components/host/host_live/host_live.html'
|
||||
};
|
||||
});
|
||||
@ -1,4 +1,5 @@
|
||||
<div>
|
||||
<p>State: <bansho-service-state-icon state="host.loadService.state"></bansho-service-state-icon> {{host.loadService.state}}</p>
|
||||
<p>Plugin output: {{host.loadService.plugin_output}}</p>
|
||||
<div class="subcomponent__live subcomponent__small">
|
||||
<h2>Load</h2>
|
||||
<p><label>State: </label><bansho-service-state-icon state="host.loadService.state"></bansho-service-state-icon> {{host.loadService.state}}</p>
|
||||
<p><label>Output: </label>{{host.loadService.plugin_output}}</p>
|
||||
</div>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<div ng-controller="HostMainCtrl">
|
||||
<p>
|
||||
Current state: <bansho-host-state-icon state="host.live.state"></bansho-host-state-icon> {{host.live.state}}
|
||||
</p>
|
||||
<p>Alias: <span ng-show="!host.config.alias">No alias</span></p>
|
||||
<p>Live plugin output: {{host.live.plugin_output}}</p>
|
||||
<div ng-controller="HostMainCtrl" class="subcomponent__live subcomponent__title">
|
||||
<h1>
|
||||
{{host.config.host_name}}
|
||||
<span class="subtitle"ng-show="host.config.alias">(host.config.alias)</span>
|
||||
<span class="subtitle">{{host.config.address}}</span>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
<div ng-hide="services.length === 0">
|
||||
<div ng-hide="services.length === 0" class="subcomponent__live">
|
||||
<h2>Services</h2>
|
||||
<table class="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
@ -9,7 +10,7 @@
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="service in host.services">
|
||||
<td>{{service.service_description}}</td>
|
||||
<td><a href="#/view?view=service&host_name={{service.host_name}}&description={{service.service_description}}">{{service.service_description}}</a>
|
||||
<td>{{service.acknowledged}}</td>
|
||||
<td><bansho-service-state-icon state="service.state"></bansho-service-state-icon>{{service.state}}</td>
|
||||
</tr>
|
||||
|
||||
@ -75,6 +75,7 @@
|
||||
<script src="components/host/host_info/host_info.js"></script>
|
||||
<script src="components/host/host_load/host_load.js"></script>
|
||||
<script src="components/host/host_main/host_main.js"></script>
|
||||
<script src="components/host/host_live/host_live.js"></script>
|
||||
<script src="components/host/host_services_list/host_services_list.js"></script>
|
||||
<script src="components/service/service.js"></script>
|
||||
<script src="components/service/service_main/service_main.js"></script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user