dbe8900a61d8eab3bae48db8c4b664aadb18d8fe
[WebKit-https.git] / Source / WebCore / inspector / front-end / scriptsPanel.css
1 /*
2  * Copyright (C) 2006, 2007, 2008 Apple Inc.  All rights reserved.
3  * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org>
4  *
5  * Redistribution and use in source and binary forms, with or without
6  * modification, are permitted provided that the following conditions
7  * are met:
8  *
9  * 1.  Redistributions of source code must retain the above copyright
10  *     notice, this list of conditions and the following disclaimer.
11  * 2.  Redistributions in binary form must reproduce the above copyright
12  *     notice, this list of conditions and the following disclaimer in the
13  *     documentation and/or other materials provided with the distribution.
14  * 3.  Neither the name of Apple Computer, Inc. ("Apple") nor the names of
15  *     its contributors may be used to endorse or promote products derived
16  *     from this software without specific prior written permission.
17  *
18  * THIS SOFTWARE IS PROVIDED BY APPLE AND ITS CONTRIBUTORS "AS IS" AND ANY
19  * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
20  * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
21  * DISCLAIMED. IN NO EVENT SHALL APPLE OR ITS CONTRIBUTORS BE LIABLE FOR ANY
22  * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
23  * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
24  * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
25  * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
26  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF
27  * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
28  */
29
30 .scripts-pause-on-exceptions-status-bar-item .glyph {
31     -webkit-mask-position: -256px 0;
32 }
33
34 .scripts-pause-on-exceptions-status-bar-item.toggled-all .glyph {
35     background-color: rgb(66, 129, 235);
36 }
37
38 .scripts-pause-on-exceptions-status-bar-item.toggled-uncaught .glyph {
39     background-color: purple;
40 }
41
42 .scripts-toggle-pretty-print-status-bar-item .glyph {
43     -webkit-mask-position: -256px -24px;
44 }
45
46 .scripts-toggle-pretty-print-status-bar-item.toggled .glyph {
47     background-color: rgb(66, 129, 235);
48 }
49
50 .evaluate-snippet-status-bar-item .glyph {
51     -webkit-mask-position: -64px -48px;
52 }
53
54 .evaluate-snippet-status-bar-item.toggled .glyph {
55     background-color: rgb(66, 129, 235);
56 }
57
58 #scripts-debug-toolbar {
59     position: relative;
60     margin-top: -1px;
61     height: 24px;
62     border-bottom: 1px solid rgb(202, 202, 202);
63 }
64
65 #scripts-editor-toolbar {
66     position: relative;
67     margin-top: -1px;
68     height: 24px;
69 }
70
71 #scripts-files {
72     max-width: 250px;
73 }
74
75 #scripts-files option.extension-script {
76     color: rgb(70, 134, 240);
77 }
78
79 #scripts-functions {
80     max-width: 150px;
81 }
82
83 #scripts-status-bar .status-bar-item img {
84     margin-top: 2px;
85 }
86
87 #scripts-pause img {
88     content: url(Images/debuggerPause.png);
89 }
90
91 #scripts-pause.paused img {
92     content: url(Images/debuggerContinue.png);
93 }
94
95 #scripts-step-over img {
96     content: url(Images/debuggerStepOver.png);
97 }
98
99 #scripts-step-into img {
100     content: url(Images/debuggerStepInto.png);
101 }
102
103 #scripts-step-out img {
104     content: url(Images/debuggerStepOut.png);
105 }
106
107 .toggle-breakpoints .glyph {
108     -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
109     -webkit-mask-position: -32px 0;
110     -webkit-mask-size: 320px 72px;
111     background-color: rgb(96, 96, 96) !important;
112 }
113
114 @media (-webkit-min-device-pixel-ratio: 1.5) {
115 .toggle-breakpoints .glyph {
116     -webkit-mask-image: url(Images/statusbarButtonGlyphs2x.png);        
117 }
118 }
119
120 .toggle-breakpoints.toggled-on .glyph {
121     -webkit-mask-position: 0 -24px;
122 }
123
124 #scripts-debugger-status {
125     position: absolute;
126     line-height: 24px;
127     top: 0;
128     right: 8px;
129 }
130
131 #scripts-debug-sidebar-resizer-widget {
132     position: absolute;
133     top: 0;
134     height: 23px;
135     right: 0;
136     width: 16px;
137     cursor: ew-resize;
138     background-image: url(Images/statusbarResizerHorizontal.png);
139     background-repeat: no-repeat;
140     background-position: center;
141     z-index: 13;
142 }
143
144 .scripts-navigator-resizer-widget {
145     position: absolute;
146     top: 0;
147     right: 0;
148     height: 24px;
149     width: 16px;
150     cursor: ew-resize;
151     background-image: url(Images/statusbarResizerHorizontal.png);
152     background-repeat: no-repeat;
153     background-position: center;
154 }
155
156 .status-bar-item.scripts-navigator-show-hide-button > .glyph {
157     background-color: rgba(0, 0, 0, 0.5);
158     -webkit-mask-image: url(Images/navigatorShowHideButton.png);
159     -webkit-mask-position: 0 0;
160     -webkit-mask-size: 48px 32px;
161 }
162
163 .status-bar-item.scripts-navigator-show-hide-button.toggled-pinned > .glyph {
164     -webkit-mask-position: -16px 0;
165 }
166
167 .status-bar-item.scripts-navigator-show-hide-button.toggled-overlay > .glyph {
168     -webkit-mask-position: -32px 0;
169 }
170
171 button.status-bar-item.scripts-navigator-show-hide-button {
172     position: absolute;
173     top: 0;
174     left: 0;
175     background-image: none;
176     height: 16px;
177     width: 16px;
178     margin: 4px 2px 2px 2px;
179     border: none;
180 }
181
182 button.status-bar-item.scripts-navigator-show-hide-button:active {
183     top: 1px;
184     left: 1px;
185 }
186
187 button.status-bar-item.scripts-navigator-show-hide-button.toggled-overlay
188 {
189     left: auto;
190     right: 15px;
191 }
192
193 .scripts-views-container {
194     position: absolute;
195     top: 23px;
196     right: 0;
197     bottom: 0;
198     left: 0;
199 }
200
201 .script-view {
202     display: none;
203     overflow: hidden;
204     position: absolute;
205     top: 0;
206     right: 0;
207     bottom: 0;
208     left: 0;
209 }
210
211 .script-view.visible {
212     display: block;
213 }
214
215 .dedicated-worker-item {
216     margin: 5px 0px 5px 1px;
217 }
218
219 #shared-workers-list {
220     margin: 5px 0px 5px 20px;
221     font-style:italic;
222 }
223
224 #pause-workers-checkbox > input {
225     position: relative;
226     top: 2px;
227 }
228
229 #scripts-editor-container-tabbed-pane .tabbed-pane-header {
230     background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F5F5F5), to(#E5E5E5));
231 }
232
233 #scripts-editor-container-tabbed-pane .tabbed-pane-header-contents {
234     margin-left: 20px;
235     margin-right: 36px;
236 }
237
238 #scripts-editor-container-tabbed-pane .tabbed-pane-header-tab {
239     border-bottom: 1px solid #BBB;
240 }
241
242 .function-location-link {
243     float: right;
244     margin-left: 10px;
245 }
246
247 .function-popover-title {
248     border-bottom: 1px solid #AAA;
249     margin-bottom: 3px;
250     padding-bottom: 2px;
251 }
252
253 .function-popover-title .function-name {
254     font-weight: bold;
255 }
256
257 button.status-bar-item.scripts-debugger-show-hide-button {
258     position: absolute;
259     top: 0;
260     background-image: none;
261     height: 16px;
262     width: 16px;
263     margin: 4px 2px 2px 2px;
264     border: none;
265 }
266
267 .split-view-horizontal button.status-bar-item.scripts-debugger-show-hide-button,
268 .split-view-horizontal #scripts-debug-sidebar-resizer-widget {
269     display: none;
270 }
271
272 button.status-bar-item.scripts-debugger-show-hide-button:active {
273     top: 1px;
274 }
275
276 .status-bar-item.scripts-debugger-show-hide-button > .glyph {
277     background-color: rgba(0, 0, 0, 0.5);
278     -webkit-mask-image: url(Images/navigatorShowHideButton.png);
279     -webkit-mask-position: 0 0;
280     -webkit-mask-size: 48px 32px;
281 }
282
283 button.status-bar-item.scripts-debugger-show-hide-button.toggled-shown {
284     right: 16px;
285 }
286
287 button.status-bar-item.scripts-debugger-show-hide-button.toggled-shown:active {
288     right: 15px;
289 }
290
291 .status-bar-item.scripts-debugger-show-hide-button.toggled-shown > .glyph {
292     -webkit-mask-position: 0 -16px;
293 }
294
295 button.status-bar-item.scripts-debugger-show-hide-button.toggled-hidden {
296     right: 1px;
297 }
298
299 button.status-bar-item.scripts-debugger-show-hide-button.toggled-hidden:active {
300     right: 0px;
301 }
302
303 .status-bar-item.scripts-debugger-show-hide-button.toggled-hidden > .glyph {
304     -webkit-mask-position: -16px -16px;
305 }
306
307 div.sidebar-pane-stack#scripts-debug-sidebar-contents, #scripts-sidebar-stack-pane {
308     top: 23px;
309     overflow: auto;
310 }