| OLD | NEW |
| (Empty) | |
| 1 @charset "utf-8"; |
| 2 |
| 3 body { |
| 4 margin:0; |
| 5 } |
| 6 |
| 7 #mocha { |
| 8 font: 20px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif; |
| 9 margin: 60px 50px; |
| 10 } |
| 11 |
| 12 #mocha ul, |
| 13 #mocha li { |
| 14 margin: 0; |
| 15 padding: 0; |
| 16 } |
| 17 |
| 18 #mocha ul { |
| 19 list-style: none; |
| 20 } |
| 21 |
| 22 #mocha h1, |
| 23 #mocha h2 { |
| 24 margin: 0; |
| 25 } |
| 26 |
| 27 #mocha h1 { |
| 28 margin-top: 15px; |
| 29 font-size: 1em; |
| 30 font-weight: 200; |
| 31 } |
| 32 |
| 33 #mocha h1 a { |
| 34 text-decoration: none; |
| 35 color: inherit; |
| 36 } |
| 37 |
| 38 #mocha h1 a:hover { |
| 39 text-decoration: underline; |
| 40 } |
| 41 |
| 42 #mocha .suite .suite h1 { |
| 43 margin-top: 0; |
| 44 font-size: .8em; |
| 45 } |
| 46 |
| 47 #mocha .hidden { |
| 48 display: none; |
| 49 } |
| 50 |
| 51 #mocha h2 { |
| 52 font-size: 12px; |
| 53 font-weight: normal; |
| 54 cursor: pointer; |
| 55 } |
| 56 |
| 57 #mocha .suite { |
| 58 margin-left: 15px; |
| 59 } |
| 60 |
| 61 #mocha .test { |
| 62 margin-left: 15px; |
| 63 overflow: hidden; |
| 64 } |
| 65 |
| 66 #mocha .test.pending:hover h2::after { |
| 67 content: '(pending)'; |
| 68 font-family: arial, sans-serif; |
| 69 } |
| 70 |
| 71 #mocha .test.pass.medium .duration { |
| 72 background: #c09853; |
| 73 } |
| 74 |
| 75 #mocha .test.pass.slow .duration { |
| 76 background: #b94a48; |
| 77 } |
| 78 |
| 79 #mocha .test.pass::before { |
| 80 content: '✓'; |
| 81 font-size: 12px; |
| 82 display: block; |
| 83 float: left; |
| 84 margin-right: 5px; |
| 85 color: #00d6b2; |
| 86 } |
| 87 |
| 88 #mocha .test.pass .duration { |
| 89 font-size: 9px; |
| 90 margin-left: 5px; |
| 91 padding: 2px 5px; |
| 92 color: #fff; |
| 93 -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.2); |
| 94 -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.2); |
| 95 box-shadow: inset 0 1px 1px rgba(0,0,0,.2); |
| 96 -webkit-border-radius: 5px; |
| 97 -moz-border-radius: 5px; |
| 98 -ms-border-radius: 5px; |
| 99 -o-border-radius: 5px; |
| 100 border-radius: 5px; |
| 101 } |
| 102 |
| 103 #mocha .test.pass.fast .duration { |
| 104 display: none; |
| 105 } |
| 106 |
| 107 #mocha .test.pending { |
| 108 color: #0b97c4; |
| 109 } |
| 110 |
| 111 #mocha .test.pending::before { |
| 112 content: '◦'; |
| 113 color: #0b97c4; |
| 114 } |
| 115 |
| 116 #mocha .test.fail { |
| 117 color: #c00; |
| 118 } |
| 119 |
| 120 #mocha .test.fail pre { |
| 121 color: black; |
| 122 } |
| 123 |
| 124 #mocha .test.fail::before { |
| 125 content: '✖'; |
| 126 font-size: 12px; |
| 127 display: block; |
| 128 float: left; |
| 129 margin-right: 5px; |
| 130 color: #c00; |
| 131 } |
| 132 |
| 133 #mocha .test pre.error { |
| 134 color: #c00; |
| 135 max-height: 300px; |
| 136 overflow: auto; |
| 137 } |
| 138 |
| 139 #mocha .test .html-error { |
| 140 overflow: auto; |
| 141 color: black; |
| 142 line-height: 1.5; |
| 143 display: block; |
| 144 float: left; |
| 145 clear: left; |
| 146 font: 12px/1.5 monaco, monospace; |
| 147 margin: 5px; |
| 148 padding: 15px; |
| 149 border: 1px solid #eee; |
| 150 max-width: 85%; /*(1)*/ |
| 151 max-width: -webkit-calc(100% - 42px); |
| 152 max-width: -moz-calc(100% - 42px); |
| 153 max-width: calc(100% - 42px); /*(2)*/ |
| 154 max-height: 300px; |
| 155 word-wrap: break-word; |
| 156 border-bottom-color: #ddd; |
| 157 -webkit-box-shadow: 0 1px 3px #eee; |
| 158 -moz-box-shadow: 0 1px 3px #eee; |
| 159 box-shadow: 0 1px 3px #eee; |
| 160 -webkit-border-radius: 3px; |
| 161 -moz-border-radius: 3px; |
| 162 border-radius: 3px; |
| 163 } |
| 164 |
| 165 #mocha .test .html-error pre.error { |
| 166 border: none; |
| 167 -webkit-border-radius: 0; |
| 168 -moz-border-radius: 0; |
| 169 border-radius: 0; |
| 170 -webkit-box-shadow: 0; |
| 171 -moz-box-shadow: 0; |
| 172 box-shadow: 0; |
| 173 padding: 0; |
| 174 margin: 0; |
| 175 margin-top: 18px; |
| 176 max-height: none; |
| 177 } |
| 178 |
| 179 /** |
| 180 * (1): approximate for browsers not supporting calc |
| 181 * (2): 42 = 2*15 + 2*10 + 2*1 (padding + margin + border) |
| 182 * ^^ seriously |
| 183 */ |
| 184 #mocha .test pre { |
| 185 display: block; |
| 186 float: left; |
| 187 clear: left; |
| 188 font: 12px/1.5 monaco, monospace; |
| 189 margin: 5px; |
| 190 padding: 15px; |
| 191 border: 1px solid #eee; |
| 192 max-width: 85%; /*(1)*/ |
| 193 max-width: -webkit-calc(100% - 42px); |
| 194 max-width: -moz-calc(100% - 42px); |
| 195 max-width: calc(100% - 42px); /*(2)*/ |
| 196 word-wrap: break-word; |
| 197 border-bottom-color: #ddd; |
| 198 -webkit-box-shadow: 0 1px 3px #eee; |
| 199 -moz-box-shadow: 0 1px 3px #eee; |
| 200 box-shadow: 0 1px 3px #eee; |
| 201 -webkit-border-radius: 3px; |
| 202 -moz-border-radius: 3px; |
| 203 border-radius: 3px; |
| 204 } |
| 205 |
| 206 #mocha .test h2 { |
| 207 position: relative; |
| 208 } |
| 209 |
| 210 #mocha .test a.replay { |
| 211 position: absolute; |
| 212 top: 3px; |
| 213 right: 0; |
| 214 text-decoration: none; |
| 215 vertical-align: middle; |
| 216 display: block; |
| 217 width: 15px; |
| 218 height: 15px; |
| 219 line-height: 15px; |
| 220 text-align: center; |
| 221 background: #eee; |
| 222 font-size: 15px; |
| 223 -webkit-border-radius: 15px; |
| 224 -moz-border-radius: 15px; |
| 225 border-radius: 15px; |
| 226 -webkit-transition:opacity 200ms; |
| 227 -moz-transition:opacity 200ms; |
| 228 -o-transition:opacity 200ms; |
| 229 transition: opacity 200ms; |
| 230 opacity: 0.3; |
| 231 color: #888; |
| 232 } |
| 233 |
| 234 #mocha .test:hover a.replay { |
| 235 opacity: 1; |
| 236 } |
| 237 |
| 238 #mocha-report.pass .test.fail { |
| 239 display: none; |
| 240 } |
| 241 |
| 242 #mocha-report.fail .test.pass { |
| 243 display: none; |
| 244 } |
| 245 |
| 246 #mocha-report.pending .test.pass, |
| 247 #mocha-report.pending .test.fail { |
| 248 display: none; |
| 249 } |
| 250 #mocha-report.pending .test.pass.pending { |
| 251 display: block; |
| 252 } |
| 253 |
| 254 #mocha-error { |
| 255 color: #c00; |
| 256 font-size: 1.5em; |
| 257 font-weight: 100; |
| 258 letter-spacing: 1px; |
| 259 } |
| 260 |
| 261 #mocha-stats { |
| 262 position: fixed; |
| 263 top: 15px; |
| 264 right: 10px; |
| 265 font-size: 12px; |
| 266 margin: 0; |
| 267 color: #888; |
| 268 z-index: 1; |
| 269 } |
| 270 |
| 271 #mocha-stats .progress { |
| 272 float: right; |
| 273 padding-top: 0; |
| 274 |
| 275 /** |
| 276 * Set safe initial values, so mochas .progress does not inherit these |
| 277 * properties from Bootstrap .progress (which causes .progress height to |
| 278 * equal line height set in Bootstrap). |
| 279 */ |
| 280 height: auto; |
| 281 -webkit-box-shadow: none; |
| 282 -moz-box-shadow: none; |
| 283 box-shadow: none; |
| 284 background-color: initial; |
| 285 } |
| 286 |
| 287 #mocha-stats em { |
| 288 color: black; |
| 289 } |
| 290 |
| 291 #mocha-stats a { |
| 292 text-decoration: none; |
| 293 color: inherit; |
| 294 } |
| 295 |
| 296 #mocha-stats a:hover { |
| 297 border-bottom: 1px solid #eee; |
| 298 } |
| 299 |
| 300 #mocha-stats li { |
| 301 display: inline-block; |
| 302 margin: 0 5px; |
| 303 list-style: none; |
| 304 padding-top: 11px; |
| 305 } |
| 306 |
| 307 #mocha-stats canvas { |
| 308 width: 40px; |
| 309 height: 40px; |
| 310 } |
| 311 |
| 312 #mocha code .comment { color: #ddd; } |
| 313 #mocha code .init { color: #2f6fad; } |
| 314 #mocha code .string { color: #5890ad; } |
| 315 #mocha code .keyword { color: #8a6343; } |
| 316 #mocha code .number { color: #2f6fad; } |
| 317 |
| 318 @media screen and (max-device-width: 480px) { |
| 319 #mocha { |
| 320 margin: 60px 0px; |
| 321 } |
| 322 |
| 323 #mocha #stats { |
| 324 position: absolute; |
| 325 } |
| 326 } |
| OLD | NEW |