Unreviewed, rolling out r190520, some tests assert / crash.
[WebKit-https.git] / Source / WebInspectorUI / UserInterface / Views / TimelineRecordBar.css
1 /*
2  * Copyright (C) 2014 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 .timeline-record-bar {
27     position: absolute;
28     height: 12px;
29 }
30
31 .timeline-record-bar > .segment {
32     position: absolute;
33     height: 100%;
34     background-color: hsl(0, 0%, 88%);
35     border: 1px solid hsl(0, 0%, 78%);
36     border-radius: 3px;
37     min-width: 4px;
38     z-index: 1;
39 }
40
41 .timeline-record-bar:not(.has-inactive-segment) > .segment {
42     left: 0;
43     width: 100%;
44 }
45
46 .timeline-record-bar > .segment.inactive {
47     z-index: 0;
48 }
49
50 .timeline-record-bar > .segment.inactive,
51 .timeline-record-bar.unfinished > .segment {
52     border-top-right-radius: 0 !important;
53     border-bottom-right-radius: 0 !important;
54     border-right: none;
55 }
56
57 .timeline-record-bar.has-inactive-segment > .segment:not(.inactive) {
58     border-top-left-radius: 0 !important;
59     border-bottom-left-radius: 0 !important;
60 }
61
62 :matches(:focus, .force-focus) .selected .timeline-record-bar > .segment {
63     background-color: white !important;
64     border: none !important;
65 }
66
67 :matches(:focus, .force-focus) .selected .timeline-record-bar > .segment.inactive {
68     background-color: hsl(215, 63%, 85%) !important;
69 }
70
71 :matches(:focus, .force-focus) .selected .timeline-record-bar.has-inactive-segment > .segment:not(.inactive) {
72     border-left: 1px solid hsla(215, 67%, 53%, 0.7) !important;
73 }
74
75 .timeline-record-bar.timeline-record-type-network > .segment {
76     background-color: hsl(207, 63%, 67%);
77     border-color: hsl(202, 55%, 51%);
78 }
79
80 .timeline-record-bar.timeline-record-type-network > .segment.inactive {
81     background-color: hsl(208, 66%, 79%);
82     border-color: hsl(202, 57%, 68%);
83 }
84
85 .timeline-record-bar.timeline-record-type-layout > .segment {
86     background-color: hsl(0, 65%, 75%);
87     border-color: hsl(0, 54%, 62%);
88 }
89
90
91 .timeline-record-bar.timeline-record-type-layout.layout-timeline-record-paint > .segment,
92 .timeline-record-bar.timeline-record-type-layout.layout-timeline-record-composite > .segment {
93     background-color: hsl(76, 49%, 60%);
94     border-color: hsl(79, 45%, 51%);
95 }
96
97 .timeline-record-bar.timeline-record-type-script > .segment {
98     background-color: hsl(269, 65%, 74%);
99     border-color: hsl(273, 33%, 58%);
100 }