tyler.durden
/
icingaweb2
mirror of https://github.com/Icinga/icingaweb2.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

CSS and Parts: Tactical Overview redesin

This commit is contained in:
Bernd Erk 2015-09-29 14:23:32 +02:00
parent 44b9d44641
commit 09e32b63f8
3 changed files with 117 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
modules/monitoring/application/views/scripts/tactical/components/monitoringfeatures.phtml
View File

@ -5,9 +5,9 @@
<div class="box contents">
<?php if ($this->statusSummary->hosts_without_flap_detection || $this->statusSummary->services_without_flap_detection ||
$this->statusSummary->hosts_flapping || $this->statusSummary->services_flapping): ?>
<div class="box-separator feature-highlight"><?= $this->translate('Flap Detection'); ?></div>
<div class="box-separator badge feature-highlight"><?= $this->translate('Flap Detection'); ?></div>
<?php else: ?>
<div class="box-separator"><?= $this->translate('Flap Detection'); ?></div>
<div class="box-separator badge"><?= $this->translate('Flap Detection'); ?></div>
<?php endif ?>
<table>
<tbody>
@ -126,9 +126,9 @@
</tbody>
</table>
<?php if ($this->statusSummary->hosts_not_triggering_notifications || $this->statusSummary->services_not_triggering_notifications): ?>
<div class="box-separator feature-highlight"><?= $this->translate('Notifications'); ?></div>
<div class="box-separator badge feature-highlight"><?= $this->translate('Notifications'); ?></div>
<?php else: ?>
<div class="box-separator"><?= $this->translate('Notifications'); ?></div>
<div class="box-separator badge"><?= $this->translate('Notifications'); ?></div>
<?php endif ?>
<table>
<tbody>
@ -205,9 +205,9 @@
</tbody>
</table>
<?php if ($this->statusSummary->hosts_not_processing_event_handlers || $this->statusSummary->services_not_processing_event_handlers): ?>
<div class="box-separator feature-highlight"><?= $this->translate('Event Handlers'); ?></div>
<div class="box-separator badge feature-highlight"><?= $this->translate('Event Handlers'); ?></div>
<?php else: ?>
<div class="box-separator"><?= $this->translate('Event Handlers'); ?></div>
<div class="box-separator badge"><?= $this->translate('Event Handlers'); ?></div>
<?php endif ?>
<table>
<tbody>

12
modules/monitoring/application/views/scripts/tactical/components/parts/servicestatesummarybyhoststate.phtml
View File

@ -4,7 +4,7 @@ use Icinga\Module\Monitoring\Object\Service;
?>
<?php if ($services_critical_handled || $services_critical_unhandled): ?>
<div class="box entry state_<?= Service::getStateText(2); ?> <?= $services_critical_unhandled ? '' : 'handled'; ?>">
<div class="box badge entry state-<?= Service::getStateText(2); ?> <?= $services_critical_unhandled ? '' : 'handled'; ?>">
<?php if ($services_critical_unhandled): ?>
<?= $this->qlink(
$services_critical_unhandled . ' ' . Service::getStateText(2, true),
@ -103,7 +103,7 @@ use Icinga\Module\Monitoring\Object\Service;
</div>
<?php endif ?>
<?php if ($services_warning_handled || $services_warning_unhandled): ?>
<div class="box entry state_<?= Service::getStateText(1); ?> <?= $services_warning_unhandled ? '' : 'handled'; ?>">
<div class="box badge entry state-<?= Service::getStateText(1); ?> <?= $services_warning_unhandled ? '' : 'handled'; ?>">
<?php if ($services_warning_unhandled): ?>
<?= $this->qlink(
$services_warning_unhandled . ' ' . Service::getStateText(1, true),
@ -202,7 +202,7 @@ use Icinga\Module\Monitoring\Object\Service;
</div>
<?php endif ?>
<?php if ($services_unknown_handled || $services_unknown_unhandled): ?>
<div class="box entry state_<?= Service::getStateText(3); ?> <?= $services_unknown_unhandled ? '' : 'handled'; ?>">
<div class="box badge entry state-<?= Service::getStateText(3); ?> <?= $services_unknown_unhandled ? '' : 'handled'; ?>">
<?php if ($services_unknown_unhandled): ?>
<?= $this->qlink(
$services_unknown_unhandled . ' ' . Service::getStateText(3, true),
@ -301,7 +301,7 @@ use Icinga\Module\Monitoring\Object\Service;
</div>
<?php endif ?>
<?php if ($services_ok): ?>
<div class="box entry state_<?= Service::getStateText(0); ?>">
<div class="box badge entry state-<?= Service::getStateText(0); ?>">
<?= $this->qlink(
$services_ok . ' ' . Service::getStateText(0, true),
'monitoring/list/services',
@ -348,7 +348,7 @@ use Icinga\Module\Monitoring\Object\Service;
</div>
<?php endif ?>
<?php if ($services_pending): ?>
<div class="box entry state_<?= Service::getStateText(99); ?>">
<div class="box badge entry state-<?= Service::getStateText(99); ?>">
<?= $this->qlink(
$services_pending . ' ' . Service::getStateText(99, true),
'monitoring/list/services',
@ -393,4 +393,4 @@ use Icinga\Module\Monitoring\Object\Service;
); ?>
<?php endif ?>
</div>
<?php endif ?>
<?php endif ?>

113
modules/monitoring/public/css/module.less
View File

@ -1,13 +1,110 @@
/*! Icinga Web 2 | (c) 2013-2015 Icinga Development Team | GPLv2+ */
/* Badges */
.state-badges {
> ul > li {
padding-right: 5px;
&:last-child {
padding-right: 0;
}
}
/* Generic box element */
.boxview a {
text-decoration: none;
}
.boxview > div.box {
text-align: center;
vertical-align: top;
display: inline-block;
padding: 20px;
margin: 0.5em;
}
/* Box body of contents */
.boxview div.box.contents {
padding-top: 20px;
}
.boxview div.box.contents table {
width: 100%;
}
.boxview div.box.contents td {
vertical-align: top;
}
/* Box entry */
/* Any line of a box entry */
.boxview div.box.entry a {
display: block;
color: inherit;
}
.boxview div.box.badge {
border-radius: 3px;
margin: 5px;
padding: 5px;
}
.boxview div.box.entry a:hover {
}
/* First line of a box entry */
.boxview div.box.entry a:first-child {
}
/* End of generic box element */
/* Tactical overview element styles */
.tactical > .boxview > div.box {
min-height: 30em;
min-width: 30em;
}
.tactical div.box.header {
min-height: 5em;
border-bottom:1px solid @gray-lighter;
}
div.box.contents.zero {
}
div.box.ok_hosts.state_up {
border: 2px solid @color-ok;
border-top: 15px solid @color-ok;
}
div.box.problem_hosts.state_down {
border: 2px solid @color-critical;
border-top: 15px solid @color-critical;
}
div.box.ok_hosts div.box.entry, div.box.problem_hosts div.box.entry {
min-width: 11.1em;
}
div.box.monitoringfeatures {
border: 2px solid @gray;
border-top: 15px solid @gray;
}
div.box.monitoringfeatures div.box-separator {
color: white;
background-color: @color-ok;
}
div.box.monitoringfeatures div.feature-highlight {
background-color: @color-critical;
}
div.box.monitoringfeatures a.feature-highlight {
}
div.box.hostservicechecks {
border: 2px solid @gray;
border-top: 15px solid @gray;
}
div.box.hostservicechecks th {
padding-bottom: 20px;
}
//p.pluginoutput {