[opt-viewer] Truncate long remark text in source view
authorAdam Nemet <anemet@apple.com>
Tue, 14 Nov 2017 04:48:18 +0000 (04:48 +0000)
committerAdam Nemet <anemet@apple.com>
Tue, 14 Nov 2017 04:48:18 +0000 (04:48 +0000)
The table is changed to fixed layout[1] and the lines use ellipses if they
would overflow their cell.

[1] https://css-tricks.com/fixing-tables-long-strings/

llvm-svn: 318136

llvm/tools/opt-viewer/opt-viewer.py
llvm/tools/opt-viewer/style.css

index bdf21bb..5af78b0 100755 (executable)
@@ -119,17 +119,21 @@ class SourceFileRenderer:
 </head>
 <body>
 <div class="centered">
-<table>
+<table class="source">
+<thead>
 <tr>
-<td>Line</td>
-<td>Hotness</td>
-<td>Optimization</td>
-<td>Source</td>
-<td>Inline Context</td>
-</tr>''', file=self.stream)
+<th style="width: 2%">Line</td>
+<th style="width: 3%">Hotness</td>
+<th style="width: 10%">Optimization</td>
+<th style="width: 70%">Source</td>
+<th style="width: 15%">Inline Context</td>
+</tr>
+</thead>
+<tbody>''', file=self.stream)
         self.render_source_lines(self.source_stream, line_remarks)
 
         print('''
+</tbody>
 </table>
 </body>
 </html>''', file=self.stream)
index 595c3e4..0d3347c 100644 (file)
@@ -1,3 +1,13 @@
+.source {
+  table-layout: fixed;
+  width: 100%;
+  white-space: nowrap;
+}
+.source td {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
 .red {
   background-color: #ffd0d0;
 }