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

problems: font size for alert list layout

Browse Source
This commit is contained in:
Alexander Zobnin
2019-01-16 11:32:15 +03:00
parent 249b3b43d4
commit a61f219dfc
2 changed files with 55 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/panel-triggers/components/AlertList/AlertList.tsx
View File

@@ -58,11 +58,14 @@ export default class AlertList extends PureComponent<AlertListProps, AlertListSt
render() {
const { problems, panelOptions } = this.props;
const currentProblems = this.getCurrentProblems(this.state.page);
let fontSize = parseInt(panelOptions.fontSize.slice(0, panelOptions.fontSize.length - 1), 10);
fontSize = fontSize && fontSize !== 100 ? fontSize : null;
const alertListClass = classNames('alert-rule-list', { [`font-size--${fontSize}`]: fontSize });
return (
<div className="triggers-panel-container" key="alertListContainer">
<section className="card-section card-list-layout-list">
<ol className="alert-rule-list">
<ol className={alertListClass}>
{currentProblems.map(problem =>
<AlertCard
key={problem.triggerid}

51
src/sass/_panel-triggers.scss
View File

@@ -19,6 +19,7 @@
display: flex;
max-height: 1.6em;
overflow: hidden;
align-items: center;
padding-right: 1em;
&.zbx-description--newline {
@@ -37,6 +38,56 @@
}
}
@for $i from 8 through 9 {
&.font-size--#{$i * 10} {
&,
.alert-rule-item__name {
font-size: 1% * $i * 10;
}
.alert-rule-item__icon {
width: unset;
font-size: 1% * $i * 10;
}
.alert-rule-item__time,
.alert-rule-item__text,
.zabbix-hostname {
font-size: 1% * $i * 10 * 0.8;
}
.zbx-trigger-tags .label-tag {
font-size: 1% * $i * 10 * 0.6;
padding: 0.3em 0.3em;
}
}
}
@for $i from 11 through 25 {
&.font-size--#{$i * 10} {
&,
.alert-rule-item__name {
font-size: 1% * $i * 10;
}
.alert-rule-item__icon {
width: unset;
font-size: 1% * $i * 10;
}
.alert-rule-item__time,
.alert-rule-item__text,
.zabbix-hostname {
font-size: 1% * $i * 10 * 0.8;
}
.zbx-trigger-tags .label-tag {
font-size: 1% * $i * 10 * 0.6;
padding: 0.3em 0.3em;
}
}
}
}
}