Disable applyAuthorStyles

runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/heap_profile.html

Index: runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/heap_profile.html
diff --git a/runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/heap_profile.html b/runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/heap_profile.html
index ada00da2c233535a43ead5b1f374d1d717aa338c..87356b0f75997bdcc8a127ea660e6b7574305119 100644
--- a/runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/heap_profile.html
+++ b/runtime/bin/vmservice/client/deployed/web/packages/observatory/src/elements/heap_profile.html
@@ -5,67 +5,111 @@
 </head>
 <polymer-element name="heap-profile" extends="observatory-element">
 <template>
+  <link rel="stylesheet" href="css/shared.css">
+  <style>
+    .table {
+      border-collapse: collapse!important;
+      width: 100%;
+      margin-bottom: 20px
+      table-layout: fixed;
+    }
+    .table td:nth-of-type(1) {
+      width: 30%;
+    }
+    .th, .td {
+      padding: 8px;
+      vertical-align: top;
+    }
+    .table thead > tr > th {
+      vertical-align: bottom;
+      text-align: left;
+      border-bottom:2px solid #ddd;
+    }
+    .clickable {
+      color: #0489c3;
+      text-decoration: none;
+      cursor: pointer;
+    }
+    .clickable:hover {
+      text-decoration: underline;
+      cursor: pointer;
+    }
+    #classtable tr:hover > td {
+      background-color: #F4C7C3;
+    }
+  </style>
   <nav-bar>
     <top-nav-menu></top-nav-menu>
     <isolate-nav-menu isolate="{{ profile.isolate }}"></isolate-nav-menu>
     <nav-menu link="." anchor="heap profile" last="{{ true }}"></nav-menu>
+    <nav-refresh callback="{{ resetAccumulator }}" label="Reset Accumulator"></nav-refresh>
+    <nav-refresh callback="{{ refreshGC }}" label="GC"></nav-refresh>
     <nav-refresh callback="{{ refresh }}"></nav-refresh>
   </nav-bar>
 
-  <button type="button" on-click="{{resetAccumulator}}">Reset Accumulator</button>
-  <div class="row">
-    <div id="newPieChart" class="col-md-4" style="height: 400px">
+  <div class="flex-row">
+    <div id="newPieChart" class="flex-item-fixed-4-12" style="height: 400px">
     </div>
-    <div id="newStatus" class="col-md-2">
-      <table class="table">
-        <tbody>
-          <tr>
-            <td>Collections</td>
-            <td>{{ formattedCollections(true) }}</td>
-          </tr>
-          <tr>
-            <td>Average Collection Time</td>
-            <td>{{ formattedAverage(true) }}</td>
-          </tr>
-          <tr>
-            <td>Cumulative Collection Time</td>
-            <td>{{ formattedTotalCollectionTime(true) }}</td>
-          </tr>
-        </tbody>
-      </table>
+    <div id="newStatus" class="flex-item-fixed-2-12">
+      <div class="memberList">
+          <div class="memberItem">
+            <div class="memberName">Collections</div>
+            <div class="memberValue">{{ formattedCollections(true) }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Average Collection Time</div>
+            <div class="memberValue">{{ formattedAverage(true) }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Cumulative Collection Time</div>
+            <div class="memberValue">{{ formattedTotalCollectionTime(true) }}</div>
+          </div>
+      </div>
     </div>
-    <div id="oldPieChart" class="col-md-4" style="height: 400px">
+    <div id="oldPieChart" class="flex-item-fixed-4-12" style="height: 400px">
     </div>
-    <div id="oldStatus" class="col-md-2">
-      <table class="table">
-        <tbody>
-          <tr>
-            <td>Collections</td>
-            <td>{{ formattedCollections(false) }}</td>
-          </tr>
-          <tr>
-            <td>Average Collection Time</td>
-            <td>{{ formattedAverage(false) }}</td>
-          </tr>
-          <tr>
-            <td>Cumulative Collection Time</td>
-            <td>{{ formattedTotalCollectionTime(false) }}</td>
-          </tr>
-        </tbody>
-      </table>
+    <div id="oldStatus" class="flex-item-fixed-2-12">
+      <div class="memberList">
+          <div class="memberItem">
+            <div class="memberName">Collections</div>
+            <div class="memberValue">{{ formattedCollections(false) }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Average Collection Time</div>
+            <div class="memberValue">{{ formattedAverage(false) }}</div>
+          </div>
+          <div class="memberItem">
+            <div class="memberName">Cumulative Collection Time</div>
+            <div class="memberValue">{{ formattedTotalCollectionTime(false) }}</div>
+          </div>
+      </div>
     </div>
   </div>
-  <div class="row">
-  <p class="col-md-2">Aggregate heap table</p>
-  </div>
-  <div class="row">
-    <div id="simpleTable" class="col-md-12" style="height: 800px"></div>
-  </div>
-  <div class="row">
-  <p class="col-md-2">Individual heap table</p>
-  </div>
-  <div class="row">
-    <div id="table" class="col-md-12" style="height: 800px"></div>
+  <div class="flex-row">
+    <table id="classtable" class="flex-item-fixed-12-12 table">
+      <thead>
+        <tr>
+          <th on-click="{{changeSort}}" class="clickable" title="Class">{{ classTable.getColumnLabel(0) }}</th>
+          <th on-click="{{changeSort}}" class="clickable" title="Total Accumulated Size">{{ classTable.getColumnLabel(1) }}</th>
+          <th on-click="{{changeSort}}" class="clickable" title="Total Accumulated Instances">{{ classTable.getColumnLabel(2) }}</th>
+          <th on-click="{{changeSort}}" class="clickable" title="Old Space Accumulated Size">{{ classTable.getColumnLabel(3) }}</th>
+          <th on-click="{{changeSort}}" class="clickable" title="Old Space Accumulated Instances">{{ classTable.getColumnLabel(4) }}</th>
+          <th on-click="{{changeSort}}" class="clickable" title="Total Current Size">{{ classTable.getColumnLabel(5) }}</th>
+          <th on-click="{{changeSort}}" class="clickable" title="Total Current Instances">{{ classTable.getColumnLabel(6) }}</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr template repeat="{{row in classTable.sortedRows }}">
+          <td><class-ref ref="{{ classTable.getValue(row, 0) }}"></class-ref></td>
+          <td title="{{ classTable.getValue(row, 1) }}">{{ classTable.getFormattedValue(row, 1) }}</td>
+          <td title="{{ classTable.getValue(row, 2) }}">{{ classTable.getFormattedValue(row, 2) }}</td>
+          <td title="{{ classTable.getValue(row, 3) }}">{{ classTable.getFormattedValue(row, 3) }}</td>
+          <td title="{{ classTable.getValue(row, 4) }}">{{ classTable.getFormattedValue(row, 4) }}</td>
+          <td title="{{ classTable.getValue(row, 5) }}">{{ classTable.getFormattedValue(row, 5) }}</td>
+          <td title="{{ classTable.getValue(row, 6) }}">{{ classTable.getFormattedValue(row, 6) }}</td>
+        </tr>
+      </tbody>
+    </table>
   </div>
 </template>
 <script type="application/dart" src="heap_profile.dart"></script>