+ {details.metrics &&
Status
- {details.metrics &&
}
- {details.metadata &&
}
+
+
}
+ {details.metadata &&
}
{details.children && details.children.map(children => {
diff --git a/client/app/scripts/components/node-details/node-details-health-overflow.js b/client/app/scripts/components/node-details/node-details-health-overflow.js
index 45e2c3c4ec..76fcea7f8c 100644
--- a/client/app/scripts/components/node-details/node-details-health-overflow.js
+++ b/client/app/scripts/components/node-details/node-details-health-overflow.js
@@ -3,11 +3,22 @@ import React from 'react';
import NodeDetailsHealthOverflowItem from './node-details-health-overflow-item';
export default class NodeDetailsHealthOverflow extends React.Component {
+
+ constructor(props, context) {
+ super(props, context);
+ this.handleClick = this.handleClick.bind(this);
+ }
+
+ handleClick(ev) {
+ ev.preventDefault();
+ this.props.handleClick();
+ }
+
render() {
const items = this.props.items.slice(0, 4);
return (
-
+
{items.map(item => )}
);
diff --git a/client/app/scripts/components/node-details/node-details-health.js b/client/app/scripts/components/node-details/node-details-health.js
index d389a653af..811b195643 100644
--- a/client/app/scripts/components/node-details/node-details-health.js
+++ b/client/app/scripts/components/node-details/node-details-health.js
@@ -35,7 +35,8 @@ export default class NodeDetailsHealth extends React.Component {
{primeMetrics.map(item => {
return
;
})}
- {showOverflow &&
}
+ {showOverflow &&
this.handleClickMore()} />}
this.handleClickMore()} collection={this.props.metrics}
expanded={this.state.expanded} notShown={notShown} hideNumber />
diff --git a/client/app/scripts/components/node-details/node-details-table.js b/client/app/scripts/components/node-details/node-details-table.js
index 0d18772194..c9e1863a5d 100644
--- a/client/app/scripts/components/node-details/node-details-table.js
+++ b/client/app/scripts/components/node-details/node-details-table.js
@@ -115,6 +115,8 @@ export default class NodeDetailsTable extends React.Component {
}
return ;
}
+ // empty cell to complete the row for proper hover
+ return | ;
});
}
diff --git a/client/app/styles/main.less b/client/app/styles/main.less
index 68013cd1ad..a77207103f 100644
--- a/client/app/styles/main.less
+++ b/client/app/styles/main.less
@@ -546,10 +546,6 @@ h2 {
padding: 0 36px 0 36px;
overflow-y: auto;
- &-info {
- margin-top: 16px;
- }
-
&-loading {
margin-top: 48px;
text-align: center;
@@ -628,7 +624,6 @@ h2 {
}
&-info {
- margin: 16px 0;
&-field {
display: flex;
@@ -694,7 +689,7 @@ h2 {
table-layout: fixed;
&-wrapper {
- margin: 24px 0;
+ margin: 24px -4px;
}
&-header {
@@ -703,7 +698,7 @@ h2 {
font-size: 90%;
text-align: right;
cursor: pointer;
- padding: 0;
+ padding: 0 4px;
&-sorted {
color: @text-secondary-color;
@@ -728,7 +723,7 @@ h2 {
}
> * {
- padding: 0;
+ padding: 0 4px;
}
&-link {
@@ -897,7 +892,7 @@ h2 {
.show-more {
.btn-opacity;
- border-top: 1px solid lighten(@text-tertiary-color, 30%);
+ border-top: 1px dotted @border-light-color;
padding: 0px 0;
margin-top: 4px;
text-align: right;