From 32aa286123c6e6849f89a1c6f12e04ee89f3a122 Mon Sep 17 00:00:00 2001 From: Michael Hartung <michi@Michaels-MacBook-Pro.local> Date: Tue, 13 Jul 2021 02:47:25 +0200 Subject: [PATCH] background color for legend --- .../network-legend/network-legend.component.html | 16 ++++++++-------- src/index.html | 2 +- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/app/components/network-legend/network-legend.component.html b/src/app/components/network-legend/network-legend.component.html index 5f666c6c..3ae77c85 100644 --- a/src/app/components/network-legend/network-legend.component.html +++ b/src/app/components/network-legend/network-legend.component.html @@ -22,38 +22,38 @@ </span> </td> <td *ngSwitchCase="'hexagon'"> - <span class="node hexagon" [style.color]=nodeGroup.value.color> + <span class="node hexagon" [style.color]=nodeGroup.value.color.background> ⬣ </span> </td> <td *ngSwitchCase="'triangle'"> - <span class="node triangle" [style.border-bottom-color]=nodeGroup.value.color> + <span class="node triangle" [style.border-bottom-color]=nodeGroup.value.color.background> </span> </td> <td *ngSwitchCase="'triangleDown'"> - <span class="node triangleDown" [style.border-top-color]=nodeGroup.value.color> + <span class="node triangleDown" [style.border-top-color]=nodeGroup.value.color.background> </span> </td> <td *ngSwitchCase="'diamond'"> <span class="node diamond" - [style.background-color]=nodeGroup.value.color + [style.background-color]=nodeGroup.value.color.background > </span> </td> <td *ngSwitchCase="'star'"> <span class="node star" - [style.border-bottom-color]=nodeGroup.value.color - [style.color]=nodeGroup.value.color + [style.border-bottom-color]=nodeGroup.value.color.background + [style.color]=nodeGroup.value.color.background > </span> </td> <td *ngSwitchCase="'circle'"> - <span class="node circle" [style.background-color]=nodeGroup.value.color> + <span class="node circle" [style.background-color]=nodeGroup.value.color.background> ... </span> </td> <td *ngSwitchDefault> - <span class="node {{ nodeGroup.value.shape }}" [style.background-color]=nodeGroup.value.color> + <span class="node {{ nodeGroup.value.shape }}" [style.background-color]=nodeGroup.value.color.background> </span> </td> <td> {{ nodeGroup.value.groupName }}</td> diff --git a/src/index.html b/src/index.html index 87b43fc7..c1d46c92 100644 --- a/src/index.html +++ b/src/index.html @@ -35,7 +35,7 @@ <network-expander id="netexp1" config='{ - "nodeGroups": {"selectedNode": {"font": {"size": "18"} }, "0.5": {"font": "18px verdana blue", "type": "0.5er Instanz", "color": "green", "groupName": "0.5", "shape": "hexagon"}, "patientgroup": {"type": "Patient", "detailShowLabel": "true", "color": "#632345", "groupName": "patient group", "shape": "dot", "size": "50"}, "pugGroup": {"type": "woof woof", "color": "grey", "groupName": "Pug Group", "shape": "triangle", "image": "https://static.raymondcamden.com/images/2016/11/pug.png"}}, + "nodeGroups": {"selectedNode": {"font": {"size": "18"} }, "0.5": {"font": "18px verdana blue", "type": "0.5er Instanz", "color": "green", "groupName": "0.5", "shape": "star"}, "patientgroup": {"type": "Patient", "detailShowLabel": "true", "color": "#632345", "groupName": "patient group", "shape": "dot", "size": "50"}, "pugGroup": {"type": "woof woof", "color": "grey", "groupName": "Pug Group", "shape": "triangle", "image": "https://static.raymondcamden.com/images/2016/11/pug.png"}}, "edgeGroups": {"xxx": {"color": "black", "groupName": "xxx Group", "dashes": [1, 2]}, "notdashes": {"color": "black", "groupName": "not dashes Group"}}, "identifier": "symbol" }' -- GitLab