Misthios/grafana-zabbix
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

triggers panel: fix font scaling

Browse Source
This commit is contained in:
Alexander Zobnin
2018-03-15 17:34:56 +03:00
parent 3e6bffa193
commit 22d1643caa
5 changed files with 27 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
dist/panel-triggers/partials/module.html vendored
View File

@@ -67,7 +67,7 @@
</span> </span>
</div> </div>
<div class="alert-rule-item__time"> <div class="alert-rule-item__time zbx-trigger-lastchange">
<span>{{trigger.lastchange || "last change unknown"}}</span> <span>{{trigger.lastchange || "last change unknown"}}</span>
<div class="trigger-info-block zbx-status-icons"> <div class="trigger-info-block zbx-status-icons">

19
dist/panel-triggers/triggers_panel_ctrl.js vendored
View File

@@ -747,18 +747,23 @@ System.register(['lodash', 'jquery', 'moment', '../datasource-zabbix/utils', 'ap
function setFontSize() { function setFontSize() {
var fontSize = parseInt(panel.fontSize.slice(0, panel.fontSize.length - 1)); var fontSize = parseInt(panel.fontSize.slice(0, panel.fontSize.length - 1));
var triggerCardElem = elem.find('.card-item-wrapper'); var triggerCardElem = elem.find('.alert-rule-item');
if (fontSize && fontSize !== 100) { if (fontSize && fontSize !== 100) {
triggerCardElem.find('.alert-list-icon').css({ 'font-size': fontSize + '%' }); triggerCardElem.find('.alert-rule-item__icon').css({
triggerCardElem.find('.alert-list-title').css({ 'font-size': fontSize + '%' }); 'font-size': fontSize + '%',
triggerCardElem.find('.alert-list-text').css({ 'font-size': fontSize * 0.8 + '%' }); 'margin': fontSize / 100 * 6 + 'px'
});
triggerCardElem.find('.alert-rule-item__name').css({ 'font-size': fontSize + '%' });
triggerCardElem.find('.alert-rule-item__text').css({ 'font-size': fontSize * 0.8 + '%' });
triggerCardElem.find('.zbx-trigger-lastchange').css({ 'font-size': fontSize * 0.8 + '%' });
triggerCardElem.find('.zbx-tag').css({ 'font-size': fontSize * 0.6 + '%' }); triggerCardElem.find('.zbx-tag').css({ 'font-size': fontSize * 0.6 + '%' });
triggerCardElem.find('.zbx-tag').css({ 'line-height': fontSize / 100 * 16 + 'px' }); triggerCardElem.find('.zbx-tag').css({ 'line-height': fontSize / 100 * 16 + 'px' });
} else { } else {
// remove css // remove css
triggerCardElem.find('.alert-list-icon').css({ 'font-size': '' }); triggerCardElem.find('.alert-rule-item__icon').css({ 'font-size': '', 'margin-right': '' });
triggerCardElem.find('.alert-list-title').css({ 'font-size': '' }); triggerCardElem.find('.alert-rule-item__name').css({ 'font-size': '' });
triggerCardElem.find('.alert-list-text').css({ 'font-size': '' }); triggerCardElem.find('.alert-rule-item__text').css({ 'font-size': '' });
triggerCardElem.find('.zbx-trigger-lastchange').css({ 'font-size': '' });
triggerCardElem.find('.zbx-tag').css({ 'font-size': '' }); triggerCardElem.find('.zbx-tag').css({ 'font-size': '' });
triggerCardElem.find('.zbx-tag').css({ 'line-height': '' }); triggerCardElem.find('.zbx-tag').css({ 'line-height': '' });
} }

2
dist/panel-triggers/triggers_panel_ctrl.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
src/panel-triggers/partials/module.html
View File

@@ -67,7 +67,7 @@
</span> </span>
</div> </div>
<div class="alert-rule-item__time"> <div class="alert-rule-item__time zbx-trigger-lastchange">
<span>{{trigger.lastchange || "last change unknown"}}</span> <span>{{trigger.lastchange || "last change unknown"}}</span>
<div class="trigger-info-block zbx-status-icons"> <div class="trigger-info-block zbx-status-icons">

19
src/panel-triggers/triggers_panel_ctrl.js
View File

@@ -593,18 +593,23 @@ export class TriggerPanelCtrl extends PanelCtrl {
function setFontSize() { function setFontSize() {
const fontSize = parseInt(panel.fontSize.slice(0, panel.fontSize.length - 1)); const fontSize = parseInt(panel.fontSize.slice(0, panel.fontSize.length - 1));
let triggerCardElem = elem.find('.card-item-wrapper'); let triggerCardElem = elem.find('.alert-rule-item');
if (fontSize && fontSize !== 100) { if (fontSize && fontSize !== 100) {
triggerCardElem.find('.alert-list-icon').css({'font-size': fontSize + '%'}); triggerCardElem.find('.alert-rule-item__icon').css({
triggerCardElem.find('.alert-list-title').css({'font-size': fontSize + '%'}); 'font-size': fontSize + '%',
triggerCardElem.find('.alert-list-text').css({'font-size': fontSize * 0.8 + '%'}); 'margin': fontSize / 100 * 6 + 'px'
});
triggerCardElem.find('.alert-rule-item__name').css({'font-size': fontSize + '%'});
triggerCardElem.find('.alert-rule-item__text').css({'font-size': fontSize * 0.8 + '%'});
triggerCardElem.find('.zbx-trigger-lastchange').css({'font-size': fontSize * 0.8 + '%'});
triggerCardElem.find('.zbx-tag').css({'font-size': fontSize * 0.6 + '%'}); triggerCardElem.find('.zbx-tag').css({'font-size': fontSize * 0.6 + '%'});
triggerCardElem.find('.zbx-tag').css({'line-height': fontSize / 100 * 16 + 'px'}); triggerCardElem.find('.zbx-tag').css({'line-height': fontSize / 100 * 16 + 'px'});
} else { } else {
// remove css // remove css
triggerCardElem.find('.alert-list-icon').css({'font-size': ''}); triggerCardElem.find('.alert-rule-item__icon').css({'font-size': '', 'margin-right': ''});
triggerCardElem.find('.alert-list-title').css({'font-size': ''}); triggerCardElem.find('.alert-rule-item__name').css({'font-size': ''});
triggerCardElem.find('.alert-list-text').css({'font-size': ''}); triggerCardElem.find('.alert-rule-item__text').css({'font-size': ''});
triggerCardElem.find('.zbx-trigger-lastchange').css({'font-size': ''});
triggerCardElem.find('.zbx-tag').css({'font-size': ''}); triggerCardElem.find('.zbx-tag').css({'font-size': ''});
triggerCardElem.find('.zbx-tag').css({'line-height': ''}); triggerCardElem.find('.zbx-tag').css({'line-height': ''});
} }