132 lines
2.7 KiB
HTML
132 lines
2.7 KiB
HTML
<style>
|
|
cr-tab-box {
|
|
--tabs-background-color: white;
|
|
}
|
|
|
|
.uma-callout {
|
|
font-style: italic;
|
|
}
|
|
|
|
th {
|
|
text-align: start;
|
|
}
|
|
|
|
.uma-header-type {
|
|
min-width: 100px;
|
|
}
|
|
|
|
.uma-header-hash {
|
|
min-width: 300px;
|
|
}
|
|
|
|
.uma-header-timestamp {
|
|
min-width: 140px;
|
|
}
|
|
|
|
.uma-header-size {
|
|
min-width: 70px;
|
|
}
|
|
|
|
.uma-header-status {
|
|
min-width: 500px;
|
|
}
|
|
|
|
.uma-log-events {
|
|
width: 100%;
|
|
}
|
|
|
|
.uma-log-events-peek {
|
|
display: flex;
|
|
}
|
|
|
|
.uma-log-events-peek:hover {
|
|
background-color: #eee;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.uma-log-events pre {
|
|
display: none;
|
|
margin: 0;
|
|
}
|
|
|
|
.uma-log-events-expanded pre {
|
|
display: block;
|
|
max-height: 100px;
|
|
min-height: 20px;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
.uma-log-events .expand-or-collapse-icon {
|
|
content: url(chrome://resources/images/icon_expand_more.svg);
|
|
margin-inline-start: auto;
|
|
width: 15px;
|
|
}
|
|
|
|
.uma-log-events-expanded .expand-or-collapse-icon {
|
|
content: url(chrome://resources/images/icon_expand_less.svg);
|
|
}
|
|
|
|
tbody tr:nth-child(odd) {
|
|
background: rgb(239, 243, 255);
|
|
}
|
|
|
|
#export-uma-logs {
|
|
margin-top: 10px;
|
|
}
|
|
</style>
|
|
<cr-tab-box>
|
|
<div slot="tab">UMA</div>
|
|
<div slot="panel">
|
|
<h2>UMA Summary</h2>
|
|
<table>
|
|
<tbody id="uma-summary-body"></tbody>
|
|
</table>
|
|
<h2>Logs</h2>
|
|
<div id="uma-table-caption" class="uma-callout"></div>
|
|
<div class="uma-callout">Proto data is available by exporting.</div>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th class="uma-header-type">Type</th>
|
|
<th class="uma-header-hash">Hash</th>
|
|
<th class="uma-header-timestamp">Closed Timestamp</th>
|
|
<th class="uma-header-size">Size</th>
|
|
<th class="uma-header-status">Status</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="uma-logs-body"></tbody>
|
|
</table>
|
|
<button id="export-uma-logs">Export logs</button>
|
|
</div>
|
|
<div slot="tab">Variations</div>
|
|
<div slot="panel">
|
|
<h2>Variations Summary</h2>
|
|
<table>
|
|
<tbody id="variations-summary-body"></tbody>
|
|
</table>
|
|
</div>
|
|
</cr-tab-box>
|
|
<template id="uma-log-row-template">
|
|
<tr>
|
|
<td><!-- Type --></td>
|
|
<td><!-- Hash --></td>
|
|
<td><!-- Closed Timestamp --></td>
|
|
<td><!-- Size -->/td>
|
|
<td>
|
|
<!-- Status -->
|
|
<div class="uma-log-events">
|
|
<div class="uma-log-events-peek">
|
|
<span class="uma-log-events-peek-text"></span>
|
|
<span class="expand-or-collapse-icon"></span>
|
|
</div>
|
|
<pre class="uma-log-events-text"></pre>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</template>
|
|
<template id="summary-row-template">
|
|
<tr>
|
|
<td><!-- Key --></td>
|
|
<td><!-- Value --></td>
|
|
</tr>
|
|
</template> |