GUI Topo -- Badges - Fixed glyph positioning. Added CSS for info/warn/error statuses.

Change-Id: I9e37863a3425df9a9ecd2d20f5526e4f63c6ad00
diff --git a/web/gui/src/main/webapp/app/view/topo/topoD3.js b/web/gui/src/main/webapp/app/view/topo/topoD3.js
index 8353de5..1d2c5b1 100644
--- a/web/gui/src/main/webapp/app/view/topo/topoD3.js
+++ b/web/gui/src/main/webapp/app/view/topo/topoD3.js
@@ -57,7 +57,8 @@
         },
         badgeConfig = {
             radius: 12,
-            yoff: 5
+            yoff: 5,
+            gdelta: 10
         },
         icfg;
 
@@ -207,7 +208,8 @@
             dim = icfg.device.dim,
             box, dx, dy, bsel,
             bdg = d.badge,
-            bcr = badgeConfig.radius;
+            bcr = badgeConfig.radius,
+            bcgd = badgeConfig.gdelta;
 
         node.select('text')
             .text(label)
@@ -235,6 +237,8 @@
 
         // handle badge, if defined
         if (bdg) {
+            node.select('g.badge').remove();
+
             bsel = node.append('g')
                 .classed('badge', true)
                 .classed(badgeStatus(bdg), true)
@@ -251,8 +255,9 @@
             } else if (bdg.gid) {
                 bsel.append('use')
                     .attr({
-                        width: bcr * 2,
-                        height: bcr * 2,
+                        width: bcgd * 2,
+                        height: bcgd * 2,
+                        transform: sus.translate(-bcgd, -bcgd),
                         'xlink:href': '#' + bdg.gid
                     });