browser/devtools/profiler/cleopatra/css/ui.css@6474c204b198
browser/devtools/profiler/cleopatra/css/ui.css
Wed, 31 Dec 2014 06:09:35 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:09:35 +0100
- changeset 0
- 6474c204b198
- permissions
- -rwxr-xr-x
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
1 /* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
5 body {
6 margin: 0;
7 font-family: "Lucida Grande", sans-serif;
8 font-size: 11px;
9 }
10 #mainarea {
11 position: absolute;
12 top: 0;
13 left: 0px;
14 bottom: 0;
15 right: 0;
16 }
17 .finishedProfilePane,
18 .finishedProfilePaneBackgroundCover,
19 .profileEntryPane,
20 .profileProgressPane {
21 position: absolute;
22 top: 0;
23 left: 0;
24 bottom: 0;
25 right: 0;
26 }
27 .profileEntryPane {
28 overflow: auto;
29 }
30 .profileEntryPane,
31 .profileProgressPane {
32 padding: 20px;
33 background-color: rgb(229,229,229);
34 background-image: url(../images/noise.png),
35 linear-gradient(rgba(255,255,255,.5),rgba(255,255,255,.2));
36 text-shadow: rgba(255, 255, 255, 0.4) 0 1px;
37 }
38 .profileEntryPane h1 {
39 margin-top: 0;
40 font-size: 13px;
41 font-weight: normal;
42 }
43 .profileEntryPane input[type="file"] {
44 margin-bottom: 1em;
45 }
46 .profileProgressPane a {
47 position: absolute;
48 top: 30%;
49 left: 30%;
50 width: 40%;
51 height: 16px;
52 }
53 .profileProgressPane progress {
54 position: absolute;
55 top: 40%;
56 left: 30%;
57 width: 40%;
58 height: 16px;
59 }
60 .finishedProfilePaneBackgroundCover {
61 animation: darken 300ms cubic-bezier(0, 0, 1, 0);
62 background-color: rgba(0, 0, 0, 0.5);
63 }
65 .finishedProfilePane {
66 animation: appear 300ms ease-out;
67 }
69 @keyframes darken {
70 from {
71 opacity: 0;
72 }
73 to {
74 opacity: 1;
75 }
76 }
77 @keyframes appear {
78 from {
79 transform: scale(0.3);
80 opacity: 0;
81 pointer-events: none;
82 }
83 to {
84 transform: scale(1);
85 opacity: 1;
86 pointer-events: auto;
87 }
88 }
89 .breadcrumbTrail {
90 top: 0;
91 right: 0;
92 height: 29px;
93 left: 0;
94 background: linear-gradient(#FFF 50%, #F3F3F3 55%);
95 border-bottom: 1px solid #CCC;
96 margin: 0;
97 padding: 0;
98 overflow: hidden;
99 }
100 .breadcrumbTrailItem {
101 background: linear-gradient(#FFF 50%, #F3F3F3 55%);
102 display: block;
103 margin: 0;
104 padding: 0;
105 float: left;
106 line-height: 29px;
107 padding: 0 10px;
108 font-size: 12px;
109 -moz-user-select: none;
110 user-select: none;
111 cursor: default;
112 border-right: 1px solid #CCC;
113 max-width: 250px;
114 overflow: hidden;
115 text-overflow: ellipsis;
116 white-space: nowrap;
117 position: relative;
118 }
119 @keyframes slide-out {
120 from {
121 margin-left: -270px;
122 opacity: 0;
123 }
124 to {
125 margin-left: 0;
126 opacity: 1;
127 }
128 }
129 @keyframes slide-out {
130 from {
131 margin-left: -270px;
132 opacity: 0;
133 }
134 to {
135 margin-left: 0;
136 opacity: 1;
137 }
138 }
139 .breadcrumbTrailItem:not(:first-child) {
140 animation: slide-out;
141 animation-duration: 400ms;
142 animation-timing-function: ease-out;
143 }
144 .breadcrumbTrailItem.selected {
145 background: linear-gradient(#E5E5E5 50%, #DADADA 55%);
146 }
147 .breadcrumbTrailItem:not(.selected):active:hover {
148 background: linear-gradient(#F2F2F2 50%, #E6E6E6 55%);
149 }
150 .breadcrumbTrailItem.deleted {
151 transition: 400ms ease-out;
152 transition-property: opacity, margin-left;
153 opacity: 0;
154 margin-left: -270px;
155 }
156 .treeContainer {
157 /*For asbolute position child*/
158 position: relative;
159 }
160 .tree {
161 height: 100%;
162 }
163 #sampleBar {
164 position: absolute;
165 float: right;
166 left: auto;
167 top: 0;
168 right: 0;
169 height: 100%;
170 }
171 #fileList {
172 position: absolute;
173 top: 0;
174 left: 0;
175 bottom: 360px;
176 width: 199px;
177 overflow: auto;
178 padding: 0;
179 margin: 0;
180 background: #DBDFE7;
181 border-right: 1px solid #BBB;
182 cursor: pointer;
183 }
184 #infoBar dl {
185 margin: 0;
186 }
187 #infoBar dt,
188 #infoBar dd {
189 display: inline;
190 }
191 #infoBar dt {
192 font-weight: bold;
193 }
194 #infoBar dt::after {
195 content: " ";
196 white-space: pre;
197 }
198 #infoBar dd {
199 margin-left: 0;
200 }
201 #infoBar dd::after {
202 content: "\a";
203 white-space:pre;
204 }
205 .sideBar {
206 box-sizing: border-box;
207 position: absolute;
208 left: 0;
209 bottom: 0;
210 width: 200px;
211 height: 480px;
212 overflow: auto;
213 padding: 3px;
214 background: #EEE;
215 border-top: 1px solid #BBB;
216 border-right: 1px solid #BBB;
217 }
218 .sideBar h2 {
219 font-size: 1em;
220 padding: 1px 3px;
221 margin: 3px -3px;
222 background: rgba(255, 255, 255, 0.6);
223 border: solid #CCC;
224 border-width: 1px 0;
225 }
226 .sideBar h2:first-child {
227 margin-top: -4px;
228 }
229 .sideBar ul {
230 margin: 2px 0;
231 padding-left: 18px;
232 }
233 .pluginview {
234 position: absolute;
235 right: 0;
236 bottom: 0;
237 left: 0;
238 z-index: 1;
239 background-color: white;
240 }
241 .pluginviewIFrame {
242 border-style: none;
243 width: 100%;
244 height: 100%;
245 }
246 .histogram {
247 position: relative;
248 height: 60px;
249 right: 0;
250 left: 0;
251 border-bottom: 1px solid #CCC;
252 background: linear-gradient(#EEE, #CCC);
253 }
254 .histogramHilite {
255 position: absolute;
256 pointer-events: none;
257 }
258 .histogramHilite:not(.collapsed) {
259 background: rgba(150, 150, 150, 0.5);
260 }
261 .histogramMouseMarker {
262 position: absolute;
263 pointer-events: none;
264 top: 0;
265 width: 1px;
266 height: 100%;
267 }
268 .histogramMouseMarker:not(.collapsed) {
269 background: rgba(0, 0, 150, 0.7);
270 }
271 #iconbox {
272 display: none;
273 }
274 #filter, #showall {
275 cursor: pointer;
276 }
277 .markers {
278 display: none;
279 }
280 .hidden {
281 display: none !important;
282 }
283 .fileListItem {
284 display: block;
285 margin: 0;
286 padding: 0;
287 height: 40px;
288 text-indent: 8px;
289 }
290 .fileListItem.selected {
291 background: linear-gradient(#4B91D7 1px, #5FA9E4 1px, #5FA9E4 2px, #58A0DE 3px, #2B70C7 39px, #2763B4 39px);
292 color: #FFF;
293 text-shadow: 0 1px rgba(0, 0, 0, 0.3);
294 }
295 .fileListItemTitle {
296 display: block;
297 padding-top: 6px;
298 font-size: 12px;
299 }
300 .fileListItemDescription {
301 display: block;
302 line-height: 15px;
303 font-size: 9px;
304 }
305 .busyCover {
306 position: absolute;
307 top: 0;
308 right: 0;
309 bottom: 0;
310 left: 0;
311 visibility: hidden;
312 opacity: 0;
313 pointer-events: none;
314 background: rgba(120, 120, 120, 0.2);
315 transition: 200ms ease-in-out;
316 transition-property: visibility, opacity;
317 }
318 .busyCover.busy {
319 visibility: visible;
320 opacity: 1;
321 }
322 .busyCover::before {
323 content: url(../images/throbber.svg);
324 position: absolute;
325 top: 50%;
326 left: 50%;
327 margin: -12px;
328 }
329 label {
330 -moz-user-select: none;
331 }
332 .videoPane {
333 background-color: white;
334 width: 100%;
335 }
336 .video {
337 display: block;
338 margin-left: auto;
339 margin-right: auto;
340 }
