| OLD | NEW |
| (Empty) |
| 1 /* Copyright 2013 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 #about-info { | |
| 6 -webkit-column-width: 350px; | |
| 7 } | |
| 8 | |
| 9 #about-info > div { | |
| 10 -webkit-column-break-inside: avoid; | |
| 11 width: 350px; | |
| 12 } | |
| 13 | |
| 14 #about-info h2 { | |
| 15 color: rgb(74, 142, 230); | |
| 16 font-size: 100%; | |
| 17 margin-bottom: 0; | |
| 18 } | |
| 19 | |
| 20 #about-info .err { | |
| 21 color: red; | |
| 22 } | |
| 23 | |
| 24 #about-info .section { | |
| 25 display: inline-block; | |
| 26 margin-left: auto; | |
| 27 margin-right: auto; | |
| 28 } | |
| 29 | |
| 30 .about-details { | |
| 31 width: 100%; | |
| 32 } | |
| 33 | |
| 34 .about-details tr:nth-child(odd) { | |
| 35 background: rgb(239, 243, 255); | |
| 36 } | |
| 37 | |
| 38 #typeInfo .error { | |
| 39 background: rgb(255, 204, 204); | |
| 40 } | |
| 41 | |
| 42 #typeInfo .warning { | |
| 43 background: rgb(255, 255, 204); | |
| 44 } | |
| 45 | |
| 46 #typeInfo .disabled { | |
| 47 background: rgb(224, 224, 224); | |
| 48 } | |
| 49 | |
| 50 #typeInfo .ok { | |
| 51 background: rgb(204, 255, 204); | |
| 52 } | |
| 53 | |
| 54 @-webkit-keyframes highlight1 { | |
| 55 0% { | |
| 56 background: rgb(255, 255, 0); | |
| 57 } | |
| 58 100% { | |
| 59 background: #fff; | |
| 60 } | |
| 61 } | |
| 62 | |
| 63 @-webkit-keyframes highlight2 { | |
| 64 0% { | |
| 65 background: rgb(155, 158, 166); | |
| 66 } | |
| 67 100% { | |
| 68 background: rgb(239, 243, 255); | |
| 69 } | |
| 70 } | |
| 71 | |
| 72 .about-details [highlighted] { | |
| 73 -webkit-animation-duration: 3s; | |
| 74 -webkit-animation-name: highlight1; | |
| 75 -webkit-animation-timing-function: linear; | |
| 76 } | |
| 77 | |
| 78 .about-details [highlighted]:nth-child(odd) { | |
| 79 -webkit-animation-duration: 3s; | |
| 80 -webkit-animation-name: highlight2; | |
| 81 -webkit-animation-timing-function: linear; | |
| 82 } | |
| 83 | |
| 84 .about-details .uninitialized { | |
| 85 color: #7f7f7f; | |
| 86 } | |
| 87 | |
| 88 #status { | |
| 89 margin-left: auto; | |
| 90 margin-right: auto; | |
| 91 text-align: center; | |
| 92 width: 300px; | |
| 93 } | |
| 94 | |
| 95 #dump-status { | |
| 96 margin: 2px; | |
| 97 } | |
| 98 | |
| 99 #import-status { | |
| 100 margin: 2px; | |
| 101 } | |
| 102 | |
| 103 #traffic-event-container { | |
| 104 border: 1px solid; | |
| 105 height: 500px; | |
| 106 max-width: 500px; | |
| 107 overflow-y: auto; | |
| 108 } | |
| 109 | |
| 110 .traffic-event-entry { | |
| 111 border: 2px outset; | |
| 112 padding: 0.5em; | |
| 113 } | |
| 114 | |
| 115 .traffic-event-entry:hover { | |
| 116 background-color: #eee; | |
| 117 } | |
| 118 | |
| 119 .traffic-event-entry .time { | |
| 120 color: #222; | |
| 121 } | |
| 122 | |
| 123 .traffic-event-entry .type { | |
| 124 font-weight: bold; | |
| 125 margin: 0.5em; | |
| 126 white-space: nowrap; | |
| 127 } | |
| 128 | |
| 129 .traffic-event-entry .details { | |
| 130 margin: 0.5em; | |
| 131 overflow-x: auto; | |
| 132 } | |
| 133 | |
| 134 .traffic-event-entry .proto { | |
| 135 display: none; | |
| 136 } | |
| 137 | |
| 138 .traffic-event-entry-expanded .proto { | |
| 139 background-color: #fff; | |
| 140 border: 1px solid #222; | |
| 141 display: block; | |
| 142 max-height: 300px; | |
| 143 overflow-x: auto; | |
| 144 overflow-y: auto; | |
| 145 } | |
| OLD | NEW |