main.css revision 3345a6884c488ff3a535c2c9acdd33d74b37e311
1/* 2Copyright (c) 2010 The Chromium Authors. All rights reserved. 3Use of this source code is governed by a BSD-style license that can be 4found in the LICENSE file. 5*/ 6 7* { 8 -webkit-box-sizing: border-box; 9 -moz-box-sizing: border-box; 10} 11body { 12 font-family: sans-serif; 13} 14 15#filterBox { 16 background: #efefef; 17 padding: 5px; 18 border-bottom: 1px solid gray; 19 overflow: hidden; 20} 21 22#filterBox * { 23 white-space: nowrap; 24 font-family: sans-serif; 25 font-size: 12px; 26} 27 28#filterBox input { 29 width: 100%; 30} 31 32#actionBox { 33 background: #efefef; 34 white-space: nowrap; 35 border-top: 1px solid gray; 36 overflow: hidden; 37} 38 39#eventsBox { 40 overflow-x: hidden; 41 overflow-y: auto 42} 43 44#detailsBox { 45 overflow: auto; 46} 47 48#splitterBox { 49 background: #bfbfbf; 50 border-left: 1px inset black; 51 border-right: 1px solid black; 52 position:absolute; 53 width: 8px; 54 cursor: col-resize; 55 user-select: none; 56} 57 58#eventsListTable { 59 cursor: pointer; 60} 61 62#eventsListTable thead td { 63 text-align: left; 64 font-weight: bold; 65 background: rgb(229, 236, 249); 66} 67 68#eventsListTable td { 69 padding: 3px; 70 border-left: 1px solid #afafaf; 71 border-bottom: 1px solid #afafaf; 72 text-overflow: ellipsis; 73 font-size: 12px; 74 white-space: nowrap; 75} 76 77#eventsListTableBody .mouseover { 78 background: rgb(244,244,255); 79} 80 81#eventsListTableBody .selected, 82#eventsListTableBody .mouseover .selected { 83 background: #C3D9FF; 84} 85 86#eventsListTableBody .source_CONNECT_JOB { 87 color: blue; 88} 89 90#eventsListTableBody .source_HOST_RESOLVER_IMPL_JOB, 91#eventsListTableBody .source_HOST_RESOLVER_IMPL_REQUEST { 92 color: #308080; 93} 94 95#eventsListTableBody .source_SOCKET { 96 color: purple; 97} 98 99#eventsListTableBody .source_INIT_PROXY_RESOLVER { 100 color: green; 101} 102 103#eventsListTableBody .source_NONE { 104 color: red; 105} 106 107.tabSwitcher { 108 margin-top: 10px; 109 margin-left: 10px; 110} 111 112.tabSwitcher th { 113 background: rgb(229,236,249); 114 cursor: pointer; 115 background-clip: border-box; 116 border-top-left-radius: 5px 5px; 117 border-top-right-radius: 5px 5px; 118 padding-left: 4px; 119 padding-top: 4px; 120 padding-right: 4px; 121 font-size: 12px; 122 margin-left: 30px; 123} 124 125.tabSwitcher th.selected, .tabSwitcherLine { 126 background: rgb(195,217,255); 127} 128 129.tabSwitcherLine { 130 height: 10px; 131} 132 133#detailsTabHandles { 134 border: 1px solid white; 135} 136 137.logSourceEntry { 138 margin: 5px; 139} 140 141.logSourceEntry * p { 142 font-weight: bold; 143 font-size: 12px; 144} 145 146.logSourceEntry * td { 147 font-size: 10px; 148} 149 150#categoryTabHandles ul { 151 list-style: none; 152 padding: 0; 153 margin: 0; 154} 155 156#categoryTabHandles { 157 border-bottom: 1px solid #555; 158 background: #aaa; 159 overflow: hidden; 160} 161 162#categoryTabHandles li { 163 float: left; 164 margin-left: 5px; 165} 166 167#categoryTabHandles a { 168 text-decoration: none; 169 text-align: center; 170 display: inline-block; 171 margin-top: 4px; 172 padding: 5px 10px 3px 10px; 173 -webkit-border-top-right-radius: 8px; 174 -webkit-border-top-left-radius: 8px; 175 background-clip: border-box; 176 background: #ccc; 177} 178 179#categoryTabHandles a:hover { 180 background: #eee; 181} 182 183#categoryTabHandles a:visited, 184#categoryTabHandles a { 185 color: blue; 186} 187 188#categoryTabHandles .selected { 189 background: white; 190} 191 192#categoryTabHandles a.selected { 193 position:relative; 194 top: 3px; 195 color: black; 196} 197 198#detailsLogBox, 199#detailsTimelineBox, 200#httpCacheTabContent, 201#proxyTabContent, 202#dataTabContent, 203#dnsTabContent, 204#socketsTabContent, 205#serviceProvidersTabContent, 206#testTabContent { 207 overflow: auto; 208 padding: 10px; 209} 210 211#proxyTabContent td, 212#proxyTabContent th { 213 font-size: 12px; 214} 215 216/* 217 * Styles for TABLE that uses a thin collapsed border. 218 */ 219table.styledTable { 220 border-collapse:collapse; 221} 222 223table.styledTable, 224.styledTable th, 225.styledTable td { 226 border: 1px solid #777; 227 padding-right: 4px; 228 padding-left: 4px; 229} 230 231.styledTable th { 232 background: rgb(224,236,255); 233} 234 235.styledTable th.title { 236 background: rgb(255,217,217); 237} 238 239/* 240 * This is the box in the top right of the Data tab which shows how many 241 * events have been captured so far. 242 */ 243.capturingBox { 244 border: 1px dashed black; 245 display: inline-block; 246 text-align: left; 247 padding: 5px; 248} 249 250/** 251 * Styling for an emphasized button. 252 */ 253.bigButton { 254 font-size: 100%; 255 font-weight: bold; 256} 257