tyler.durden/icingaweb2
1
0
Fork 0
mirror of https://github.com/Icinga/icingaweb2.git synced 2025-07-24 22:34:24 +02:00
Code Issues Packages Projects Releases Wiki Activity

Center timeframe elements vertically

Browse Source 
refs #4190
This commit is contained in:
Johannes Meyer 2014-03-31 10:39:01 +02:00
parent e3be5dd255
commit c94cd40b92
2 changed files with 18 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
modules/monitoring/application/views/scripts/timeline/index.phtml
View File

@ -33,7 +33,6 @@ $firstRow = true;
<?= $timeInfo[0]->end->format($intervalFormat); ?> <?= $timeInfo[0]->end->format($intervalFormat); ?>
</a> </a>
</span> </span>
<div class="circles">
<?php foreach ($groupInfo as $groupName => $labelAndColor): ?> <?php foreach ($groupInfo as $groupName => $labelAndColor): ?>
<?php if (array_key_exists($groupName, $timeInfo[1])): ?> <?php if (array_key_exists($groupName, $timeInfo[1])): ?>
<?php <?php
@ -41,14 +40,21 @@ $circleWidth = $timeline->calculateCircleWidth($timeInfo[1][$groupName], 2);
$extrapolatedCircleWidth = $timeline->getExtrapolatedCircleWidth($timeInfo[1][$groupName], 2); $extrapolatedCircleWidth = $timeline->getExtrapolatedCircleWidth($timeInfo[1][$groupName], 2);
?> ?>
<?php if ($firstRow && $extrapolatedCircleWidth !== $circleWidth): ?> <?php if ($firstRow && $extrapolatedCircleWidth !== $circleWidth): ?>
<div class="circle-box" style="width: <?= $extrapolatedCircleWidth; ?>;">
<div class="outer-circle extrapolated" style="<?= sprintf( <div class="outer-circle extrapolated" style="<?= sprintf(
'width: %3$s; height: %3$s; border-color: %2$s; background-color: %1$s;', 'width: %4$s; height: %4$s; border-color: %3$s; background-color: %1$s; margin-top: -%2$s;',
Color::changeBrightness($timeInfo[1][$groupName]->getColor(), 0.7), Color::changeBrightness($timeInfo[1][$groupName]->getColor(), 0.7),
((float) substr($extrapolatedCircleWidth, 0, -2) / 2) . 'em',
$timeInfo[1][$groupName]->getColor(), $timeInfo[1][$groupName]->getColor(),
$extrapolatedCircleWidth $extrapolatedCircleWidth
); ?>"> ); ?>">
<?php else: ?> <?php else: ?>
<div class="outer-circle" style="<?= sprintf('width: %1$s; height: %1$s;', $circleWidth); ?>"> <div class="circle-box" style="width: <?= $circleWidth; ?>;">
<div class="outer-circle" style="<?= sprintf(
'width: %2$s; height: %2$s; margin-top: -%1$s;',
((float) substr($circleWidth, 0, -2) / 2) . 'em',
$circleWidth
); ?>">
<?php endif ?> <?php endif ?>
<a class="inner-circle" style="<?= sprintf( <a class="inner-circle" style="<?= sprintf(
'width: %3$s; height: %3$s; background-color: %2$s; margin-top: -%1$s; margin-left: -%1$s;', 'width: %3$s; height: %3$s; background-color: %2$s; margin-top: -%1$s; margin-left: -%1$s;',
@ -64,9 +70,9 @@ $extrapolatedCircleWidth = $timeline->getExtrapolatedCircleWidth($timeInfo[1][$g
) )
); ?>" title="<?= $timeInfo[1][$groupName]->getValue(); ?> <?= $labelAndColor['label']; ?>"></a> ); ?>" title="<?= $timeInfo[1][$groupName]->getValue(); ?> <?= $labelAndColor['label']; ?>"></a>
</div> </div>
</div>
<?php endif ?> <?php endif ?>
<?php endforeach ?> <?php endforeach ?>
</div>
</div> </div>
<?php $firstRow = false; ?> <?php $firstRow = false; ?>
<?php endforeach ?> <?php endforeach ?>

12
public/css/icinga/monitoring-colors.less
View File

@ -687,15 +687,19 @@ div.timeline {
} }
} }
div.circles { div.circle-box {
// width: inline-style;
height: 100%;
margin-right: 0.5em;
position: relative;
float: left; float: left;
div.outer-circle { div.outer-circle {
// width: inline-style; // width: inline-style;
// height: inline-style; // height: inline-style;
margin: 0.5em; position: absolute;
position: relative; top: 50%;
float: left; // margin-top: inline-style;
&.extrapolated { &.extrapolated {
border-width: 2px; border-width: 2px;