upstream/icingaweb2-module-businessprocess
1
0
Fork 0
mirror of https://github.com/Icinga/icingaweb2-module-businessprocess.git synced 2026-02-17 09:52:59 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Redesign breadcrumbs

Browse source
This commit is contained in:
Johannes Meyer 2019-01-22 14:09:50 +01:00
parent fba4235a6a
commit fb8c3c5a33
3 changed files with 50 additions and 52 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
library/Businessprocess/Renderer/Breadcrumb.php
View file

@ -37,11 +37,11 @@ class Breadcrumb extends BaseHtmlElement
'href' => Url::fromPath('businessprocess'),
'title' => mt('businessprocess', 'Show Overview')
],
Html::tag('i', ['class' => 'icon icon-dashboard'])
Html::tag('i', ['class' => 'icon icon-home'])
)
));
$breadcrumb->add(Html::tag('li')->add(
Html::tag('a', ['href' => $bpUrl], $bp->getTitle())
Html::tag('a', ['href' => $bpUrl], mt('businessprocess', 'Root'))
));
$path = $renderer->getCurrentPath();
@ -70,7 +70,6 @@ class Breadcrumb extends BaseHtmlElement
$renderer = clone($renderer);
$renderer->lock()->setIsBreadcrumb();
$p = new NodeTile($renderer, (string) $node, $node, $path);
$p->getAttributes()->add('class', $renderer->getNodeClasses($node));
$p->setTag('li');
return $p;
}

46
library/Businessprocess/Renderer/TileRenderer/NodeTile.php
View file

@ -77,36 +77,30 @@ class NodeTile extends BaseHtmlElement
$attributes->add('data-node-name', (string) $node);
}
$this->addActions();
if (! $renderer->isBreadcrumb()) {
$this->addDetailsActions();
if (! $renderer->isLocked()) {
$this->addActionLinks();
}
}
$link = $this->getMainNodeLink();
$this->add($link);
if ($node instanceof BpNode) {
if ($renderer->isBreadcrumb()) {
$link->add($renderer->renderStateBadges($node->getStateSummary()));
} else {
$this->add(Html::tag(
'p',
['class' => 'children-count'],
$node->hasChildren()
? Html::tag(
'span',
null,
sprintf('%u %s', $node->countChildren(), mt('businessprocess', 'Children'))
)
: null
));
$this->add($renderer->renderStateBadges($node->getStateSummary()));
}
}
if (! $renderer->isBreadcrumb()) {
$this->addDetailsActions();
}
if (! $renderer->isLocked()) {
$this->addActionLinks();
if ($node instanceof BpNode && !$renderer->isBreadcrumb()) {
$this->add(Html::tag(
'p',
['class' => 'children-count'],
$node->hasChildren()
? Html::tag(
'span',
null,
sprintf('%u %s', $node->countChildren(), mt('businessprocess', 'Children'))
)
: null
));
$this->add($renderer->renderStateBadges($node->getStateSummary()));
}
return parent::render();

51
public/css/module.less
View file

@ -517,21 +517,9 @@ td > a > .badges {
list-style: none;
overflow: hidden;
padding: 0;
.badges {
background-color: transparent;
border-radius: 0;
display: inline-block;
padding: 0 0 0 0.5em;
.badge {
line-height: 1.25em;
font-size: 0.8em;
border: 1px solid white;
}
}
}
.breadcrumb {
/*.breadcrumb {
> .critical a { background: @colorCritical; }
> .critical.handled a { background: @colorCriticalHandled; }
> .unknown a { background: @colorUnknown; }
@ -549,7 +537,7 @@ td > a > .badges {
> .warning a:after { border-left-color: @colorWarning; }
> .warning.handled a:after { border-left-color: @colorWarningHandled; }
> .ok a:after { border-left-color: @colorOk; }
}
}*/
.breadcrumb:after {
content:'';
@ -566,13 +554,12 @@ td > a > .badges {
}
.breadcrumb li a {
color: white;
color: @icinga-blue;
margin: 0;
font-size: 1.2em;
text-decoration: none;
padding-left: 2em;
line-height: 2.5em;
background: @icinga-blue;
position: relative;
display: block;
float: left;
@ -580,8 +567,26 @@ td > a > .badges {
outline: none;
}
}
.breadcrumb li {
border: 1px solid @gray-lighter;
.breadcrumb li a:before, .breadcrumb li a:after {
&:first-of-type {
border-radius: .25em;
}
&:last-of-type {
border-radius: .25em;
border: 1px solid @icinga-blue;
background: @icinga-blue;
padding-right: 1.2em;
a {
color: white;
}
}
}
.breadcrumb li:not(:last-of-type) a:before, .breadcrumb li:not(:last-of-type) a:after {
content: " ";
display: block;
width: 0;
@ -594,14 +599,14 @@ td > a > .badges {
left: 100%;
}
.breadcrumb li a:before {
border-left: 1.2em solid white;
.breadcrumb li:not(:last-of-type) a:before {
border-left: 1.2em solid @gray-lighter;
margin-left: 1px;
z-index: 1;
}
.breadcrumb li a:after {
border-left: 1.2em solid @icinga-blue;
.breadcrumb li:not(:last-of-type) a:after {
border-left: 1.2em solid white;
z-index: 2;
}
@ -616,8 +621,8 @@ td > a > .badges {
}
.breadcrumb li:not(:last-child) a:hover { background: @text-color; color: white; }
.breadcrumb li:not(:last-child) a:hover:after { border-left-color: @text-color; }
.breadcrumb li:not(:last-child) a:hover { background: @icinga-blue; color: white; }
.breadcrumb li:not(:last-child) a:hover:after { border-left-color: @icinga-blue; }
.breadcrumb li a:focus {
text-decoration: underline;