browser/devtools/profiler/cleopatra/css/tree.css@6474c204b198
browser/devtools/profiler/cleopatra/css/tree.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 .treeViewContainer {
6 -moz-user-select: none;
7 user-select: none;
8 cursor: default;
9 line-height: 16px;
10 height: 100%;
11 outline: none; /* override the browser's focus styling */
12 position: relative;
13 }
15 .treeHeader {
16 position: absolute;
17 top: 0;
18 right: 0;
19 left: 0;
20 height: 16px;
21 margin: 0;
22 padding: 0;
23 }
25 .treeColumnHeader {
26 position: absolute;
27 display: block;
28 background: linear-gradient(#FFF 45%, #EEE 60%);
29 margin: 0;
30 padding: 0;
31 top: 0;
32 height: 15px;
33 line-height: 15px;
34 border: 0 solid #CCC;
35 border-bottom-width: 1px;
36 text-indent: 5px;
37 }
39 .treeColumnHeader:not(:last-child) {
40 border-right-width: 1px;
41 }
43 .treeColumnHeader0 {
44 left: 0;
45 width: 86px;
46 }
48 .treeColumnHeader1 {
49 left: 99px;
50 width: 35px;
51 }
53 .treeColumnHeader0,
54 .treeColumnHeader1 {
55 text-align: right;
56 padding-right: 12px;
57 }
59 .treeColumnHeader2 {
60 left: 147px;
61 right: 0;
62 }
64 .treeViewVerticalScrollbox {
65 position: absolute;
66 top: 16px;
67 left: 0;
68 right: 0;
69 bottom: 0;
70 overflow-y: scroll;
71 overflow-x: hidden;
72 }
74 .treeViewNode,
75 .treeViewHorizontalScrollbox {
76 display: block;
77 margin: 0;
78 padding: 0;
79 }
81 .treeViewNode {
82 min-width: -moz-min-content;
83 white-space: nowrap;
84 }
86 .treeViewHorizontalScrollbox {
87 padding-left: 150px;
88 overflow: hidden;
89 }
91 .treeViewVerticalScrollbox,
92 .treeViewHorizontalScrollbox {
93 background: linear-gradient(white, white 50%, #F0F5FF 50%, #F0F5FF);
94 background-size: 100px 32px;
95 }
97 .leftColumnBackground {
98 background: linear-gradient(left, transparent, transparent 98px, #CCC 98px, #CCC 99px, transparent 99px),
99 linear-gradient(white, white 50%, #F0F5FF 50%, #F0F5FF);
100 background-size: auto, 100px 32px;
101 position: absolute;
102 top: 0;
103 left: 0;
104 width: 146px;
105 min-height: 100%;
106 border-right: 1px solid #CCC;
107 }
109 .sampleCount,
110 .samplePercentage,
111 .selfSampleCount {
112 position: absolute;
113 text-align: right;
114 }
116 .sampleCount {
117 left: 2px;
118 width: 50px;
119 }
121 .samplePercentage {
122 left: 55px;
123 width: 40px;
124 }
126 .selfSampleCount {
127 left: 98px;
128 width: 45px;
129 padding-right: 2px;
130 border: solid #CCC;
131 border-width: 0 1px;
132 }
134 .libraryName {
135 margin-left: 10px;
136 color: #999;
137 }
139 .treeViewNode > .treeViewNodeList {
140 margin-left: 1em;
141 }
143 .treeViewNode.collapsed > .treeViewNodeList {
144 display: none;
145 }
147 .treeLine {
148 /* extend the selection background almost infinitely to the left */
149 margin-left: -10000px;
150 padding-left: 10000px;
151 }
153 .treeLine.selected {
154 color: black;
155 background-color: -moz-dialog;
156 }
158 .treeLine.selected > .sampleCount {
159 background-color: inherit;
160 margin-left: -2px;
161 padding-left: 2px;
162 padding-right: 95px;
163 margin-right: -95px;
164 }
166 .treeViewContainer:focus .treeLine.selected {
167 color: highlighttext;
168 background-color: highlight;
169 }
171 .treeViewContainer:focus .treeLine.selected > .libraryName {
172 color: #CCC;
173 }
175 .expandCollapseButton,
176 .focusCallstackButton {
177 background: none 0 0 no-repeat transparent;
178 margin: 0;
179 padding: 0;
180 border: 0;
181 width: 16px;
182 height: 16px;
183 overflow: hidden;
184 vertical-align: top;
185 color: transparent;
186 font-size: 0;
187 }
189 .expandCollapseButton {
190 background-image: url(../images/treetwisty.svg);
191 }
193 .focusCallstackButton {
194 background-image: url(../images/circlearrow.svg);
195 margin-left: 5px;
196 visibility: hidden;
197 }
199 .expandCollapseButton:active:hover,
200 .focusCallstackButton:active:hover {
201 background-position: -16px 0;
202 }
204 .treeViewNode.collapsed > .treeLine > .expandCollapseButton {
205 background-position: 0 -16px;
206 }
208 .treeViewNode.collapsed > .treeLine > .expandCollapseButton:active:hover {
209 background-position: -16px -16px;
210 }
212 .treeViewContainer:focus .treeLine.selected > .expandCollapseButton,
213 .treeViewContainer:focus .treeLine.selected > .focusCallstackButton {
214 background-position: -32px 0;
215 }
217 .treeViewContainer:focus .treeViewNode.collapsed > .treeLine.selected > .expandCollapseButton {
218 background-position: -32px -16px;
219 }
221 .treeViewContainer:focus .treeLine.selected > .expandCollapseButton:active:hover,
222 .treeViewContainer:focus .treeLine.selected > .focusCallstackButton:active:hover {
223 background-position: -48px 0;
224 }
226 .treeViewContainer:focus .treeViewNode.collapsed > .treeLine.selected > .expandCollapseButton:active:hover {
227 background-position: -48px -16px;
228 }
230 .treeViewNode.leaf > * > .expandCollapseButton {
231 visibility: hidden;
232 }
234 .treeLine:hover > .focusCallstackButton {
235 visibility: visible;
236 }
