From: Martin Skorupski <martin.skorupski@highstreet-technologies.com>
Date: Sat, 14 Oct 2023 16:16:57 +0000 (+0200)
Subject: Create an init version of a network viewer
X-Git-Url: https://gerrit.o-ran-sc.org/r/gitweb?a=commitdiff_plain;h=f99eab8301794796ae28f89dc93df2e97dfa339b;hp=dcf7ba16ed4f19c2284f412a6c2422c44092ad9e;p=oam.git

Create an init version of a network viewer

- add svg style css file

Issue-ID: OAM-363
Change-Id: I0f03ad5f1a7fbeb858e063703c35f34de7f0a9a5
Signed-off-by: Martin Skorupski <martin.skorupski@highstreet-technologies.com>
---

diff --git a/code/network-generator/view/svg.style.css b/code/network-generator/view/svg.style.css
new file mode 100644
index 0000000..679ee5e
--- /dev/null
+++ b/code/network-generator/view/svg.style.css
@@ -0,0 +1,221 @@
+circle {
+  fill: red;
+  stroke: blue;
+  stroke-width: 2;
+}
+
+circle.dot {
+  fill: rgb(165, 163, 164);
+  stroke: blue;
+  stroke-width: 0;
+}
+
+ellipse {
+  fill: red;
+  stroke: blue;
+  stroke-width: 2;
+}
+
+ellipse.TapiConnectionEdgePoint {
+  fill: #dddddd;
+  stroke: #444444;
+  stroke-width: 1;
+}
+
+g.TapiConnectionEdgePoint>text {
+  fill: #444444;
+}
+
+g.TapiNodeFronthaulGateway>text {
+  fill: #444444;
+}
+
+g.node:hover>rect {
+  fill: #44aa44;
+  fill-opacity: .75;
+  stroke: #008800;
+  stroke-width: 4;
+}
+
+g.TapiNodeEdgePoint:hover>rect {
+  fill: #44aa44;
+  fill-opacity: .75;
+  stroke: #008800;
+  stroke-width: 4;
+}
+
+g.node:hover>text {
+  fill: #ffff88;
+  font-weight: bold;
+  cursor: default;
+}
+
+g.TapiNodeEdgePoint:hover>text {
+  fill: #ffff88;
+  font-weight: bold;
+  cursor: default;
+}
+
+g.TapiConnectionEdgePoint:hover>ellipse {
+  fill: #44aa44;
+  fill-opacity: .75;
+  stroke: #008800;
+  stroke-width: 4;
+}
+
+g.TapiConnectionEdgePoint:hover>text {
+  fill: #ffff88;
+  font-weight: bold;
+  cursor: default;
+}
+
+
+/* 3GPP defined interface links */
+
+g.e1>path {
+  fill: none;
+  stroke: #008800;
+  stroke-width: 1;
+}
+
+g.f1>path {
+  fill: none;
+  stroke: #008800;
+  stroke-width: 1;
+}
+
+g.n1>path {
+  fill: none;
+  stroke: #008800;
+  stroke-width: 1;
+}
+
+g.n2>path {
+  fill: none;
+  stroke: #008800;
+  stroke-width: 1;
+}
+
+g.n3>path {
+  fill: none;
+  stroke: #008800;
+  stroke-width: 1;
+}
+
+g.uu>path {
+  fill: none;
+  stroke: #008800;
+  stroke-width: 1;
+}
+
+g.link:hover>path {
+  fill: none;
+  stroke: #008800;
+  stroke-width: 6;
+}
+
+rect {
+  fill: red;
+  stroke: blue;
+  stroke-width: 2;
+}
+
+rect.node {
+  fill: lightcoral;
+  fill-opacity: .75;
+  stroke: darkred;
+}
+
+rect.TapiNodeEdgePoint {
+  fill: #888888;
+  stroke: #444444;
+  stroke-width: 1;
+}
+
+rect.smo {
+  fill: gold;
+  stroke: goldenrod;
+}
+
+rect.o2-controller {
+  fill: greenyellow;
+  stroke: green;
+}
+
+rect.o-cloud {
+  fill: greenyellow;
+  stroke: green;
+}
+
+rect.amf {
+  fill: green;
+  stroke: lightgreen;
+}
+
+rect.upf {
+  fill: green;
+  stroke: lightgreen;
+}
+
+rect.fhgw {
+  fill: #dddddd;
+  stroke: #444444;
+}
+
+rect.ue {
+  fill: skyblue;
+  stroke: lightskyblue;
+}
+
+path {
+  fill: red;
+  stroke: blue;
+  stroke-width: 2;
+}
+
+path.link {
+  fill: none;
+  stroke: #444444;
+}
+
+title {
+  background-color: #44aa44;
+  font-size: 100pt;
+}
+
+text {
+  fill: white;
+  stroke: none;
+  text-anchor: middle;
+  font-family: Arial, Helvetica, sans-serif;
+  font-size: 10px;
+  font-weight: normal;
+}
+
+text.amf {
+  fill: lightgreen;
+}
+
+text.upf {
+  fill: lightgreen;
+}
+
+text.smo {
+  fill: #444444;
+}
+
+text.o2-controller {
+  fill: #444444;
+}
+
+g.TapiNodeOCloud>text {
+  fill: #444444;
+}
+
+text.fhgw {
+  fill: #444444;
+}
+
+text.ue {
+  fill: #444444;
+}
\ No newline at end of file