| OLD | NEW |
| (Empty) |
| 1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. | |
| 2 * Use of this source code is governed by a BSD-style license that can be | |
| 3 * found in the LICENSE file. */ | |
| 4 | |
| 5 body { | |
| 6 font-size: 84%; | |
| 7 margin: 0; | |
| 8 min-width: 45em; | |
| 9 padding: 0.75em; | |
| 10 } | |
| 11 | |
| 12 h1 { | |
| 13 color: rgb(74, 142, 230); | |
| 14 font-size: 110%; | |
| 15 font-weight: bold; | |
| 16 letter-spacing: -1px; | |
| 17 margin: 0; | |
| 18 padding: 0; | |
| 19 } | |
| 20 | |
| 21 h2 { | |
| 22 border-top: 1px solid rgb(58, 117, 189); | |
| 23 color: rgb(58, 117, 189); | |
| 24 font-size: 110%; | |
| 25 font-weight: normal; | |
| 26 letter-spacing: -1px; | |
| 27 margin: 0; | |
| 28 margin-left: -38px; | |
| 29 padding: 0.5em 1em 0.5em 38px; | |
| 30 } | |
| 31 | |
| 32 h2:first-child { | |
| 33 border-top: 0; | |
| 34 padding-top: 0; | |
| 35 } | |
| 36 | |
| 37 span.th { | |
| 38 padding-left: 0.35em; | |
| 39 } | |
| 40 | |
| 41 a { | |
| 42 color: black; | |
| 43 } | |
| 44 | |
| 45 div#header { | |
| 46 background: rgb(82, 150, 222); | |
| 47 background-size: 100%; | |
| 48 border: 1px solid rgb(58, 117, 189); | |
| 49 border-radius: 6px; | |
| 50 color: white; | |
| 51 margin-bottom: 0.75em; | |
| 52 overflow: hidden; | |
| 53 padding: 0.5em 0; | |
| 54 position: relative; | |
| 55 text-shadow: 0 0 2px black; | |
| 56 } | |
| 57 | |
| 58 div#header h1 { | |
| 59 color: white; | |
| 60 display: inline; | |
| 61 } | |
| 62 | |
| 63 div#header h1::before { | |
| 64 /* grit doesn't flatten -webkit-mask, so define the properties separately | |
| 65 * for now. */ | |
| 66 -webkit-mask-image: url(../../../ui/webui/resources/images/settings.svg); | |
| 67 -webkit-mask-position: center; | |
| 68 -webkit-mask-repeat: no-repeat; | |
| 69 -webkit-mask-size: 24px; | |
| 70 background-color: white; | |
| 71 content: ''; | |
| 72 display: inline-block; | |
| 73 height: 20px; | |
| 74 vertical-align: middle; | |
| 75 width: 37px; | |
| 76 } | |
| 77 | |
| 78 div#header p { | |
| 79 color: white; | |
| 80 display: inline; | |
| 81 font-size: 84%; | |
| 82 font-style: italic; | |
| 83 margin: 0; | |
| 84 padding: 0; | |
| 85 padding-left: 0.4em; | |
| 86 } | |
| 87 | |
| 88 div#header div.navigation { | |
| 89 font-size: 92%; | |
| 90 line-height: 3.5em; | |
| 91 position: absolute; | |
| 92 right: 1em; | |
| 93 top: 0; | |
| 94 } | |
| 95 | |
| 96 div#header select { | |
| 97 border: 1px solid rgb(58, 117, 189); | |
| 98 color: rgb(49, 93, 148); | |
| 99 font-size: 100%; | |
| 100 line-height: 140%; | |
| 101 } | |
| 102 | |
| 103 div#header select option { | |
| 104 padding: 0 0.2em; | |
| 105 } | |
| 106 | |
| 107 div#sidebar { | |
| 108 border-right: 1px solid #cfcfcf; | |
| 109 display: none; | |
| 110 float: left; | |
| 111 margin-left: 26px; | |
| 112 min-height: 20em; | |
| 113 padding: 0.75em; | |
| 114 padding-top: 0; | |
| 115 width: 45em; | |
| 116 } | |
| 117 | |
| 118 div#content { | |
| 119 margin-left: 0; | |
| 120 } | |
| 121 | |
| 122 hr { | |
| 123 display: inline; | |
| 124 padding: 0 0.5em; | |
| 125 visibility: hidden; | |
| 126 } | |
| 127 | |
| 128 .k { | |
| 129 font-weight: normal; | |
| 130 opacity: 0.4; | |
| 131 padding-left: 0.1em; | |
| 132 } | |
| 133 | |
| 134 .legend { | |
| 135 color: #7f7f7f; | |
| 136 font-size: 84%; | |
| 137 line-height: 140%; | |
| 138 margin-top: 2em; | |
| 139 padding: 0.4em 0 0; | |
| 140 text-align: right; | |
| 141 } | |
| 142 | |
| 143 .legend h3 { | |
| 144 color: black; | |
| 145 display: inline; | |
| 146 font-size: 100%; | |
| 147 font-weight: normal; | |
| 148 margin: 0; | |
| 149 padding: 0 0.5em 0 0; | |
| 150 } | |
| 151 | |
| 152 .legend .swatch { | |
| 153 display: inline-block; | |
| 154 height: 0.9em; | |
| 155 margin-right: 0.2em; | |
| 156 opacity: 0.66; | |
| 157 padding: 0 0.5em; | |
| 158 } | |
| 159 | |
| 160 table.list { | |
| 161 border-collapse: collapse; | |
| 162 font-size: 84%; | |
| 163 line-height: 200%; | |
| 164 table-layout: fixed; | |
| 165 width: 100%; | |
| 166 } | |
| 167 | |
| 168 table.list:not([class*='filtered']) tr:nth-child(odd) td { | |
| 169 background: rgb(239, 243, 255); | |
| 170 } | |
| 171 | |
| 172 .hidden { | |
| 173 display: none; | |
| 174 } | |
| 175 | |
| 176 table.list th { | |
| 177 color: black; | |
| 178 font-weight: bold; | |
| 179 padding: 0 0.5em; | |
| 180 vertical-align: top; | |
| 181 white-space: nowrap; | |
| 182 } | |
| 183 | |
| 184 table.list .firstRow th { | |
| 185 line-height: 100%; | |
| 186 text-align: left; | |
| 187 } | |
| 188 | |
| 189 table.list .secondRow * { | |
| 190 border-bottom: 1px solid rgb(181, 198, 222); | |
| 191 text-align: left; | |
| 192 } | |
| 193 | |
| 194 table.list td { | |
| 195 line-height: 1.4em; | |
| 196 padding: 0.35em 0.5em 0; | |
| 197 vertical-align: top; | |
| 198 } | |
| 199 | |
| 200 table.list tr td:nth-last-child(1), | |
| 201 table.list tr th:nth-last-child(1) { | |
| 202 padding-right: 1em; | |
| 203 } | |
| 204 | |
| 205 table.list:not([class*='filtered']) .tab .name { | |
| 206 padding-left: 1.5em; | |
| 207 } | |
| 208 | |
| 209 table.list .name { | |
| 210 width: 100%; | |
| 211 } | |
| 212 | |
| 213 table.list .name div { | |
| 214 height: 1.6em; | |
| 215 overflow: hidden; | |
| 216 text-overflow: ellipsis; | |
| 217 white-space: nowrap; | |
| 218 } | |
| 219 | |
| 220 table.list .pid { | |
| 221 text-align: right; | |
| 222 width: 4em; | |
| 223 } | |
| 224 | |
| 225 table.list .pid .th { | |
| 226 padding: 0; | |
| 227 } | |
| 228 | |
| 229 table.list .type { | |
| 230 width: 5em; | |
| 231 } | |
| 232 | |
| 233 table.list .number { | |
| 234 text-align: right; | |
| 235 width: 7em; | |
| 236 } | |
| 237 | |
| 238 table.list .total { | |
| 239 font-weight: bold; | |
| 240 } | |
| 241 | |
| 242 table.list .total .name { | |
| 243 color: rgb(49, 93, 148); | |
| 244 text-align: right; | |
| 245 } | |
| 246 | |
| 247 table.list .total td { | |
| 248 background: white !important; | |
| 249 border-top: 1px solid rgb(181, 198, 222); | |
| 250 } | |
| 251 | |
| 252 table.list .noResults { | |
| 253 display: none; | |
| 254 } | |
| 255 | |
| 256 table.list.noResults .noResults { | |
| 257 display: table-row; | |
| 258 } | |
| 259 | |
| 260 table.list .noResults td { | |
| 261 color: #3f3f3f; | |
| 262 padding: 3em 0; | |
| 263 text-align: center; | |
| 264 } | |
| 265 | |
| 266 table.list#browserComparison .name { | |
| 267 background-position: 5px center; | |
| 268 background-repeat: no-repeat; | |
| 269 padding-left: 25px; | |
| 270 } | |
| 271 | |
| 272 div.help { | |
| 273 -webkit-mask-box-image: url(../../../ui/webui/resources/images/help.svg); | |
| 274 background-color: rgb(66, 133, 244); | |
| 275 display: inline-block; | |
| 276 height: 16px; | |
| 277 margin: -1px 0 0 0; | |
| 278 opacity: 0.33; | |
| 279 vertical-align: bottom; | |
| 280 width: 16px; | |
| 281 } | |
| 282 | |
| 283 div.help:hover { | |
| 284 opacity: 1; | |
| 285 } | |
| 286 | |
| 287 div.help div { | |
| 288 display: none; | |
| 289 } | |
| 290 | |
| 291 #helpTooltip { | |
| 292 background: rgb(214, 232, 255); | |
| 293 border: 1px solid rgb(168, 207, 255); | |
| 294 border-radius: 0; | |
| 295 box-shadow: 3px 3px 4px rgba(0, 0, 0, 0.33); | |
| 296 font-size: 92%; | |
| 297 line-height: 140%; | |
| 298 max-width: 30em; | |
| 299 padding: 0.3em 0.8em; | |
| 300 position: absolute; | |
| 301 z-index: 1000; | |
| 302 } | |
| 303 | |
| 304 #helpTooltip p { | |
| 305 margin: 0.6em 0; | |
| 306 } | |
| 307 | |
| 308 div.otherbrowsers { | |
| 309 font-size: 84%; | |
| 310 text-align: center; | |
| 311 width: 100%; | |
| 312 } | |
| OLD | NEW |