1 files changed, 51 insertions, 0 deletions

diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.css b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.css
index f4b089a0..dda6d5c6 100644
--- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.css
+++ b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.css
@@ -96,6 +96,24 @@ html[data-platform='iPad'] #topo-p-detail {
     height: 30px;
 }
 
+/* --- Topo Dialog Panel --- */
+
+#topo-p-dialog .dialog-button {
+    display: inline-block;
+    cursor: pointer;
+    height: 20px;
+    padding: 2px 6px;
+    margin: 4px;
+    float: right;
+}
+
+.light #topo-p-dialog .dialog-button {
+    background-color: #fec;
+}
+.dark #topo-p-dialog .dialog-button {
+    background-color: #369;
+}
+
 /* --- general topo-panel styling --- */
 
 .topo-p div.header div.icon {
@@ -427,6 +445,39 @@ html[data-platform='iPad'] #topo-p-detail {
     fill: #f90;
 }
 
+/* Badges */
+/* (... works for both light and dark themes...) */
+#ov-topo svg .node .badge circle {
+    stroke: #aaa;
+}
+
+#ov-topo svg .node .badge.badgeInfo circle {
+    fill: #ccf;
+}
+
+#ov-topo svg .node .badge.badgeWarn circle {
+    fill: #da2;
+}
+
+#ov-topo svg .node .badge.badgeError circle {
+    fill: #e44;
+}
+
+#ov-topo svg .node .badge use {
+    fill: white;
+}
+
+#ov-topo svg .node .badge.badgeInfo use {
+    fill: #448;
+}
+
+#ov-topo svg .node .badge text {
+    fill: white;
+}
+
+#ov-topo svg .node .badge.badgeInfo text {
+    fill: #448;
+}
 
 /* Host Nodes */