Bri Prebilic Cole

GUI -- Titles on topo panels overflow to the next line instead of going off of the screen.

Change-Id: I1b45f889388ad77ddbfe1110b26c396a7cb03e7e
...@@ -95,6 +95,10 @@ ...@@ -95,6 +95,10 @@
95 95
96 /* --- general topo-panel styling --- */ 96 /* --- general topo-panel styling --- */
97 97
98 +.topo-p div.header div.icon {
99 + vertical-align: middle;
100 + display: inline-block;
101 +}
98 .topo-p div.body { 102 .topo-p div.body {
99 overflow-y: scroll; 103 overflow-y: scroll;
100 } 104 }
...@@ -122,12 +126,12 @@ ...@@ -122,12 +126,12 @@
122 126
123 127
124 .topo-p h2 { 128 .topo-p h2 {
125 - position: absolute;
126 padding: 0 4px; 129 padding: 0 4px;
127 margin: 0; 130 margin: 0;
128 - word-wrap: break-word; 131 + word-break: break-all;
129 - top: 20px; 132 + display: inline-block;
130 - left: 50px; 133 + width: 210px;
134 + vertical-align: middle;
131 } 135 }
132 .light .topo-p h2 { 136 .light .topo-p h2 {
133 color: black; 137 color: black;
...@@ -139,7 +143,7 @@ ...@@ -139,7 +143,7 @@
139 .topo-p h3 { 143 .topo-p h3 {
140 padding: 0 4px; 144 padding: 0 4px;
141 margin: 0; 145 margin: 0;
142 - word-wrap: break-word; 146 + word-break: break-all;
143 top: 20px; 147 top: 20px;
144 left: 50px; 148 left: 50px;
145 } 149 }
...@@ -156,7 +160,7 @@ ...@@ -156,7 +160,7 @@
156 } 160 }
157 161
158 .topo-p td { 162 .topo-p td {
159 - word-wrap: break-word; 163 + word-break: break-all;
160 } 164 }
161 .topo-p td.label { 165 .topo-p td.label {
162 font-style: italic; 166 font-style: italic;
......
...@@ -179,7 +179,9 @@ ...@@ -179,7 +179,9 @@
179 function populateSummary(data) { 179 function populateSummary(data) {
180 summary.setup(); 180 summary.setup();
181 181
182 - var svg = summary.appendHeader('svg'), 182 + var svg = summary.appendHeader('div')
183 + .classed('icon', true)
184 + .append('svg'),
183 title = summary.appendHeader('h2'), 185 title = summary.appendHeader('h2'),
184 table = summary.appendBody('table'), 186 table = summary.appendBody('table'),
185 tbody = table.append('tbody'); 187 tbody = table.append('tbody');
...@@ -197,7 +199,9 @@ ...@@ -197,7 +199,9 @@
197 function displaySingle(data) { 199 function displaySingle(data) {
198 detail.setup(); 200 detail.setup();
199 201
200 - var svg = detail.appendHeader('svg'), 202 + var svg = detail.appendHeader('div')
203 + .classed('icon', true)
204 + .append('svg'),
201 title = detail.appendHeader('h2'), 205 title = detail.appendHeader('h2'),
202 table = detail.appendBody('table'), 206 table = detail.appendBody('table'),
203 tbody = table.append('tbody'); 207 tbody = table.append('tbody');
...@@ -268,7 +272,9 @@ ...@@ -268,7 +272,9 @@
268 function displayLink(data) { 272 function displayLink(data) {
269 detail.setup(); 273 detail.setup();
270 274
271 - var svg = detail.appendHeader('svg'), 275 + var svg = detail.appendHeader('div')
276 + .classed('icon', true)
277 + .append('svg'),
272 title = detail.appendHeader('h2'), 278 title = detail.appendHeader('h2'),
273 table = detail.appendBody('table'), 279 table = detail.appendBody('table'),
274 tbody = table.append('tbody'), 280 tbody = table.append('tbody'),
......