Commit | Line | Data |
---|---|---|
34bb6c46 RK |
1 | /* vim:set ts=2 sw=2 sts=2 et: */ |
2 | /* This Source Code Form is subject to the terms of the Mozilla Public | |
3 | * License, v. 2.0. If a copy of the MPL was not distributed with this file, | |
4 | * You can obtain one at http://mozilla.org/MPL/2.0/. */ | |
5 | ||
6 | #record-button { | |
7 | list-style-image: url("profiler-stopwatch.svg"); | |
20752032 | 8 | min-width: 24px; |
34bb6c46 RK |
9 | } |
10 | ||
11 | #record-button[checked] { | |
12 | list-style-image: url("profiler-stopwatch-checked.svg"); | |
13 | } | |
14 | ||
15 | #record-button:not([checked]) ~ #record-label { | |
16 | visibility: hidden; | |
17 | } | |
18 | ||
20752032 RK |
19 | #memory-checkbox .checkbox-label { |
20 | line-height: 100%; | |
21 | } | |
22 | ||
23 | #filter-button { | |
24 | list-style-image: url(timeline-filter.svg#filter); | |
25 | min-width: 24px; | |
26 | } | |
27 | ||
28 | #filter-button[disabled] { | |
29 | list-style-image: url(timeline-filter.svg#filter-disabled); | |
30 | } | |
31 | ||
32 | #filter-button:not([disabled]):hover, | |
33 | #filter-button[open] { | |
34 | list-style-image: url(timeline-filter.svg#filter-open); | |
35 | } | |
36 | ||
37 | #timelineFilterPopup > menuitem:before { | |
38 | content: ""; | |
39 | display: block; | |
40 | width: 8px; | |
41 | height: 8px; | |
42 | margin: 0 8px; | |
43 | border: 1px solid; | |
44 | border-radius: 1px; | |
45 | background-color: var(--bullet-bg); | |
46 | border-color: var(--bullet-border); | |
47 | } | |
48 | ||
34bb6c46 RK |
49 | .notice-container { |
50 | font-size: 120%; | |
51 | padding-bottom: 35vh; | |
52 | } | |
53 | ||
54 | .notice-container { | |
55 | background: #A09090; /* Toolbars */ | |
56 | color: #000000; /* Light foreground text */ | |
57 | } | |
58 | ||
59 | #empty-notice button, | |
60 | #recording-notice button { | |
61 | min-width: 30px; | |
62 | min-height: 28px; | |
63 | margin: 0; | |
64 | list-style-image: url("profiler-stopwatch.svg"); | |
65 | } | |
66 | ||
67 | #empty-notice button[checked], | |
68 | #recording-notice button[checked] { | |
69 | list-style-image: url("profiler-stopwatch-checked.svg"); | |
70 | } | |
71 | ||
72 | #empty-notice button .button-text, | |
73 | #recording-notice button .button-text { | |
74 | display: none; | |
75 | } | |
76 | ||
77 | #timeline-pane { | |
78 | border-top: 1px solid #9C9CFF; | |
79 | } | |
80 | ||
81 | .waterfall-list-contents { | |
82 | /* Hack: force hardware acceleration */ | |
83 | transform: translateZ(1px); | |
84 | overflow-x: hidden; | |
85 | overflow-y: auto; | |
86 | } | |
87 | ||
88 | .waterfall-header-contents { | |
89 | overflow-x: hidden; | |
90 | } | |
91 | ||
92 | .waterfall-background-ticks { | |
93 | /* Background created on a <canvas> in js. */ | |
94 | /* @see browser/devtools/timeline/widgets/waterfall.js */ | |
95 | background-image: -moz-element(#waterfall-background); | |
96 | background-repeat: repeat-y; | |
97 | background-position: -1px center; | |
98 | } | |
99 | ||
100 | .waterfall-marker-container[is-spacer] { | |
101 | pointer-events: none; | |
102 | } | |
103 | ||
6f5a7408 RK |
104 | .waterfall-marker-container:not([is-spacer]):nth-child(2n) { |
105 | background-color: var(--theme-contrast-background); | |
34bb6c46 RK |
106 | } |
107 | ||
6f5a7408 RK |
108 | .waterfall-marker-container:hover { |
109 | background-color: var(--theme-hover-background) !important; | |
110 | color: var(--theme-hover-color) !important; | |
34bb6c46 RK |
111 | } |
112 | ||
113 | .waterfall-marker-item { | |
114 | overflow: hidden; | |
115 | } | |
116 | ||
117 | .waterfall-sidebar { | |
118 | -moz-border-end: 1px solid; | |
34bb6c46 | 119 | |
34bb6c46 RK |
120 | -moz-border-end-color: #9C9CFF; |
121 | } | |
122 | ||
123 | .waterfall-marker-container:hover > .waterfall-sidebar { | |
124 | background-color: transparent; | |
125 | } | |
126 | ||
127 | .waterfall-header-name { | |
128 | padding: 4px; | |
129 | } | |
130 | ||
131 | .waterfall-header-tick { | |
132 | width: 100px; | |
133 | font-size: 9px; | |
134 | transform-origin: left center; | |
135 | } | |
136 | ||
137 | .waterfall-header-tick { | |
138 | color: #FF9F00; | |
139 | } | |
140 | ||
141 | .waterfall-header-tick:not(:first-child) { | |
142 | -moz-margin-start: -100px !important; /* Don't affect layout. */ | |
143 | } | |
144 | ||
145 | .waterfall-marker-bullet { | |
146 | width: 8px; | |
147 | height: 8px; | |
148 | -moz-margin-start: 8px; | |
149 | -moz-margin-end: 6px; | |
150 | border: 1px solid; | |
151 | border-radius: 1px; | |
152 | } | |
153 | ||
154 | .waterfall-marker-name { | |
155 | font-size: 95%; | |
156 | padding-bottom: 1px !important; | |
157 | } | |
158 | ||
159 | .waterfall-marker-bar { | |
160 | height: 9px; | |
161 | border: 1px solid; | |
162 | border-radius: 1px; | |
163 | transform-origin: left center; | |
164 | } | |
165 | ||
166 | .waterfall-marker-container.selected > .waterfall-sidebar, | |
167 | .waterfall-marker-container.selected > .waterfall-marker-item { | |
168 | background-color: #008484; /* Select Highlight Blue */ | |
169 | color: #FFCF00; /* Light foreground text */ | |
170 | } | |
171 | ||
172 | .waterfall-marker-container.selected .waterfall-marker-bullet, | |
173 | .waterfall-marker-container.selected .waterfall-marker-bar { | |
6f5a7408 | 174 | border-color: initial !important; |
34bb6c46 RK |
175 | } |
176 | ||
20752032 RK |
177 | .waterfall-marker-location { |
178 | color: #3333FF; | |
179 | } | |
180 | ||
181 | .waterfall-marker-location:hover, | |
182 | .waterfall-marker-location:focus { | |
183 | text-decoration: underline; | |
184 | } | |
185 | ||
34bb6c46 RK |
186 | #timeline-waterfall-details { |
187 | -moz-padding-start: 8px; | |
188 | -moz-padding-end: 8px; | |
20752032 | 189 | padding-top: 2vh; |
34bb6c46 RK |
190 | overflow: auto; |
191 | } | |
192 | ||
193 | .marker-details-bullet { | |
194 | width: 8px; | |
195 | height: 8px; | |
34bb6c46 RK |
196 | border: 1px solid; |
197 | border-radius: 1px; | |
198 | } | |
199 | ||
20752032 | 200 | #timeline-waterfall-details > * { |
34bb6c46 RK |
201 | padding-top: 3px; |
202 | } | |
203 | ||
204 | .marker-details-labelname { | |
205 | -moz-padding-end: 4px; | |
206 | } | |
207 | ||
208 | .marker-details-type { | |
209 | font-size: 1.2em; | |
210 | font-weight: bold; | |
211 | } | |
212 | ||
213 | .marker-details-duration { | |
214 | font-weight: bold; | |
215 | } |