1<!-- Copyright 2020 the V8 project authors. All rights reserved. 2Use of this source code is governed by a BSD-style license that can be 3found in the LICENSE file. --> 4<style> 5#dataSelectionSection { 6 display: none; 7} 8 9.box { 10 border-left: dashed 1px #666666; 11 border-right: dashed 1px #666666; 12 border-bottom: dashed 1px #666666; 13 padding: 10px; 14 overflow: hidden; 15 position: relative; 16} 17 18.box:nth-of-type(1) { 19 border-top: dashed 1px #666666; 20 border-radius: 5px 5px 0px 0px; 21} 22 23.box:last-of-type { 24 border-radius: 0px 0px 5px 5px; 25} 26 27.box > ul { 28 margin: 0px; 29 padding: 0px; 30} 31 32.box > ul > li { 33 display: inline-block; 34} 35 36.box > ul > li:not(:first-child) { 37 margin-left: 10px; 38} 39 40.box > ul > li:first-child { 41 font-weight: bold; 42} 43 44.zonesSelectBox { 45 position: relative; 46 overflow: hidden; 47 float: left; 48 padding: 0px 5px 2px 0px; 49 margin: 3px; 50 border-radius: 3px; 51} 52 53.zonesSelectBox > label { 54 font-size: xx-small; 55} 56 57.zonesSelectBox > input { 58 vertical-align: middle; 59} 60 61.percentBackground { 62 position: absolute; 63 width: 200%; 64 height: 100%; 65 left: 0%; 66 top: 0px; 67 margin-left: -100%; 68 transition: all 1s ease-in-out; 69} 70 71.zonesSelectBox > .percentBackground { 72 background: linear-gradient(90deg, #68b0f7 50%, #b3d9ff 50%); 73 z-index: -1; 74} 75.box > .percentBackground { 76 background: linear-gradient(90deg, #e0edfe 50%, #fff 50%); 77 z-index: -2; 78} 79 80#categories { 81 margin-top: 10px; 82} 83 84#category-filter { 85 text-align: right; 86 width: 50px; 87} 88 89</style> 90<section id="dataSelectionSection"> 91 <h2>Data selection</h2> 92 <ul> 93 <li> 94 <label for="isolate-select"> 95 Isolate 96 </label> 97 <select id="isolate-select"> 98 <option>No data</option> 99 </select> 100 </li> 101 <li> 102 <label for="data-view-select"> 103 Data view 104 </label> 105 <select id="data-view-select"> 106 <option>No data</option> 107 </select> 108 </li> 109 <li> 110 <label for="show-totals-select"> 111 Show total allocated/used zone memory 112 </label> 113 <input type="checkbox" id="show-totals-select" checked> 114 </li> 115 <li> 116 <label for="data-kind-select"> 117 Data kind 118 </label> 119 <select id="data-kind-select"> 120 <option>No data</option> 121 </select> 122 </li> 123 <li> 124 <label for="time-start-select"> 125 Time start 126 </label> 127 <input type="number" id="time-start-select" value="0">ms</input> 128 </li> 129 <li> 130 <label for="time-end-select"> 131 Time end 132 </label> 133 <input type="number" id="time-end-select" value="0">ms</input> 134 </li> 135 <li> 136 <label for="memory-usage-sample-select"> 137 Memory usage sample (at a specific time in ms) 138 </label> 139 <select id="memory-usage-sample-select"> 140 <option>No data</option> 141 </select> 142 </li> 143 </ul> 144 145 <div id="categories"></div> 146</section> 147