Redesign tactical overview

This commit is contained in:
Bernd Erk 2014-11-06 22:38:06 +01:00
parent c885544a6b
commit f300c121cd
5 changed files with 37 additions and 23 deletions

View File

@ -18,7 +18,7 @@ $contactHelper = $this->getHelper('ContactFlags');
} }
foreach ($contacts as $contact): ?> foreach ($contacts as $contact): ?>
<div class="contact"> <div class="contact">
<img style="width: 60px; height: 60px;" src="<?= $this->href('/static/gravatar', array('email' => $contact->contact_email )) ?>" /> <img src="<?= $this->href('/static/gravatar', array('email' => $contact->contact_email )) ?>" />
<a href="<?= $this->href( <a href="<?= $this->href(
'monitoring/show/contact', 'monitoring/show/contact',
array('contact' => $contact->contact_name) array('contact' => $contact->contact_name)

View File

@ -2,7 +2,7 @@
<div class="controls"> <div class="controls">
<?= $this->tabs ?> <?= $this->tabs ?>
<h1><?= $this->translate('Contact details') ?></h1> <h1><?= $this->translate('Contact details') ?></h1>
<div class="circular" style="margin-top: 1em; margin-left: 2em; width: 120px; height: 120px; float: left; background-image: url('<?= <div class="circular" style="background-image: url('<?=
$this->href('static/gravatar', array('email' => $contact->contact_email)) $this->href('static/gravatar', array('email' => $contact->contact_email))
?>')"></div> ?>')"></div>

View File

@ -11,7 +11,7 @@
<?php if ($this->statusSummary->hosts_up || $this->statusSummary->hosts_pending): ?> <?php if ($this->statusSummary->hosts_up || $this->statusSummary->hosts_pending): ?>
<?= $this->render('tactical/components/ok_hosts.phtml'); ?> <?= $this->render('tactical/components/ok_hosts.phtml'); ?>
<?php endif ?> <?php endif ?>
<?= $this->render('tactical/components/hostservicechecks.phtml'); ?>
<?= $this->render('tactical/components/monitoringfeatures.phtml'); ?> <?= $this->render('tactical/components/monitoringfeatures.phtml'); ?>
<?= $this->render('tactical/components/hostservicechecks.phtml'); ?>
</div> </div>
</div> </div>

View File

@ -52,18 +52,21 @@ table.objectstate td.state {
} }
div.contacts div.contact { div.contacts div.contact {
background-color: lightgray; background-color: #eee;
padding: 0.5em; padding: 0.5em;
border-radius: 0.5em; border: 1px solid #d9d9d9;
overflow: hidden; overflow: hidden;
margin: 0.125em; margin: 0.125em;
float: left; float: left;
} }
div.contacts div.contact a{
color: #666;
}
div.contacts div.contact > img { div.contacts div.contact > img {
width: 60px; width: 80px;
border: 4px solid white; height: 80px;
border-radius: 8px;
margin-right: 8px; margin-right: 8px;
float: left; float: left;
} }

View File

@ -335,16 +335,10 @@ a.critical {
.boxview div.box-separator { .boxview div.box-separator {
font-size: 0.8em; font-size: 0.8em;
padding: 0.4em 0 0.4em; padding: 0.4em 0 0.4em;
border-top-width: 1px; border: 1px solid #d9d9d9;
border-bottom-width: 1px;
border-left-width: 0;
border-right-width: 0;
font-weight: bold; font-weight: bold;
letter-spacing: 0.1em; letter-spacing: 0.1em;
border-style: solid;
border-color: #555;
background-color: #bbb;
} }
/* Box entry */ /* Box entry */
@ -354,7 +348,7 @@ a.critical {
font-size: 0.9em; font-size: 0.9em;
white-space: nowrap; white-space: nowrap;
color: black; color: #666;
} }
/* Any line of a box entry */ /* Any line of a box entry */
@ -435,7 +429,8 @@ div.box.entry.handled a:hover {
/* Tactical overview element styles */ /* Tactical overview element styles */
.tactical > .boxview > div.box { .tactical > .boxview > div.box {
min-height: 17em; min-height: 20em;
min-width: 12.1em;
} }
.tactical div.box.contents { .tactical div.box.contents {
@ -463,7 +458,7 @@ div.box.contents.zero h3 {
} }
div.box.ok_hosts.state_up { div.box.ok_hosts.state_up {
background-color: @colorOk; border: 5px solid @colorOk;
} }
div.box.ok_hosts.state_pending { div.box.ok_hosts.state_pending {
@ -471,7 +466,7 @@ div.box.ok_hosts.state_pending {
} }
div.box.problem_hosts.state_down { div.box.problem_hosts.state_down {
background-color: @colorCritical; border: 5px solid @colorCritical;
} }
div.box.problem_hosts.state_down.handled { div.box.problem_hosts.state_down.handled {
@ -494,6 +489,10 @@ div.box.monitoringfeatures div.box.contents {
padding: 0 0 0.4em; padding: 0 0 0.4em;
} }
div.box.monitoringfeatures {
border: 5px solid #d9d9d9;
}
div.box.monitoringfeatures div.box-separator { div.box.monitoringfeatures div.box-separator {
color: white; color: white;
background-color: @colorOk; background-color: @colorOk;
@ -507,6 +506,10 @@ div.box.monitoringfeatures a.feature-highlight {
font-weight: bold; font-weight: bold;
} }
div.box.hostservicechecks {
border: 5px solid #d9d9d9;
}
/* Contactgroup element styles */ /* Contactgroup element styles */
div.box.contactgroup { div.box.contactgroup {
@ -524,12 +527,10 @@ div.box.contactgroup div.box.entry {
} }
div.box.contactgroup div.box.entry img { div.box.contactgroup div.box.entry img {
width: 60px; width: 80px;
height: 60px; height: 80px;
float: left; float: left;
border: 4px solid LightGrey;
border-radius: 8px;
} }
div.box.contactgroup div.box.entry a { div.box.contactgroup div.box.entry a {
@ -542,6 +543,16 @@ div.box.contactgroup div.box.entry p {
margin: 0.4em 0 0; margin: 0.4em 0 0;
} }
div.circular {
margin-top: 0.5em;
margin-left: 2em;
margin-right: 1em;
width: 80px;
height: 80px;
float: left;
background-size: 100% 100%;
}
/* End of monitoring box element styles */ /* End of monitoring box element styles */