1/*
2 * Copyright (C) 2013 Apple 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.content-view.log {
27    overflow-y: overlay;
28    overflow-x: hidden;
29}
30
31.console-messages {
32    display: -webkit-flex;
33    -webkit-flex-direction: column;
34
35    word-wrap: break-word;
36
37    font-family: Menlo, monospace;
38    font-size: 11px;
39
40    min-height: 100%;
41}
42
43.console-messages > :first-child {
44    margin-top: auto;
45}
46
47.console-item {
48    border-top: 1px solid rgb(240, 240, 240);
49}
50
51.console-group.new-session .console-group-messages .console-item:first-child {
52    border-top: none;
53}
54
55.console-item.selected {
56    background-color: rgb(212, 212, 212);
57}
58
59.console-messages:focus .console-item.selected {
60    background-color: highlight;
61}
62
63.console-user-command-result.console-log-level::before {
64    background-image: url(../Images/UserInputResult.svg);
65}
66
67.console-message, .console-user-command {
68    position: relative;
69    padding: 2px 12px 2px 18px;
70    min-height: 16px;
71}
72
73.console-message::before, .console-user-command::before, .javascript-prompt::before, .console-group-title::before {
74    position: absolute;
75    display: block;
76    content: "";
77    left: 4px;
78    top: 8px;
79    width: 10px;
80    height: 10px;
81    margin-top: -5px;
82}
83
84.console-message .bubble {
85    display: inline-block;
86    height: 14px;
87    background-color: rgb(128, 151, 189);
88    vertical-align: middle;
89    white-space: nowrap;
90    padding: 1px 4px;
91    margin-top: -2px;
92    margin-right: 4px;
93    margin-left: -18px;
94    text-align: left;
95    font-size: 11px;
96    line-height: normal;
97    font-weight: bold;
98    text-shadow: none;
99    color: white;
100    border-radius: 7px;
101
102    float: left;
103    margin-top: 0;
104    margin-left: 2px;
105}
106
107.console-message-text {
108    white-space: pre-wrap;
109}
110
111.console-message-text > span {
112    -webkit-user-select: text;
113}
114
115.console-group-title {
116    font-weight: bold;
117}
118
119.console-group-title::before {
120    background-image: -webkit-canvas(disclosure-triangle-small-open-normal);
121    background-size: 13px 13px;
122    top: 6px;
123    width: 13px;
124    height: 13px;
125    left: 3px;
126}
127
128.console-group.collapsed .console-group-title::before {
129    background-image: -webkit-canvas(disclosure-triangle-small-closed-normal);
130}
131
132.console-group.collapsed > .console-group-messages {
133    display: none;
134}
135
136.console-group {
137    position: relative;
138}
139
140.console-group.new-session {
141    border-top: 3px dashed rgb(240, 240, 240);
142}
143
144.console-error-level .console-message-text, .console-error-level .section .header .title {
145    color: red !important;
146}
147
148.console-debug-level .console-message-text {
149    color: blue;
150}
151
152.console-debug-level::before {
153    background-color: blue;
154}
155
156.console-error-level::before {
157    background-image: url(../Images/Error.svg);
158    background-size: 10px 10px;
159}
160
161.console-warning-level::before {
162    background-image: url(../Images/Warning.svg);
163    background-size: 10px 10px;
164}
165
166.console-user-command .console-message {
167    margin-left: -24px;
168    padding-right: 0;
169}
170
171.console-user-command::before {
172    background-image: url(../Images/UserInputPromptPrevious.svg);
173}
174
175.console-user-command > .console-message-text {
176    color: rgb(0, 128, 255);
177}
178
179.console-messages a {
180    color: rgb(33%, 33%, 33%);
181    cursor: pointer;
182}
183
184.console-messages a:hover {
185    color: rgb(15%, 15%, 15%);
186}
187
188.console-message-url {
189    float: right;
190    margin-left: 4px;
191    font-weight: normal;
192}
193
194.console-group-messages .section {
195    margin: 0 0 0 12px !important;
196}
197
198.console-group-messages .section .header {
199    padding: 0 8px 0 0;
200    background-image: none;
201    border: none;
202    min-height: 0;
203}
204
205.console-group-messages .section .header::before {
206    top: 2px;
207    left: 1px;
208}
209
210.console-group-messages .section .header .title {
211    color: black;
212    font-weight: normal;
213    line-height: normal;
214}
215
216.console-group-messages .section .properties li .info {
217    padding-top: 0;
218    padding-bottom: 0;
219    color: rgb(60%, 60%, 60%);
220}
221
222.console-group-messages .outline-disclosure {
223    outline: none;
224    padding-left: 0;
225}
226
227.console-group-messages .outline-disclosure > ol {
228    padding: 0 0 0 12px !important;
229}
230
231.console-group-messages .outline-disclosure, .console-group-messages .outline-disclosure ol {
232    font-size: inherit;
233    line-height: 12px;
234}
235
236.console-group-messages .outline-disclosure.single-node li {
237    padding-left: 2px;
238}
239
240.console-group-messages .outline-disclosure li .selection {
241    margin-left: -6px;
242    margin-right: -6px;
243}
244
245.console-group-messages .add-attribute {
246    display: none;
247}
248
249.console-formatted-object, .console-formatted-node {
250    position: relative;
251    display: inline-block;
252    vertical-align: top;
253    color: black;
254}
255
256.console-formatted-object .section, .console-formatted-node .section {
257    position: static;
258}
259
260.console-formatted-object .properties, .console-formatted-node .properties {
261    padding-left: 0 !important;
262}
263
264.console-formatted-number {
265    color: rgb(28, 0, 207);
266}
267
268.console-formatted-string, .console-formatted-regexp {
269    white-space: pre;
270}
271
272.console-formatted-string {
273    color: rgb(196, 26, 22);
274}
275
276.console-formatted-regexp {
277    color: rgb(255, 88, 0);
278}
279
280.console-formatted-null, .console-formatted-undefined {
281    color: rgb(128, 128, 128);
282}
283
284.error-message {
285    color: red;
286}
287
288.auto-complete-text, .editing .auto-complete-text {
289    color: rgb(128, 128, 128) !important;
290    -webkit-user-modify: read-only;
291}
292
293.outline-disclosure li.hovered:not(.selected) .selection {
294    display: block;
295    left: 3px;
296    right: 3px;
297    background-color: rgba(56, 121, 217, 0.1);
298    border-radius: 5px;
299}
300
301.outline-disclosure li.highlighted .highlight {
302    background-color: rgb(255, 230, 179);
303    border-radius: 4px;
304    padding-bottom: 2px;
305    margin-bottom: -2px;
306}
307
308.outline-disclosure li.selected.highlighted .highlight {
309    background-color: transparent;
310    padding-bottom: 0;
311    margin-bottom: 0;
312}
313
314.outline-disclosure li .selection {
315    display: none;
316    position: absolute;
317    left: 0;
318    right: 0;
319    height: 15px;
320    z-index: -1;
321}
322
323.outline-disclosure li.selected .selection {
324    display: block;
325    background-color: rgb(212, 212, 212);
326}
327
328.outline-disclosure li.elements-drag-over .selection {
329    display: block;
330    margin-top: -2px;
331    border-top: 2px solid rgb(56, 121, 217);
332}
333
334.outline-disclosure ol:focus li.selected .selection {
335    background-color: rgb(56, 121, 217);
336}
337
338.outline-disclosure ol.search-match-not-found li.selected .selection {
339    border: 1px solid rgb(56, 121, 217);
340    background-color: white;
341}
342
343.outline-disclosure {
344    font-size: 11px;
345}
346
347.outline-disclosure > ol {
348    position: relative;
349    padding: 2px 6px !important;
350    margin: 0;
351    color: black;
352    cursor: default;
353    min-width: 100%;
354}
355
356.outline-disclosure, .outline-disclosure ol {
357    list-style-type: none;
358    -webkit-padding-start: 12px;
359    margin: 0;
360}
361
362.outline-disclosure li {
363    padding: 0 0 0 14px;
364    margin-top: 1px;
365    margin-bottom: 1px;
366    margin-left: -2px;
367    word-wrap: break-word;
368}
369
370.outline-disclosure li.parent {
371    margin-left: -12px
372}
373
374.outline-disclosure li .webkit-html-tag.close {
375    margin-left: -12px;
376}
377
378.outline-disclosure li.parent::before {
379    float: left;
380
381    content: "";
382
383    background-image: -webkit-canvas(disclosure-triangle-tiny-closed-normal);
384    background-size: 8px 8px;
385    background-repeat: no-repeat;
386
387    width: 8px;
388    height: 8px;
389
390    margin-top: 2px;
391    padding-right: 2px;
392}
393
394.outline-disclosure li.parent.expanded::before {
395    background-image: -webkit-canvas(disclosure-triangle-tiny-open-normal);
396}
397
398.outline-disclosure ol.children {
399    display: none;
400}
401
402.outline-disclosure ol.children.expanded {
403    display: block;
404}
405
406.webkit-html-fragment.shadow {
407    opacity: 0.6;
408}
409
410.console-item.filtered-out {
411    display: none;
412}
413
414.search-bar.log-search-bar > input[type="search"] {
415    width: 150px;
416    border: 1px solid rgba(0, 0, 0, 0.35);
417    padding-left: 4px;
418}
419
420body.mac-platform.legacy .search-bar.log-search-bar > input[type="search"] {
421    padding-left: 0;
422}
423
424.search-in-progress .console-item.filtered-out-by-search {
425    display: none;
426}
427
428.search-in-progress .console-item:not(.filtered-out-by-search) .highlighted {
429    color: black;
430    background-color: rgba(235, 215, 38, 0.2);
431    border-bottom: 1px solid rgb(237, 202, 71);
432}
433
434.search-in-progress .console-item:not(.filtered-out-by-search) .highlighted.selected {
435    background-color: rgba(235, 215, 38, 0.75);
436}
437
438/* @media reader currently blocked by: http://webkit.org/b/118096 */
439@media reader {
440    .console-user-command::before,
441    .console-messages:focus .console-item.selected .console-user-command::before,
442    .console-user-command-result.console-log-level::before,
443    .console-messages:focus .console-item.selected .console-user-command-result.console-log-level::before {
444        /* accessible label alternative for icon indicating console input/output/warning/error, etc. */
445        content: attr(data-labelprefix);
446    }
447}
448