GUI -- Titles on topo panels overflow to the next line instead of going off of the screen.
Change-Id: I1b45f889388ad77ddbfe1110b26c396a7cb03e7e
diff --git a/web/gui/src/main/webapp/app/view/topo/topo.css b/web/gui/src/main/webapp/app/view/topo/topo.css
index d3cd66d..282025a 100644
--- a/web/gui/src/main/webapp/app/view/topo/topo.css
+++ b/web/gui/src/main/webapp/app/view/topo/topo.css
@@ -95,6 +95,10 @@
/* --- general topo-panel styling --- */
+.topo-p div.header div.icon {
+ vertical-align: middle;
+ display: inline-block;
+}
.topo-p div.body {
overflow-y: scroll;
}
@@ -122,12 +126,12 @@
.topo-p h2 {
- position: absolute;
padding: 0 4px;
margin: 0;
- word-wrap: break-word;
- top: 20px;
- left: 50px;
+ word-break: break-all;
+ display: inline-block;
+ width: 210px;
+ vertical-align: middle;
}
.light .topo-p h2 {
color: black;
@@ -139,7 +143,7 @@
.topo-p h3 {
padding: 0 4px;
margin: 0;
- word-wrap: break-word;
+ word-break: break-all;
top: 20px;
left: 50px;
}
@@ -156,7 +160,7 @@
}
.topo-p td {
- word-wrap: break-word;
+ word-break: break-all;
}
.topo-p td.label {
font-style: italic;
diff --git a/web/gui/src/main/webapp/app/view/topo/topoPanel.js b/web/gui/src/main/webapp/app/view/topo/topoPanel.js
index fe09f89..ac00920 100644
--- a/web/gui/src/main/webapp/app/view/topo/topoPanel.js
+++ b/web/gui/src/main/webapp/app/view/topo/topoPanel.js
@@ -179,7 +179,9 @@
function populateSummary(data) {
summary.setup();
- var svg = summary.appendHeader('svg'),
+ var svg = summary.appendHeader('div')
+ .classed('icon', true)
+ .append('svg'),
title = summary.appendHeader('h2'),
table = summary.appendBody('table'),
tbody = table.append('tbody');
@@ -197,7 +199,9 @@
function displaySingle(data) {
detail.setup();
- var svg = detail.appendHeader('svg'),
+ var svg = detail.appendHeader('div')
+ .classed('icon', true)
+ .append('svg'),
title = detail.appendHeader('h2'),
table = detail.appendBody('table'),
tbody = table.append('tbody');
@@ -268,7 +272,9 @@
function displayLink(data) {
detail.setup();
- var svg = detail.appendHeader('svg'),
+ var svg = detail.appendHeader('div')
+ .classed('icon', true)
+ .append('svg'),
title = detail.appendHeader('h2'),
table = detail.appendBody('table'),
tbody = table.append('tbody'),