Commit | Line | Data |
---|---|---|
cc7e70eb RK |
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/. */ | |
4 | ||
445863a2 RK |
5 | window { |
6 | padding: 0; | |
7 | } | |
8 | ||
9 | #inspector-toolbar { | |
10 | border-top: none; | |
11 | } | |
12 | ||
0142a07b | 13 | /* Highlighter toolbar - breadcrumbs */ |
445863a2 RK |
14 | |
15 | #inspector-breadcrumbs { | |
16 | -moz-margin-end: 3px; | |
17 | /* A fake 1px-shadow is included in the border-images of the | |
18 | inspector-breadcrumbs-buttons, to match toolbar-buttons style. | |
19 | This negative margin compensate the extra row of pixels created | |
0142a07b RK |
20 | by the shadow.*/ |
21 | /*margin: -1px 0;*/ | |
445863a2 RK |
22 | } |
23 | ||
24 | #inspector-breadcrumbs > .scrollbutton-up, | |
25 | #inspector-breadcrumbs > .scrollbutton-down { | |
0142a07b RK |
26 | min-height: 25px; |
27 | margin-top: 0; | |
28 | margin-bottom: 0; | |
29 | } | |
30 | ||
31 | #inspector-breadcrumbs > .scrollbutton-up { | |
32 | -moz-margin-end: 1px; | |
33 | } | |
34 | ||
35 | #inspector-breadcrumbs > .scrollbutton-down { | |
36 | -moz-margin-end: 0; | |
445863a2 RK |
37 | } |
38 | ||
39 | #inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover, | |
40 | #inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover { | |
445863a2 RK |
41 | } |
42 | ||
43 | #inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon, | |
44 | #inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon { | |
0142a07b | 45 | /* margin: 0 5px; */ |
445863a2 RK |
46 | } |
47 | ||
48 | #inspector-breadcrumbs > .scrollbutton-up[disabled] > .toolbarbutton-icon, | |
49 | #inspector-breadcrumbs > .scrollbutton-down[disabled] > .toolbarbutton-icon { | |
445863a2 RK |
50 | } |
51 | ||
52 | #inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover > .toolbarbutton-icon, | |
53 | #inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover > .toolbarbutton-icon { | |
0142a07b RK |
54 | } |
55 | ||
56 | #inspector-breadcrumbs > .scrollbutton-up:-moz-locale-dir(ltr) { | |
57 | border-top-right-radius: 0; | |
58 | border-bottom-right-radius: 0; | |
59 | } | |
60 | ||
61 | #inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(ltr) { | |
62 | border-top-left-radius: 0; | |
63 | border-bottom-left-radius: 0; | |
64 | } | |
65 | ||
66 | #inspector-breadcrumbs > .scrollbutton-up:-moz-locale-dir(rtl) { | |
67 | border-top-left-radius: 0; | |
68 | border-bottom-left-radius: 0; | |
69 | } | |
70 | ||
71 | #inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(rtl) { | |
72 | border-top-right-radius: 0; | |
73 | border-bottom-right-radius: 0; | |
445863a2 RK |
74 | } |
75 | ||
76 | #inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon:-moz-locale-dir(rtl), | |
77 | #inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon:-moz-locale-dir(ltr) { | |
0142a07b | 78 | /* transform: scaleX(-1); */ |
445863a2 RK |
79 | } |
80 | ||
81 | .inspector-breadcrumbs-button { | |
0142a07b RK |
82 | background-color: #000000; |
83 | border-radius: 0; | |
445863a2 RK |
84 | border-style: solid; |
85 | border-width: 2px 13px; | |
86 | outline: none; | |
0142a07b RK |
87 | color: #FF9F00; |
88 | width: 85px; /* Can't use max-width. See bug 723132 */ | |
89 | /* The content of the button can be larger than the button */ | |
445863a2 RK |
90 | overflow: hidden; |
91 | min-height: 25px; | |
92 | margin: 0 -11px 0 0; | |
93 | padding: 0 9px; | |
94 | } | |
95 | ||
0142a07b RK |
96 | .inspector-breadcrumbs-button:hover { |
97 | background-color: #FFCF00; | |
98 | color: #000000; | |
99 | } | |
100 | ||
101 | .inspector-breadcrumbs-button[checked]:not(:hover) { | |
102 | background-color: #008484; | |
103 | color: #000000; | |
104 | } | |
105 | ||
106 | .inspector-breadcrumbs-button[siblings-menu-open], | |
107 | .inspector-breadcrumbs-button:active { | |
108 | background-color: #FF9F00; | |
109 | color: #000000; | |
110 | } | |
111 | ||
445863a2 RK |
112 | .inspector-breadcrumbs-button:-moz-focusring > .button-box { |
113 | border-width: 0; | |
114 | } | |
115 | ||
116 | .inspector-breadcrumbs-button:-moz-focusring > label { | |
0142a07b | 117 | border-bottom: 1px dotted #008484; |
445863a2 RK |
118 | } |
119 | ||
120 | .inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-tag { | |
0142a07b | 121 | /*color: hsl(208,100%,60%); */ |
445863a2 RK |
122 | } |
123 | ||
124 | .inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-id { | |
0142a07b | 125 | /*color: hsl(205,100%,70%); */ |
445863a2 RK |
126 | } |
127 | ||
128 | .inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-pseudo-classes { | |
0142a07b | 129 | color: #FF9F00; |
445863a2 RK |
130 | } |
131 | ||
132 | .inspector-breadcrumbs-id, | |
133 | .inspector-breadcrumbs-classes { | |
0142a07b | 134 | /*color: #8d99a6; */ |
445863a2 RK |
135 | } |
136 | ||
137 | .inspector-breadcrumbs-pseudo-classes { | |
0142a07b RK |
138 | color: #FFCF00; |
139 | } | |
140 | ||
141 | /* fit height of other buttons to breadcrumbs */ | |
142 | #inspector-toolbar .devtools-toolbarbutton, | |
143 | #highlighter-closebutton, | |
144 | #inspector-option-toolbarbutton { | |
145 | min-height: 25px; | |
445863a2 RK |
146 | } |
147 | ||
0142a07b RK |
148 | /* Highlighter toolbar - breadcrumbs - LTR */ |
149 | ||
150 | .inspector-breadcrumbs-button:-moz-locale-dir(ltr):first-of-type { | |
151 | } | |
445863a2 RK |
152 | |
153 | .inspector-breadcrumbs-button { | |
82b4252f | 154 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle.png") 2 13 2 13 fill stretch; |
445863a2 RK |
155 | } |
156 | ||
0142a07b | 157 | .inspector-breadcrumbs-button[siblings-menu-open]:not([checked]), |
445863a2 | 158 | .inspector-breadcrumbs-button:not([checked]):hover:active { |
82b4252f | 159 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
160 | } |
161 | ||
162 | .inspector-breadcrumbs-button[checked] { | |
82b4252f | 163 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-selected.png") 2 13 2 13 fill stretch; |
445863a2 RK |
164 | } |
165 | ||
0142a07b | 166 | .inspector-breadcrumbs-button[checked][siblings-menu-open], |
445863a2 | 167 | .inspector-breadcrumbs-button[checked]:hover:active { |
82b4252f | 168 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-selected-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
169 | } |
170 | ||
171 | .inspector-breadcrumbs-button:first-of-type { | |
82b4252f | 172 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start.png") 2 13 2 13 fill stretch; |
445863a2 RK |
173 | } |
174 | ||
0142a07b | 175 | .inspector-breadcrumbs-button[siblings-menu-open]:first-of-type:not([checked]), |
445863a2 | 176 | .inspector-breadcrumbs-button:first-of-type:not([checked]):hover:active { |
82b4252f | 177 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
178 | } |
179 | ||
180 | .inspector-breadcrumbs-button:first-of-type[checked] { | |
82b4252f | 181 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-selected.png") 2 13 2 13 fill stretch; |
445863a2 RK |
182 | } |
183 | ||
0142a07b | 184 | .inspector-breadcrumbs-button[siblings-menu-open]:first-of-type[checked], |
445863a2 | 185 | .inspector-breadcrumbs-button:first-of-type[checked]:hover:active { |
82b4252f | 186 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-selected-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
187 | } |
188 | ||
189 | .inspector-breadcrumbs-button:last-of-type { | |
82b4252f | 190 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end.png") 2 13 2 13 fill stretch; |
445863a2 RK |
191 | } |
192 | ||
0142a07b | 193 | .inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]), |
445863a2 | 194 | .inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active { |
82b4252f | 195 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
196 | } |
197 | ||
198 | .inspector-breadcrumbs-button:last-of-type[checked] { | |
82b4252f | 199 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-selected.png") 2 13 2 13 fill stretch; |
445863a2 RK |
200 | } |
201 | ||
0142a07b | 202 | .inspector-breadcrumbs-button[siblings-menu-open]:last-of-type[checked], |
445863a2 | 203 | .inspector-breadcrumbs-button:last-of-type[checked]:hover:active { |
82b4252f | 204 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-selected-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
205 | } |
206 | ||
0142a07b RK |
207 | /* Highlighter toolbar - breadcrumbs - RTL */ |
208 | ||
209 | .inspector-breadcrumbs-button:-moz-locale-dir(rtl):first-of-type { | |
210 | } | |
445863a2 RK |
211 | |
212 | .inspector-breadcrumbs-button:-moz-locale-dir(rtl) { | |
82b4252f | 213 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle.png") 2 13 2 13 fill stretch; |
445863a2 RK |
214 | } |
215 | ||
0142a07b | 216 | .inspector-breadcrumbs-button[siblings-menu-open]:not([checked]):-moz-locale-dir(rtl), |
445863a2 | 217 | .inspector-breadcrumbs-button:not([checked]):hover:active:-moz-locale-dir(rtl) { |
82b4252f | 218 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
219 | } |
220 | ||
221 | .inspector-breadcrumbs-button[checked]:-moz-locale-dir(rtl) { | |
82b4252f | 222 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-selected.png") 2 13 2 13 fill stretch; |
445863a2 RK |
223 | } |
224 | ||
0142a07b | 225 | .inspector-breadcrumbs-button[checked][siblings-menu-open]:-moz-locale-dir(rtl), |
445863a2 | 226 | .inspector-breadcrumbs-button[checked]:hover:active:-moz-locale-dir(rtl) { |
82b4252f | 227 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-selected-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
228 | } |
229 | ||
230 | .inspector-breadcrumbs-button:first-of-type:-moz-locale-dir(rtl) { | |
82b4252f | 231 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start.png") 2 13 2 13 fill stretch; |
445863a2 RK |
232 | } |
233 | ||
0142a07b | 234 | .inspector-breadcrumbs-button[siblings-menu-open]:first-of-type:not([checked]):-moz-locale-dir(rtl), |
445863a2 | 235 | .inspector-breadcrumbs-button:first-of-type:not([checked]):hover:active:-moz-locale-dir(rtl) { |
82b4252f | 236 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
237 | } |
238 | ||
239 | .inspector-breadcrumbs-button:first-of-type[checked]:-moz-locale-dir(rtl) { | |
82b4252f | 240 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-selected.png") 2 13 2 13 fill stretch; |
445863a2 RK |
241 | } |
242 | ||
0142a07b | 243 | .inspector-breadcrumbs-button[siblings-menu-open]:first-of-type[checked]:-moz-locale-dir(rtl), |
445863a2 | 244 | .inspector-breadcrumbs-button:first-of-type[checked]:hover:active:-moz-locale-dir(rtl) { |
82b4252f | 245 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-selected-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
246 | } |
247 | ||
248 | .inspector-breadcrumbs-button:last-of-type:-moz-locale-dir(rtl) { | |
82b4252f | 249 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end.png") 2 13 2 13 fill stretch; |
445863a2 RK |
250 | } |
251 | ||
445863a2 | 252 | #inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:last-of-type:-moz-locale-dir(rtl) { |
445863a2 RK |
253 | } |
254 | ||
0142a07b | 255 | .inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]):-moz-locale-dir(rtl), |
445863a2 | 256 | .inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active:-moz-locale-dir(rtl) { |
82b4252f | 257 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-pressed.png") 2 13 2 13 fill stretch; |
445863a2 RK |
258 | } |
259 | ||
260 | .inspector-breadcrumbs-button:last-of-type[checked]:-moz-locale-dir(rtl) { | |
82b4252f | 261 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-selected.png") 2 13 2 13 fill stretch; |
445863a2 RK |
262 | } |
263 | ||
0142a07b | 264 | .inspector-breadcrumbs-button[siblings-menu-open]:last-of-type[checked]:-moz-locale-dir(rtl), |
445863a2 | 265 | .inspector-breadcrumbs-button:last-of-type[checked]:hover:active:-moz-locale-dir(rtl) { |
82b4252f | 266 | border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-selected-pressed.png") 2 13 2 13 fill stretch; |
445863a2 | 267 | } |
56ab361a RK |
268 | |
269 | #inspector-searchbox { | |
270 | transition-property: max-width, -moz-padding-end, -moz-padding-start; | |
271 | transition-duration: 250ms; | |
272 | transition-timing-function: ease; | |
273 | } | |
274 | ||
275 | #inspector-searchbox:not([focused]):not([filled]) > .textbox-input-box { | |
276 | overflow: hidden; | |
277 | } | |
278 | ||
279 | #inspector-searchbox:not([focused]):not([filled]) { | |
280 | max-width: 20px !important; | |
281 | -moz-padding-end: 6px; | |
282 | -moz-padding-start: 22px; | |
283 | background-position: 8px center, top left, top left; | |
284 | } | |
285 | ||
286 | #inspector-searchbox[focused], | |
287 | #inspector-searchbox[filled] { | |
288 | max-width: 200px !important; | |
289 | } |