upstream/icingaweb2-module-graphite
1
0
Fork 0
mirror of https://github.com/Icinga/icingaweb2-module-graphite.git synced 2026-05-28 04:34:57 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge branch 'feature/expandable-content'

Browse source
This commit is contained in:
Alexander A. Klimov 2017-11-27 14:45:39 +01:00
commit a84e6999cf
2 changed files with 4 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
library/Graphite/Web/Widget/Graphs.php
View file

@ -193,12 +193,12 @@ abstract class Graphs extends AbstractWidget
$result[] = $div;
} elseif ($limit && $renderedGraphs === $limit) {
$result[] = sprintf(
'<input type="checkbox" id="toggle-%1$s" class="collapsible-toggle">'
'<input type="checkbox" id="toggle-%1$s" class="expandable-toggle">'
. '<label for="toggle-%1$s" class="link-button">'
. '<span class="collapsible-show">%2$s</span>'
. '<span class="collapsible-hide">%3$s</span>'
. '<span class="expandable-expand-label">%2$s</span>'
. '<span class="expandable-collapse-label">%3$s</span>'
. '</label>'
. '<div class="collapsible">',
. '<div class="expandable-content">',
$view->protectId($this->getMonitoredObjectIdentifier()),
$view->translate('Show More'),
$view->translate('Show Less')

49
public/css/module.less
View file

@ -10,55 +10,6 @@ div.images {
}
.collapsible {
clear: right; // Because the label is floating right
height: 0;
opacity: 0;
visibility: hidden;
-webkit-transition: opacity 0.2s linear, visibility 0.2s;
-moz-transition: opacity 0.2s linear, visibility 0.2s;
-o-transition: opacity 0.2s linear, visibility 0.2s;
transition: opacity 0.2s linear, visibility 0.2s;
}
input[type="checkbox"].collapsible-toggle {
display: none;
& + label {
float: right;
margin-right: 1em;
cursor: pointer;
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
}
&:checked ~ .collapsible {
height: auto;
opacity: 1;
visibility: visible;
-webkit-transition: opacity 0.2s linear;
-moz-transition: opacity 0.2s linear;
-o-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
}
& ~ label span.collapsible-hide {
display: none;
}
&:checked ~ label span.collapsible-show {
display: none;
}
&:checked ~ label span.collapsible-hide {
display: inline;
}
}
div.images.monitored-object-detail-view {
display: block;