maxmustermann/kibana
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

[APM] Service maps: Improve the selected node style (#64279)

Browse source 
* [APM] Set the text color of the selected state

* [APM] Show label background on selected state
This commit is contained in:
Casper Hübertz 2020-04-28 09:33:55 +02:00 committed by GitHub
parent 5457a62fdb
commit 99c382fdac
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
x-pack/legacy/plugins/apm/public/components/app/ServiceMap/cytoscapeOptions.ts
View file

@ -60,7 +60,10 @@ const style: cytoscape.Stylesheet[] = [
? theme.euiColorPrimary
: theme.euiColorMediumShade,
'border-width': 2,
color: theme.textColors.text,
color: (el: cytoscape.NodeSingular) =>
el.hasClass('primary') || el.selected()
? theme.euiColorPrimaryText
: theme.textColors.text,
// theme.euiFontFamily doesn't work here for some reason, so we're just
// specifying a subset of the fonts for the label text.
'font-family': 'Inter UI, Segoe UI, Helvetica, Arial, sans-serif',
@ -78,8 +81,9 @@ const style: cytoscape.Stylesheet[] = [
'overlay-opacity': 0,
shape: (el: cytoscape.NodeSingular) =>
isService(el) ? (isIE11 ? 'rectangle' : 'ellipse') : 'diamond',
'text-background-color': theme.euiColorLightestShade,
'text-background-opacity': 0,
'text-background-color': theme.euiColorPrimary,
'text-background-opacity': (el: cytoscape.NodeSingular) =>
el.hasClass('primary') || el.selected() ? 0.1 : 0,
'text-background-padding': theme.paddingSizes.xs,
'text-background-shape': 'roundrectangle',
'text-margin-y': parseInt(theme.paddingSizes.s, 10),