Replace static inline styles with css class
The static inline styles are replaced with css class to avoid Content-Security-Policy violations.
This commit is contained in:
parent
511f507c60
commit
459f4198c3
|
@ -7,20 +7,20 @@
|
||||||
<table class="avp action" data-base-target="_next">
|
<table class="avp action" data-base-target="_next">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th style="width: 18em;">
|
<th>
|
||||||
<strong><?= t('Dashlet Name') ?></strong>
|
<strong><?= t('Dashlet Name') ?></strong>
|
||||||
</th>
|
</th>
|
||||||
<th>
|
<th>
|
||||||
<strong><?= t('Url') ?></strong>
|
<strong><?= t('Url') ?></strong>
|
||||||
</th>
|
</th>
|
||||||
<th style="width: 1.4em;"> </th>
|
<th class="icon-col"> </th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<?php foreach ($this->dashboard->getPanes() as $pane): ?>
|
<?php foreach ($this->dashboard->getPanes() as $pane): ?>
|
||||||
<?php if ($pane->getDisabled()) continue; ?>
|
<?php if ($pane->getDisabled()) continue; ?>
|
||||||
<tr>
|
<tr>
|
||||||
<th colspan="2" style="text-align: left; padding: 0.5em;">
|
<th colspan="2">
|
||||||
<?php if ($pane->isUserWidget()): ?>
|
<?php if ($pane->isUserWidget()): ?>
|
||||||
<?= $this->qlink(
|
<?= $this->qlink(
|
||||||
$pane->getName(),
|
$pane->getName(),
|
||||||
|
@ -63,7 +63,7 @@
|
||||||
array('title' => sprintf($this->translate('Edit dashlet %s'), $dashlet->getTitle()))
|
array('title' => sprintf($this->translate('Edit dashlet %s'), $dashlet->getTitle()))
|
||||||
); ?>
|
); ?>
|
||||||
</td>
|
</td>
|
||||||
<td style="table-layout: fixed; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
|
<td>
|
||||||
<?= $this->qlink(
|
<?= $this->qlink(
|
||||||
$dashlet->getUrl()->getRelativeUrl(),
|
$dashlet->getUrl()->getRelativeUrl(),
|
||||||
$dashlet->getUrl()->getRelativeUrl(),
|
$dashlet->getUrl()->getRelativeUrl(),
|
||||||
|
|
|
@ -13,8 +13,8 @@
|
||||||
<tbody>
|
<tbody>
|
||||||
<?php foreach ($this->logData as $value): ?>
|
<?php foreach ($this->logData as $value): ?>
|
||||||
<?php $datetime = new Datetime($value->datetime) ?>
|
<?php $datetime = new Datetime($value->datetime) ?>
|
||||||
<tr class="state">
|
<tr>
|
||||||
<td style="width: 6em; text-align: center">
|
<td>
|
||||||
<?= $this->escape($datetime->format('d.m. H:i')) ?><br />
|
<?= $this->escape($datetime->format('d.m. H:i')) ?><br />
|
||||||
<?= $this->escape($value->loglevel) ?>
|
<?= $this->escape($value->loglevel) ?>
|
||||||
</td>
|
</td>
|
||||||
|
|
|
@ -17,9 +17,9 @@ if (! $this->compact): ?>
|
||||||
<table class="table-row-selectable common-table">
|
<table class="table-row-selectable common-table">
|
||||||
<thead>
|
<thead>
|
||||||
<th><?= $this->translate('Shared Navigation'); ?></th>
|
<th><?= $this->translate('Shared Navigation'); ?></th>
|
||||||
<th style="width: 10em"><?= $this->translate('Type'); ?></th>
|
<th><?= $this->translate('Type'); ?></th>
|
||||||
<th style="width: 10em"><?= $this->translate('Owner'); ?></th>
|
<th><?= $this->translate('Owner'); ?></th>
|
||||||
<th style="width: 5em"><?= $this->translate('Unshare'); ?></th>
|
<th><?= $this->translate('Unshare'); ?></th>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<?php foreach ($items as $item): ?>
|
<?php foreach ($items as $item): ?>
|
||||||
|
@ -53,7 +53,7 @@ if (! $this->compact): ?>
|
||||||
)
|
)
|
||||||
); ?></td>
|
); ?></td>
|
||||||
<?php else: ?>
|
<?php else: ?>
|
||||||
<td data-base-target="_self"><?= $removeForm
|
<td data-base-target="_self" class="remove-nav-item"><?= $removeForm
|
||||||
->setDefault('name', $item->name)
|
->setDefault('name', $item->name)
|
||||||
->setAction(Url::fromPath(
|
->setAction(Url::fromPath(
|
||||||
'navigation/unshare',
|
'navigation/unshare',
|
||||||
|
|
|
@ -50,6 +50,6 @@ class Announcements extends AbstractWidget
|
||||||
return $html;
|
return $html;
|
||||||
}
|
}
|
||||||
// Force container update on XHR
|
// Force container update on XHR
|
||||||
return '<div style="display: none;"></div>';
|
return '<div hidden></div>';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -39,14 +39,14 @@ class ApplicationStateMessages extends AbstractWidget
|
||||||
}
|
}
|
||||||
|
|
||||||
if (! (bool) $enabled) {
|
if (! (bool) $enabled) {
|
||||||
return '<div style="display: none;"></div>';
|
return '<div hidden></div>';
|
||||||
}
|
}
|
||||||
|
|
||||||
$active = $this->getMessages();
|
$active = $this->getMessages();
|
||||||
|
|
||||||
if (empty($active)) {
|
if (empty($active)) {
|
||||||
// Force container update on XHR
|
// Force container update on XHR
|
||||||
return '<div style="display: none;"></div>';
|
return '<div hidden></div>';
|
||||||
}
|
}
|
||||||
|
|
||||||
$html = '<div>';
|
$html = '<div>';
|
||||||
|
|
|
@ -471,7 +471,7 @@ class FilterEditor extends AbstractWidget
|
||||||
}
|
}
|
||||||
|
|
||||||
if ($this->addTo && $this->addTo == $filter->getId()) {
|
if ($this->addTo && $this->addTo == $filter->getId()) {
|
||||||
$parts[] = '<li style="background: #ffb">' . $this->renderNewFilter() .$this->cancelLink(). '</li>';
|
$parts[] = '<li class="new-filter">' . $this->renderNewFilter() .$this->cancelLink(). '</li>';
|
||||||
}
|
}
|
||||||
|
|
||||||
$class = $level === 0 ? ' class="datafilter"' : '';
|
$class = $level === 0 ? ' class="datafilter"' : '';
|
||||||
|
@ -575,7 +575,7 @@ class FilterEditor extends AbstractWidget
|
||||||
$this->elementId('operator', $filter),
|
$this->elementId('operator', $filter),
|
||||||
$ops,
|
$ops,
|
||||||
$filter === null ? null : $filter->getOperatorName(),
|
$filter === null ? null : $filter->getOperatorName(),
|
||||||
array('style' => 'width: 5em')
|
['class' => 'filter-operator']
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -594,7 +594,7 @@ class FilterEditor extends AbstractWidget
|
||||||
$this->elementId('sign', $filter),
|
$this->elementId('sign', $filter),
|
||||||
$signs,
|
$signs,
|
||||||
$filter === null ? null : $filter->getSign(),
|
$filter === null ? null : $filter->getSign(),
|
||||||
array('style' => 'width: 4em')
|
['class' => 'filter-rule']
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -738,7 +738,7 @@ class FilterEditor extends AbstractWidget
|
||||||
|
|
||||||
$html = ' <form method="post" class="search inline" action="'
|
$html = ' <form method="post" class="search inline" action="'
|
||||||
. $preservedUrl
|
. $preservedUrl
|
||||||
. '"><input type="text" name="q" style="width: 8em" class="search" value="" placeholder="'
|
. '"><input type="text" name="q" class="search search-input" value="" placeholder="'
|
||||||
. t('Search...')
|
. t('Search...')
|
||||||
. '" /></form>';
|
. '" /></form>';
|
||||||
|
|
||||||
|
@ -779,7 +779,7 @@ class FilterEditor extends AbstractWidget
|
||||||
. '<form action="'
|
. '<form action="'
|
||||||
. Url::fromRequest()
|
. Url::fromRequest()
|
||||||
. '" class="editor" method="POST">'
|
. '" class="editor" method="POST">'
|
||||||
. '<input type="submit" name="submit" value="Apply" style="display:none;"/>'
|
. '<input type="submit" name="submit" value="Apply" hidden/>'
|
||||||
. '<ul class="tree"><li>'
|
. '<ul class="tree"><li>'
|
||||||
. $this->renderFilter($this->filter)
|
. $this->renderFilter($this->filter)
|
||||||
. '</li></ul>'
|
. '</li></ul>'
|
||||||
|
|
|
@ -52,7 +52,7 @@ EOT;
|
||||||
* @var string
|
* @var string
|
||||||
*/
|
*/
|
||||||
private $closeTpl = <<< 'EOT'
|
private $closeTpl = <<< 'EOT'
|
||||||
<li style="float: right;">
|
<li class="close-container-btn">
|
||||||
<a href="#" title="{TITLE}" aria-label="{TITLE}" class="close-container-control">
|
<a href="#" title="{TITLE}" aria-label="{TITLE}" class="close-container-control">
|
||||||
<i aria-hidden="true" class="icon-cancel"></i>
|
<i aria-hidden="true" class="icon-cancel"></i>
|
||||||
</a>
|
</a>
|
||||||
|
|
|
@ -5,11 +5,10 @@
|
||||||
|
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<?php foreach ($this->font->glyphs as $icon): ?>
|
<?php foreach ($this->font->glyphs as $icon): ?>
|
||||||
<!-- TODO: move CSS away //-->
|
<div class="icon <?=
|
||||||
<div style="width: 33%; font-size: 1.5em; height: 2em; float: left;" class="<?=
|
|
||||||
$this->font->css_prefix_text . $icon->css
|
$this->font->css_prefix_text . $icon->css
|
||||||
?>">
|
?>">
|
||||||
<?= $this->escape($icon->css) ?> <span style="font-size: 0.6em">(0x<?= dechex($icon->code) ?>)</span>
|
<?= $this->escape($icon->css) ?> <span class="icon-code">(0x<?= dechex($icon->code) ?>)</span>
|
||||||
</div>
|
</div>
|
||||||
<?php endforeach ?>
|
<?php endforeach ?>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -107,3 +107,14 @@ th {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 33%;
|
||||||
|
font-size: 1.5em;
|
||||||
|
height: 2em;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-code {
|
||||||
|
font-size: 0.6em;
|
||||||
|
}
|
||||||
|
|
|
@ -63,7 +63,7 @@ class Zend_View_Helper_PluginOutput extends Zend_View_Helper_Abstract
|
||||||
protected static $htmlReplacements = array(
|
protected static $htmlReplacements = array(
|
||||||
"\t",
|
"\t",
|
||||||
"\n",
|
"\n",
|
||||||
'<table style="font-size: 0.75em"'
|
'<table class="output-table"'
|
||||||
);
|
);
|
||||||
|
|
||||||
/** @var \Icinga\Module\Monitoring\Web\Helper\PluginOutputHookRenderer */
|
/** @var \Icinga\Module\Monitoring\Web\Helper\PluginOutputHookRenderer */
|
||||||
|
|
|
@ -112,9 +112,9 @@ for ($i = 0; $i < $diff->days; $i += $step) {
|
||||||
$f->add(new DateInterval('P' . $step . 'D'));
|
$f->add(new DateInterval('P' . $step . 'D'));
|
||||||
}
|
}
|
||||||
?>
|
?>
|
||||||
<div style="width: 33.5em;">
|
<div class="event-grid">
|
||||||
<?php foreach (array_reverse($grids) as $key => $grid): ?>
|
<?php foreach (array_reverse($grids) as $key => $grid): ?>
|
||||||
<div style=" <?= $this->orientation === 'horizontal' ? '' : 'display: inline-block; vertical-align: top; top; margin: 0.5em;' ?>">
|
<div class=" <?= $this->orientation === 'horizontal' ? '' : 'vertical' ?>">
|
||||||
<?= $grid; ?>
|
<?= $grid; ?>
|
||||||
<?= $this->orientation === 'horizontal' ? '<br />' : '' ?>
|
<?= $this->orientation === 'horizontal' ? '<br />' : '' ?>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -16,7 +16,7 @@
|
||||||
<table class="name-value-table">
|
<table class="name-value-table">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
<th style="width: 20%"></th>
|
<th></th>
|
||||||
<td><strong><?= $this->escape($contact->contact_alias) ?></strong> (<?= $contact->contact_name ?>)</td>
|
<td><strong><?= $this->escape($contact->contact_alias) ?></strong> (<?= $contact->contact_name ?>)</td>
|
||||||
</tr>
|
</tr>
|
||||||
<?php if ($contact->contact_email): ?>
|
<?php if ($contact->contact_email): ?>
|
||||||
|
|
|
@ -427,5 +427,6 @@ $dashboard->add(
|
||||||
/*
|
/*
|
||||||
* CSS
|
* CSS
|
||||||
*/
|
*/
|
||||||
|
$this->provideCssFile('event-grid.less');
|
||||||
$this->provideCssFile('service-grid.less');
|
$this->provideCssFile('service-grid.less');
|
||||||
$this->provideCssFile('tables.less');
|
$this->provideCssFile('tables.less');
|
||||||
|
|
|
@ -0,0 +1,9 @@
|
||||||
|
.event-grid {
|
||||||
|
width: 33.5em;
|
||||||
|
|
||||||
|
.vertical {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: top;
|
||||||
|
margin: 0.5em;
|
||||||
|
}
|
||||||
|
}
|
|
@ -654,6 +654,9 @@ form.instance-features span.description, form.object-features span.description {
|
||||||
.plugin-output {
|
.plugin-output {
|
||||||
border-left: 5px solid @gray-lighter;
|
border-left: 5px solid @gray-lighter;
|
||||||
padding: 0.66em 0.33em;
|
padding: 0.66em 0.33em;
|
||||||
|
.output-table {
|
||||||
|
font-size: 0.75em;
|
||||||
|
}
|
||||||
|
|
||||||
.state-critical {
|
.state-critical {
|
||||||
background-color: @color-critical;
|
background-color: @color-critical;
|
||||||
|
|
|
@ -19,7 +19,7 @@ $maxProgress = max(array_merge([0], array_keys(array_filter(
|
||||||
<div class="setup-header">
|
<div class="setup-header">
|
||||||
<?= $this->img('img/icinga-logo-big.png'); ?>
|
<?= $this->img('img/icinga-logo-big.png'); ?>
|
||||||
<div class="progress-bar">
|
<div class="progress-bar">
|
||||||
<div class="step" style="width: 10%;">
|
<div class="step width-percent-10">
|
||||||
<h1><?= $this->translate('Welcome', 'setup.progress'); ?></h1>
|
<h1><?= $this->translate('Welcome', 'setup.progress'); ?></h1>
|
||||||
<?php $stateClass = $finished || $currentPos > 0 ? 'complete' : (
|
<?php $stateClass = $finished || $currentPos > 0 ? 'complete' : (
|
||||||
$maxProgress > 0 ? 'visited' : 'active'
|
$maxProgress > 0 ? 'visited' : 'active'
|
||||||
|
@ -30,7 +30,7 @@ $maxProgress = max(array_merge([0], array_keys(array_filter(
|
||||||
<td class="right"><div class="line right <?= $stateClass; ?>"></div></td>
|
<td class="right"><div class="line right <?= $stateClass; ?>"></div></td>
|
||||||
</tr></tbody></table>
|
</tr></tbody></table>
|
||||||
</div>
|
</div>
|
||||||
<div class="step" style="width: 10%;">
|
<div class="step width-percent-10">
|
||||||
<h1><?= $this->translate('Modules', 'setup.progress'); ?></h1>
|
<h1><?= $this->translate('Modules', 'setup.progress'); ?></h1>
|
||||||
<?php $stateClass = $finished || $currentPos > 1 ? ' complete' : (
|
<?php $stateClass = $finished || $currentPos > 1 ? ' complete' : (
|
||||||
$maxProgress > 1 ? ' visited' : (
|
$maxProgress > 1 ? ' visited' : (
|
||||||
|
@ -46,7 +46,7 @@ $maxProgress = max(array_merge([0], array_keys(array_filter(
|
||||||
<?= $this->restartForm ?>
|
<?= $this->restartForm ?>
|
||||||
<?php endif ?>
|
<?php endif ?>
|
||||||
</div>
|
</div>
|
||||||
<div class="step" style="width: 10%;">
|
<div class="step width-percent-10">
|
||||||
<h1><?= $this->translate('Requirements', 'setup.progress'); ?></h1>
|
<h1><?= $this->translate('Requirements', 'setup.progress'); ?></h1>
|
||||||
<?php $stateClass = $finished || $currentPos > 2 ? ' complete' : (
|
<?php $stateClass = $finished || $currentPos > 2 ? ' complete' : (
|
||||||
$maxProgress > 2 ? ' visited' : (
|
$maxProgress > 2 ? ' visited' : (
|
||||||
|
@ -62,7 +62,7 @@ $maxProgress = max(array_merge([0], array_keys(array_filter(
|
||||||
<?= $this->restartForm ?>
|
<?= $this->restartForm ?>
|
||||||
<?php endif ?>
|
<?php endif ?>
|
||||||
</div>
|
</div>
|
||||||
<div class="step" style="width: 60%;">
|
<div class="step width-percent-60">
|
||||||
<h1><?= $this->translate('Configuration', 'setup.progress'); ?></h1>
|
<h1><?= $this->translate('Configuration', 'setup.progress'); ?></h1>
|
||||||
<table><tbody><tr>
|
<table><tbody><tr>
|
||||||
<td class="left">
|
<td class="left">
|
||||||
|
@ -122,7 +122,7 @@ $maxProgress = max(array_merge([0], array_keys(array_filter(
|
||||||
<?= $this->restartForm ?>
|
<?= $this->restartForm ?>
|
||||||
<?php endif ?>
|
<?php endif ?>
|
||||||
</div>
|
</div>
|
||||||
<div class="step" style="width: 10%;">
|
<div class="step width-percent-10">
|
||||||
<h1><?= $this->translate('Finish', 'setup.progress'); ?></h1>
|
<h1><?= $this->translate('Finish', 'setup.progress'); ?></h1>
|
||||||
<?php $stateClass = $finished ? ' complete' : ($pages[$currentPos] === end($pages) ? ' active' : ''); ?>
|
<?php $stateClass = $finished ? ' complete' : ($pages[$currentPos] === end($pages) ? ' active' : ''); ?>
|
||||||
<table><tbody><tr>
|
<table><tbody><tr>
|
||||||
|
|
|
@ -48,3 +48,7 @@
|
||||||
.primary-nav a {
|
.primary-nav a {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.remove-nav-item {
|
||||||
|
padding-left: 2em;
|
||||||
|
}
|
||||||
|
|
|
@ -114,6 +114,14 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.width-percent-10 {
|
||||||
|
width: 10%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.width-percent-60 {
|
||||||
|
width: 60%;
|
||||||
|
}
|
||||||
|
|
||||||
.setup-content {
|
.setup-content {
|
||||||
padding: 1.5em 10em 0 10em;
|
padding: 1.5em 10em 0 10em;
|
||||||
|
|
||||||
|
|
|
@ -103,3 +103,7 @@
|
||||||
#layout.twocols .tabs > li > .close-container-control {
|
#layout.twocols .tabs > li > .close-container-control {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.close-container-btn {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
|
@ -208,6 +208,10 @@ table.multiselect tr[href] td {
|
||||||
}
|
}
|
||||||
|
|
||||||
#main div.filter {
|
#main div.filter {
|
||||||
|
.search.search-input {
|
||||||
|
width: 8em;
|
||||||
|
}
|
||||||
|
|
||||||
form.editor {
|
form.editor {
|
||||||
input[type=text], select {
|
input[type=text], select {
|
||||||
width: 12em;
|
width: 12em;
|
||||||
|
@ -238,6 +242,20 @@ table.multiselect tr[href] td {
|
||||||
.buttons input:not(:last-child) {
|
.buttons input:not(:last-child) {
|
||||||
margin-right:.5em;
|
margin-right:.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ul.tree {
|
||||||
|
.filter-operator {
|
||||||
|
width: 5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new-filter {
|
||||||
|
background: #ffb;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-rule {
|
||||||
|
width: 4em;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -641,3 +659,4 @@ ul.tree li a.error:hover {
|
||||||
html.no-js .progress-label {
|
html.no-js .progress-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -28,7 +28,7 @@
|
||||||
var _this = e.data.self;
|
var _this = e.data.self;
|
||||||
|
|
||||||
$('#layout').append(
|
$('#layout').append(
|
||||||
'<div id="application-state" class="container" style="display: none" data-icinga-url="'
|
'<div id="application-state" class="container" hidden data-icinga-url="'
|
||||||
+ _this.icinga.loader.baseUrl
|
+ _this.icinga.loader.baseUrl
|
||||||
+ '/application-state" data-icinga-refresh="60"></div>'
|
+ '/application-state" data-icinga-refresh="60"></div>'
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in New Issue