Commit | Line | Data |
---|---|---|
9099c61d 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/. */ | |
da9978ec | 4 | |
e0c47e26 | 5 | :root { |
da9978ec | 6 | background: #000000; |
e0c47e26 | 7 | color: #FF9F00; |
da9978ec | 8 | } |
e0c47e26 | 9 | |
da9978ec RK |
10 | /* Take away these two :visited rules to get a core dumper */ |
11 | /* See https://bugzilla.mozilla.org/show_bug.cgi?id=575675#c30 */ | |
e0c47e26 | 12 | .link, |
da9978ec | 13 | .link:visited { |
e0c47e26 | 14 | color: #0091ff; |
da9978ec | 15 | } |
e0c47e26 RK |
16 | .link, |
17 | .helplink, | |
18 | .link:visited, | |
19 | .helplink:visited { | |
da9978ec | 20 | text-decoration: none; |
da9978ec | 21 | } |
eec397be RK |
22 | link:hover { |
23 | text-decoration: underline; | |
24 | } | |
e0c47e26 | 25 | |
e0c47e26 | 26 | .helplink { |
e0c47e26 RK |
27 | height: 14px; |
28 | width: 0; | |
29 | overflow: hidden; | |
30 | -moz-padding-start: 14px; | |
31 | background-image: url("chrome://browser/skin/devtools/goto-mdn.png"); | |
32 | -moz-margin-end: 2px; | |
c5772fdf | 33 | cursor: pointer; |
e0c47e26 RK |
34 | } |
35 | ||
c5772fdf | 36 | .property-view:not(:hover) > .helplink-container { |
e0c47e26 RK |
37 | visibility: hidden; |
38 | } | |
39 | ||
da9978ec | 40 | .rulelink { |
e0c47e26 | 41 | color: -moz-dialogtext; |
c5772fdf | 42 | padding: 0; |
eec397be | 43 | cursor: pointer; |
da9978ec RK |
44 | } |
45 | ||
46 | .expander { | |
e0c47e26 RK |
47 | width: 9px; |
48 | height: 9px; | |
49 | -moz-margin-start: 5px; | |
da9978ec | 50 | -moz-margin-end: 5px; |
7bc075b6 | 51 | background: url("chrome://global/skin/tree/twisty-closed.gif") center center no-repeat; |
c5772fdf | 52 | vertical-align: middle; |
da9978ec RK |
53 | } |
54 | ||
e0c47e26 | 55 | .expander[open] { |
7bc075b6 | 56 | background-image: url("chrome://global/skin/tree/twisty-open.gif"); |
da9978ec RK |
57 | } |
58 | ||
e0c47e26 RK |
59 | .match { |
60 | visibility: hidden; | |
61 | } | |
62 | ||
8d7ef0d9 RK |
63 | .expandable { |
64 | cursor: pointer; | |
e0c47e26 RK |
65 | visibility: visible; |
66 | } | |
67 | ||
7bc075b6 RK |
68 | .expander-container { |
69 | vertical-align: text-top; | |
70 | } | |
71 | ||
da9978ec | 72 | .property-name { |
7bc075b6 | 73 | padding: 2px 0; |
da9978ec | 74 | color: #FF9F00; |
e0c47e26 | 75 | width: 220px; |
da9978ec | 76 | } |
7bc075b6 | 77 | |
da9978ec | 78 | .property-value { |
c5772fdf | 79 | padding: 0; |
7bc075b6 | 80 | -moz-padding-end: 6px; |
e0c47e26 | 81 | color: #8050B0; |
c5772fdf RK |
82 | width: 100%; |
83 | } | |
84 | ||
c5772fdf RK |
85 | .rule-link { |
86 | text-align: end; | |
87 | -moz-padding-start: 10px; | |
88 | } | |
89 | ||
90 | /* This rule is necessary because Templater.jsm breaks LTR TDs in RTL docs */ | |
91 | .rule-text { | |
92 | direction: ltr; | |
93 | padding: 0; | |
94 | -moz-padding-start: 20px; | |
8d7ef0d9 | 95 | vertical-align: text-bottom; |
c5772fdf RK |
96 | } |
97 | ||
98 | .bestmatch { | |
99 | color: #FFCF00; | |
100 | } | |
101 | .matched { | |
102 | text-decoration: line-through; | |
103 | } | |
104 | .parentmatch { | |
105 | color: #E7ADE7; | |
da9978ec RK |
106 | } |
107 | ||
e0c47e26 | 108 | #propertyContainer { |
c5772fdf | 109 | border-collapse: collapse; |
da9978ec RK |
110 | } |
111 | ||
e0c47e26 RK |
112 | .darkrow { |
113 | background-color: #404000; | |
da9978ec RK |
114 | } |
115 | ||
e0c47e26 RK |
116 | #noResults { |
117 | font-size: 18px; | |
118 | margin-top: 5px; | |
119 | text-align: center; | |
da9978ec RK |
120 | } |
121 | ||
e0c47e26 RK |
122 | .headerControls { |
123 | color: #9C9CFF; | |
da9978ec RK |
124 | background-color: #000000; |
125 | } | |
126 | ||
e0c47e26 RK |
127 | .onlyuserstyles { |
128 | cursor: pointer; | |
129 | font-size: 11px; | |
da9978ec | 130 | } |
e0c47e26 | 131 | |
e0c47e26 RK |
132 | #footer { |
133 | border-top: 1px solid #9C9CFF; | |
da9978ec RK |
134 | } |
135 | ||
e0c47e26 RK |
136 | .legendKey { |
137 | margin: 0 5px; | |
da9978ec RK |
138 | } |
139 | ||
e0c47e26 RK |
140 | /** |
141 | * CSS Rule View | |
142 | */ | |
143 | ||
144 | .ruleview { | |
145 | background-color: #000000; | |
146 | } | |
147 | ||
148 | .ruleview-rule-source { | |
c29b709d RK |
149 | color: #9C9CFF; /* original: green */ |
150 | -moz-padding-start: 5px; | |
eec397be | 151 | cursor: pointer; |
c29b709d RK |
152 | text-align: right; |
153 | float: right; | |
154 | -moz-user-select: -moz-none; | |
155 | } | |
156 | ||
157 | .ruleview-rule-inheritance { | |
158 | background-color: #000000; | |
159 | color: #8050B0; | |
160 | border-top: 1px solid #9C9CFF; | |
161 | border-bottom: 1px solid #9C9CFF; | |
162 | padding: 1px 4px; | |
163 | margin-top: 4px; | |
164 | -moz-user-select: -moz-none; | |
eec397be RK |
165 | } |
166 | ||
167 | .ruleview-rule-source:hover { | |
168 | text-decoration: underline; | |
e0c47e26 RK |
169 | } |
170 | ||
c29b709d RK |
171 | .ruleview-rule { |
172 | padding: 2px 4px; | |
173 | } | |
174 | ||
175 | .ruleview-rule + .ruleview-rule { | |
176 | border-top: 1px dotted #008484; | |
e0c47e26 RK |
177 | } |
178 | ||
8d7ef0d9 RK |
179 | .ruleview-warning { |
180 | background: url("chrome://browser/skin/devtools/alerticon-warning.png"); | |
181 | -moz-margin-start: 5px; | |
182 | vertical-align: middle; | |
183 | width: 13px; | |
184 | height: 12px; | |
185 | } | |
186 | ||
c5772fdf RK |
187 | .ruleview-ruleopen { |
188 | -moz-padding-end: 5px; | |
189 | } | |
190 | ||
8d7ef0d9 | 191 | .ruleview-ruleclose { |
37953ab4 | 192 | cursor: text; |
8d7ef0d9 RK |
193 | padding-right: 20px; |
194 | } | |
195 | ||
e0c47e26 RK |
196 | .ruleview-propertylist { |
197 | list-style: none; | |
198 | padding: 0; | |
199 | margin: 0; | |
200 | } | |
201 | ||
202 | .ruleview-enableproperty { | |
203 | height: 10px; | |
204 | width: 10px; | |
c29b709d | 205 | -moz-margin-start: 1px; |
e0c47e26 | 206 | -moz-margin-end: 0; |
c29b709d RK |
207 | transition: opacity 100ms; |
208 | transition-delay: 200ms; | |
209 | } | |
210 | ||
d7cfd768 | 211 | .ruleview-property:not(:hover) > .ruleview-enableproperty[checked] { |
c29b709d RK |
212 | opacity: 0; |
213 | transition: none; | |
e0c47e26 RK |
214 | } |
215 | ||
216 | .ruleview-expander { | |
e0c47e26 RK |
217 | width: 8px; |
218 | height: 8px; | |
219 | background: url("chrome://browser/skin/devtools/arrows.png") 24px 0; | |
da9978ec | 220 | cursor: pointer; |
e0c47e26 RK |
221 | -moz-margin-start: 2px; |
222 | -moz-margin-end: 5px; | |
223 | } | |
224 | ||
e0c47e26 RK |
225 | .ruleview-expander.styleinspector-open { |
226 | background-position: 8px 0; | |
227 | } | |
228 | ||
229 | .ruleview-newproperty { | |
230 | /* (enable checkbox width: 12px) + (expander width: 15px) */ | |
231 | -moz-margin-start: 27px; | |
232 | } | |
233 | ||
234 | .ruleview-propertyname { | |
e0c47e26 | 235 | padding: 1px 0; |
c29b709d RK |
236 | color: #9C9CFF; /* original: blue */ |
237 | } | |
238 | ||
239 | .ruleview-propertyvalue { | |
240 | padding: 1px 0; | |
e0c47e26 RK |
241 | } |
242 | ||
37953ab4 RK |
243 | .ruleview-namecontainer, |
244 | .ruleview-propertycontainer, | |
245 | .ruleview-propertyname, | |
e0c47e26 | 246 | .ruleview-propertyvalue { |
e0c47e26 RK |
247 | text-decoration: inherit; |
248 | } | |
249 | ||
250 | .ruleview-computedlist { | |
251 | list-style: none; | |
252 | padding: 0; | |
253 | } | |
254 | ||
255 | .ruleview-computed { | |
256 | -moz-margin-start: 4em; | |
257 | } | |
258 | ||
259 | .ruleview-overridden { | |
260 | text-decoration: line-through; | |
261 | } | |
262 | ||
263 | .styleinspector-propertyeditor { | |
264 | border: 1px solid #9C9CFF; | |
265 | padding: 0; | |
da9978ec | 266 | } |
85cfb236 RK |
267 | |
268 | .ruleview-property { | |
269 | border-left: 2px solid transparent; | |
270 | } | |
271 | ||
272 | .ruleview-property[dirty] { | |
273 | border-left-color: #008484; | |
37953ab4 RK |
274 | } |
275 | ||
276 | .ruleview-namecontainer > .ruleview-propertyname, | |
277 | .ruleview-propertycontainer > .ruleview-propertyvalue { | |
c29b709d | 278 | border-bottom: 1px dashed transparent; |
37953ab4 RK |
279 | } |
280 | ||
281 | .ruleview-namecontainer:hover > .ruleview-propertyname, | |
282 | .ruleview-propertycontainer:hover > .ruleview-propertyvalue { | |
283 | border-bottom-color: #9C9CFF; | |
284 | } | |
7bc075b6 RK |
285 | |
286 | .ruleview-selector-separator, .ruleview-selector-unmatched { | |
287 | color: #8050B0; | |
288 | } |