1/* 2 * Copyright (C) 2011 Google Inc. All rights reserved. 3 * 4 * Redistribution and use in source and binary forms, with or without 5 * modification, are permitted provided that the following conditions 6 * are met: 7 * 1. Redistributions of source code must retain the above copyright 8 * notice, this list of conditions and the following disclaimer. 9 * 2. Redistributions in binary form must reproduce the above copyright 10 * notice, this list of conditions and the following disclaimer in the 11 * documentation and/or other materials provided with the distribution. 12 * 13 * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS'' 14 * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, 15 * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR 16 * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS 17 * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR 18 * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF 19 * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS 20 * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN 21 * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) 22 * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF 23 * THE POSSIBILITY OF SUCH DAMAGE. 24 */ 25 26/* FIXME: This should really be in actions.css. */ 27ul.actions > li { 28 display: inline-block; 29} 30 31ol.notifications { 32 list-style: none; 33 padding: 0; 34 margin: 0; 35} 36 37ol.notifications ul { 38 list-style: none; 39 padding: 0; 40} 41 42ol.notifications > li { 43 display: flex; 44 flex-wrap: wrap; 45 position: relative; 46 width: 100%; 47 padding: 10px; 48 box-sizing: border-box; 49 border-top: 1px solid Gray; 50} 51 52ol.notifications div.how { 53 width: 350px; 54} 55 56ol.notifications div.what { 57 display: -webkit-box; 58 -webkit-box-orient: vertical; 59 padding: 0 0 0 10px; 60 flex: 1; 61} 62 63 ol.notifications > li div.what ul.effects > li.builder { 64 display: inline; 65 padding-right: 5px; 66 } 67 68ol.notifications ul.causes > li, ol.notifications div.problem { 69 display: -webkit-box; 70} 71 72ol.notifications ul.causes div.description, ol.notifications div.problem ul.effects { 73 -webkit-box-flex: 1; 74} 75 76ol.notifications > li div.problem { 77 padding-bottom: 10px; 78} 79 80 ol.notifications > li div.problem > ul.actions { 81 visibility: hidden; 82 } 83 84 ol.notifications > li:hover div.problem > ul.actions { 85 visibility: visible; 86 } 87 88 ol.notifications > li table.failures { 89 opacity: 0.2; 90 -webkit-transition: opacity 0.5s; 91 } 92 93 ol.notifications > li:hover table.failures { 94 opacity: 1; 95 } 96 97ol.notifications > li ul.causes > li > ul.actions { 98} 99 100 ol.notifications > li ul.causes > li > div.description { 101 padding: 0 10px 5px 0; 102 display: -webkit-box; 103 } 104 105 ol.notifications > li ul.causes > li > div.description > a { 106 padding: 5px 10px 5px 10px; 107 margin: -5px 10px -2px 0; 108 border-radius: 4px; 109 display: inline-block; 110 } 111 112 ol.notifications > li ul.causes > li:hover > div.description > a { 113 background-color: #555; 114 color: White; 115 } 116 117 ol.notifications > li ul.causes > li:hover > div.description > a::after { 118 content: ''; 119 width: 0; 120 height: 0; 121 margin-top: 5px; 122 position: absolute; 123 margin-left: 10px; 124 border-top: 5px solid White; 125 border-left: 5px solid #555; 126 border-bottom: 5px solid White; 127 } 128 129 ol.notifications > li ul.causes > li > div.description > span { 130 padding: 0 10px 0 0; 131 display: block; 132 cursor: default; 133 pointer-events: none; 134 -webkit-box-flex: 1; 135 } 136 137 ol.notifications > li ul.causes > li > div.description > span > span.author { 138 padding: 0 0 0 5px; 139 font-style: italic; 140 } 141 142 ol.notifications > li ul.causes > li > div.description > span > span.reviewer { 143 color: Gray; 144 } 145 146 ol.notifications > li ul.causes > li > div.description > span > span.bugID::before { 147 content: '[bug '; 148 padding-left: 8px; 149 } 150 151 ol.notifications > li ul.causes > li > div.description > span > span.bugID::after { 152 content: ']'; 153 } 154 155 ol.notifications > li ul.causes > li > div.description > span > span.bugID > a { 156 cursor: hand; 157 pointer-events: auto; 158 } 159 160 ol.notifications > li ul.causes > li > div.description > span > span.reviewer::before { 161 content: ' ('; 162 } 163 164 ol.notifications > li ul.causes > li > div.description > span > span.reviewer::after { 165 content: ')'; 166 } 167 168 ol.notifications > li ul.causes > li > ul.actions { 169 visibility: hidden; 170 } 171 172 ol.notifications > li ul.causes > li:hover > ul.actions { 173 visibility: visible; 174 } 175 176 ol.notifications > li ul.causes > li li { 177 padding: 10px 0 0 0; 178 display: inline; 179 } 180 181ol.notifications table.failures { 182 border-collapse: collapse; 183 table-layout: fixed; 184 font-size: 11px; 185 width: 350px; 186} 187 188 ol.notifications table.failures thead tr td:first-child { 189 visibility: hidden; 190 } 191 192 ol.notifications table.failures tbody tr { 193 border-top: 1px solid #eee; 194 } 195 196 ol.notifications table.failures tbody td:first-child { 197 width: 20%; 198 } 199 200 ol.notifications table.failures tbody td { 201 width: 40%; 202 padding: 2px; 203 } 204 205 ol.notifications table.failures tbody tr td:first-child { 206 vertical-align: top; 207 } 208 209 ol.notifications table.failures tbody tr td:first-child span { 210 padding: 0 2px; 211 } 212 213 ol.notifications table.failures tbody tr.TIMEOUT td:first-child span { 214 background-color: #fffc6c; 215 } 216 217 ol.notifications table.failures tbody tr.TEXT td:first-child span { 218 background-color: #e98080; 219 } 220 221 ol.notifications table.failures tbody tr.CRASH td:first-child span { 222 background-color: #ffc343; 223 } 224 225 ol.notifications table.failures tbody tr.AUDIO td:first-child span { 226 background-color: #bfdfff; 227 } 228 229 ol.notifications table.failures tbody tr.IMAGE td:first-child span { 230 background-color: #69f; 231 } 232 233 ol.notifications table.failures tbody tr.IMAGE\+TEXT td:first-child span { 234 background-color: #96f; 235 } 236