luxolus
/
open-consul
2
0
Fork 0
Code Issues 1 Pull Requests Packages Releases Wiki Activity

UI: Text change and clarity Node Health > Health Checks (#5115) 

Text change Node Health > Health Checks
Also adds an info icon and tooltip to Health Checks column header
This commit is contained in:
John Cowen 2019-01-17 09:20:00 +00:00 committed by GitHub
parent 788bf610ae
commit 5eb5065f70
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 34 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
ui-v2/app/styles/components/table.scss
View File

@ -36,3 +36,36 @@ td dt.critical,
td dt.critical + dd { td dt.critical + dd {
color: $ui-color-failure; color: $ui-color-failure;
} }
/* Header Tooltips/Icon*/
th {
overflow: visible;
}
th span {
@extend %tooltip;
@extend %with-info;
margin-left: 12px;
top: 3px;
width: 23px;
height: 15px;
}
th span:after {
left: -8px;
}
th span em::after {
@extend %tooltip-tail;
@extend %blink-in-fade-out;
top: auto !important;
bottom: -13px;
}
th span em {
@extend %tooltip-bubble;
@extend %blink-in-fade-out;
width: 250px;
font-style: normal;
white-space: normal !important;
}
th span:hover em::after,
th span:hover em {
@extend %blink-in-fade-out-active;
}

2
ui-v2/app/templates/dc/services/index.hbs
View File

@ -23,7 +23,7 @@
}} }}
{{#block-slot 'header'}} {{#block-slot 'header'}}
<th style={{remainingWidth}}>Service</th> <th style={{remainingWidth}}>Service</th>
<th style={{totalWidth}}>Node Health</th> <th style={{totalWidth}}>Health Checks<span><em>The number of health checks for the service on all nodes</em></span></th>
<th style={{remainingWidth}}>Tags</th> <th style={{remainingWidth}}>Tags</th>
{{/block-slot}} {{/block-slot}}
{{#block-slot 'row'}} {{#block-slot 'row'}}