OLD | NEW |
1 /* | 1 /* |
2 * This file is part of Adblock Plus <http://adblockplus.org/>, | 2 * This file is part of Adblock Plus <http://adblockplus.org/>, |
3 * Copyright (C) 2006-2013 Eyeo GmbH | 3 * Copyright (C) 2006-2013 Eyeo GmbH |
4 * | 4 * |
5 * Adblock Plus is free software: you can redistribute it and/or modify | 5 * Adblock Plus is free software: you can redistribute it and/or modify |
6 * it under the terms of the GNU General Public License version 3 as | 6 * it under the terms of the GNU General Public License version 3 as |
7 * published by the Free Software Foundation. | 7 * published by the Free Software Foundation. |
8 * | 8 * |
9 * Adblock Plus is distributed in the hope that it will be useful, | 9 * Adblock Plus is distributed in the hope that it will be useful, |
10 * but WITHOUT ANY WARRANTY; without even the implied warranty of | 10 * but WITHOUT ANY WARRANTY; without even the implied warranty of |
(...skipping 145 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
156 width: 99px; | 156 width: 99px; |
157 display: block; | 157 display: block; |
158 background-image: url(abp-icon-big.png); | 158 background-image: url(abp-icon-big.png); |
159 background-repeat: no-repeat; | 159 background-repeat: no-repeat; |
160 } | 160 } |
161 | 161 |
162 #can-do-more | 162 #can-do-more |
163 { | 163 { |
164 max-width: 960px; | 164 max-width: 960px; |
165 padding: 40px 0px 0px 0px; | 165 padding: 40px 0px 0px 0px; |
| 166 border-bottom: 4px solid #968D81; |
166 } | 167 } |
167 | 168 |
168 #can-do-more > h2 | 169 #can-do-more > h2 |
169 { | 170 { |
170 margin: 0 100px; | 171 margin: 0 100px; |
171 } | 172 } |
172 | 173 |
173 .fade | |
174 { | |
175 opacity: 0; | |
176 } | |
177 | |
178 .hide | |
179 { | |
180 display: none; | |
181 } | |
182 | |
183 #can-do-more-overview | |
184 { | |
185 opacity: 1; | |
186 max-height: 10000px; | |
187 max-width: 760px; | |
188 margin: 30px 100px 0 100px; | |
189 font-size: 0px; | |
190 /* hides appearing spacings because of | |
191 * using display: inline-block*/ | |
192 cursor: pointer; | |
193 transition: opacity 0.3s ease-in-out; | |
194 -webkit-transition: opacity 0.3s ease-in-out; | |
195 } | |
196 | |
197 #can-do-more.expanded > #can-do-more-overview, #can-do-more.expanded > #can-do-m
ore-overview li, #can-do-more.expanded > #can-do-more-overview div, #can-do-more
.expanded > #can-do-more-overview h4 | |
198 { | |
199 opacity: 0; | |
200 max-height: 0px; | |
201 width: 0; | |
202 margin: 0; | |
203 padding: 0; | |
204 transition: none; | |
205 -webkit-transition: none; | |
206 } | |
207 | |
208 #can-do-more-overview > li:hover | |
209 { | |
210 background-image: url("background-main.png"); | |
211 text-decoration: none; | |
212 } | |
213 | |
214 #can-do-more-overview > li | |
215 { | |
216 width: 230px; | |
217 height: 115px; | |
218 display: inline-block; | |
219 border-right: 1px dashed #c7c6c2; | |
220 padding: 20px 10px 0 10px; | |
221 vertical-align: top; | |
222 text-decoration: underline; | |
223 -webkit-backface-visibility: hidden; | |
224 /* hides the 1px movement chrome bug | |
225 * which appears while transition. | |
226 */ | |
227 } | |
228 | |
229 #can-do-more-overview > li > div | |
230 { | |
231 width: 59px; | |
232 height: 59px; | |
233 display: block; | |
234 margin: 0 auto; | |
235 } | |
236 | |
237 #can-do-more-overview > li > h4 | |
238 { | |
239 margin: 15px 0 0 0; | |
240 } | |
241 | |
242 #can-do-more #feature-first | |
243 { | |
244 border-left: 1px dashed #c7c6c2; | |
245 } | |
246 | |
247 .feature-malware-image | 174 .feature-malware-image |
248 { | 175 { |
249 background-image: url(features/malware.png); | 176 background-image: url(features/malware.png); |
250 background-repeat: no-repeat; | 177 background-repeat: no-repeat; |
251 } | 178 } |
252 | 179 |
253 .feature-social-image | 180 .feature-social-image |
254 { | 181 { |
255 background-image: url(features/social.png); | 182 background-image: url(features/social.png); |
256 background-repeat: no-repeat; | 183 background-repeat: no-repeat; |
257 } | 184 } |
258 | 185 |
259 .feature-tracking-image | 186 .feature-tracking-image |
260 { | 187 { |
261 background-image: url(features/tracking.png); | 188 background-image: url(features/tracking.png); |
262 background-repeat: no-repeat; | 189 background-repeat: no-repeat; |
263 } | 190 } |
264 | 191 |
265 #can-do-more-expanded | 192 #can-do-more-content |
266 { | 193 { |
267 opacity: 0; | 194 margin: 30px 100px 20px 100px; |
268 max-height: 0; | |
269 } | 195 } |
270 | 196 |
271 #can-do-more.expanded > #can-do-more-expanded | 197 #can-do-more #features |
272 { | |
273 opacity: 1; | |
274 max-height: 10000px; | |
275 margin: 30px 100px 0 100px; | |
276 transition: opacity 0.5s ease-in-out; | |
277 -webkit-transition: opacity 0.5s ease-in-out; | |
278 transition-delay: 0.2s; | |
279 -webkit-transition-delay: 0.2s; | |
280 } | |
281 | |
282 #features, .feature:not([hidden]), .feature-image, .feature-description, .featur
e-description, .feature-description-textblock, .feature-description-textblock >
span, .feature-image | |
283 { | |
284 width: 0; | |
285 height: 0; | |
286 margin: 0; | |
287 padding: 0; | |
288 transition: none; | |
289 -webkit-transition: none; | |
290 } | |
291 | |
292 | |
293 #can-do-more.expanded #features,#can-do-more.expanded .feature:not([hidden]),#ca
n-do-more.expanded .feature-image,#can-do-more.expanded .feature-description,#ca
n-do-more.expanded .feature-description,#can-do-more.expanded .feature-descripti
on-textblock,#can-do-more.expanded .feature-description-textblock > span,#can-do
-more.expanded .feature-image | |
294 { | |
295 width: auto; | |
296 height: auto; | |
297 margin: auto; | |
298 padding: auto; | |
299 transition-property: all; | |
300 -webkit-transition-property: all; | |
301 transition-duration: 0.5s; | |
302 -webkit-transition-duration: 0.5s; | |
303 transition-timing-function: ease-in-out; | |
304 -webkit-transition-timing-function: ease-in-out; | |
305 } | |
306 | |
307 #can-do-more.expanded #features | |
308 { | 198 { |
309 border-spacing: 10px; | 199 border-spacing: 10px; |
310 margin: 0px; | 200 margin: 0px; |
311 padding: 0px; | 201 padding: 0px; |
312 } | 202 } |
313 | 203 |
314 #can-do-more.expanded .feature:not([hidden]) | 204 #can-do-more .feature:not([hidden]) |
315 { | 205 { |
316 display: block; | 206 display: block; |
317 list-style-type: none; | 207 list-style-type: none; |
318 padding: 30px 0; | 208 padding: 30px 0; |
319 padding-bottom: 20px; | 209 padding-bottom: 20px; |
320 border-top: 1px dashed #c0bebb; | 210 border-top: 1px dashed #c0bebb; |
321 } | 211 } |
322 | 212 |
323 #can-do-more.expanded .feature-image, #can-do-more.expanded .feature-description | 213 #can-do-more .feature-image, #can-do-more .feature-description |
324 { | 214 { |
325 display: inline-block; | 215 display: inline-block; |
326 *display: inline; /* IE6 inline-block fix */ | 216 *display: inline; /* IE6 inline-block fix */ |
327 *zoom: 1; | 217 *zoom: 1; |
328 vertical-align: top; | 218 vertical-align: top; |
329 } | 219 } |
330 | 220 |
331 #can-do-more.expanded .feature-description | 221 #can-do-more .feature-description |
332 { | 222 { |
333 margin: 0px 0px 0 20px; | 223 margin: 0px 0px 0 20px; |
334 width: 625px; | 224 width: 625px; |
335 max-width: 85%; | 225 max-width: 85%; |
336 } | 226 } |
337 | 227 |
338 #can-do-more.expanded .feature-description-textblock | 228 #can-do-more .feature-description-textblock |
339 { | 229 { |
340 width: 480px; | 230 width: 480px; |
341 max-width: 100%; | 231 max-width: 100%; |
342 margin: 0 40px 0 0; | 232 margin: 0 40px 0 0; |
343 display: inline-block; | 233 display: inline-block; |
344 } | 234 } |
345 | 235 |
346 #can-do-more.expanded .feature-description-textblock > span | 236 #can-do-more .feature-description-textblock > span |
347 { | 237 { |
348 margin: 15px 0 0 0; | 238 margin: 15px 0 0 0; |
349 } | 239 } |
350 | 240 |
351 #can-do-more.expanded .feature-image | 241 #can-do-more .feature-image |
352 { | 242 { |
353 width: 59px; | 243 width: 59px; |
354 height: 59px; | 244 height: 59px; |
355 margin: 8px 0 10px 20px; | 245 margin: 8px 0 10px 20px; |
356 } | 246 } |
357 | 247 |
358 #activate-features | |
359 { | |
360 width: 100%; | |
361 background-image: url("background-candomore.png"); | |
362 margin: 30px 0 0 0; | |
363 padding: 14px 0 14px 0; | |
364 cursor: pointer; | |
365 text-align: center; | |
366 white-space: nowrap; | |
367 } | |
368 | |
369 #activate-features-label | |
370 { | |
371 display: inline-block; | |
372 width: 86%; | |
373 color: #fff; | |
374 font-size: 22px; | |
375 text-align: center; | |
376 font-style: italic; | |
377 font-family: CreteRound, Helvetica, Arial, sans-serif; | |
378 -webkit-transition: opacity 0.5s ease-in-out; | |
379 transition: opacity 0.5s ease-in-out; | |
380 } | |
381 | |
382 #can-do-more.expanded #label-show-expanded | |
383 { | |
384 display: none; | |
385 } | |
386 | |
387 #can-do-more.expanded #label-show-overview | |
388 { | |
389 display: block; | |
390 } | |
391 | |
392 #label-show-expanded | |
393 { | |
394 display: block; | |
395 } | |
396 | |
397 #label-show-overview | |
398 { | |
399 display: none; | |
400 } | |
401 | |
402 #activate-features:hover a | |
403 { | |
404 color: #1f6822; | |
405 text-decoration: none; | |
406 } | |
407 | |
408 #can-do-more.expanded .arrow | |
409 { | |
410 background-image: url("arrow-up.png"); | |
411 } | |
412 | |
413 .arrow | |
414 { | |
415 width: 29px; | |
416 height: 22px; | |
417 vertical-align: bottom; | |
418 display: inline-block; | |
419 background-image: url("arrow-down.png"); | |
420 } | |
421 | |
422 #share | 248 #share |
423 { | 249 { |
424 background-image: url(background-share.png); | 250 background-image: url(background-share.png); |
425 padding: 50px 100px 40px 100px; | 251 padding: 50px 100px 40px 100px; |
426 max-width: 760px; | 252 max-width: 760px; |
427 text-align: center; | 253 text-align: center; |
428 font-family: CreteRound, Helvetica, Arial, sans-serif; | 254 font-family: CreteRound, Helvetica, Arial, sans-serif; |
429 } | 255 } |
430 | 256 |
431 #share h2 | 257 #share h2 |
(...skipping 22 matching lines...) Expand all Loading... |
454 } | 280 } |
455 | 281 |
456 #donate:hover, .share-buttons a:hover | 282 #donate:hover, .share-buttons a:hover |
457 { | 283 { |
458 box-shadow: 0px 0px 0px 2px #8ca7c4; | 284 box-shadow: 0px 0px 0px 2px #8ca7c4; |
459 border-radius: 30px; | 285 border-radius: 30px; |
460 } | 286 } |
461 | 287 |
462 #donate-block span, #share-block span | 288 #donate-block span, #share-block span |
463 { | 289 { |
464 margin: 13px 20px 10px 20px; | 290 margin: 10px 20px 0px 20px; |
465 } | 291 } |
466 | 292 |
467 #donate-block, #share-block | 293 #donate-block, #share-block |
468 { | 294 { |
469 min-width: 250px; | 295 min-width: 250px; |
470 display: inline-block; | 296 display: inline-block; |
471 vertical-align: top; | 297 vertical-align: top; |
472 padding: 20px 0 0 0; | 298 padding: 5px 0 5px 0; |
473 } | 299 } |
474 | 300 |
475 #donate-block | 301 #donate-block |
476 { | 302 { |
477 border: 1px dashed #37506d; | 303 border: 1px dashed #37506d; |
478 border-style: none dashed; | 304 border-style: none dashed; |
479 width: 50%; | 305 width: 50%; |
480 } | 306 } |
481 | 307 |
482 #share-block | 308 #share-block |
(...skipping 270 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
753 background-image: url(donate.png); | 579 background-image: url(donate.png); |
754 background-repeat: repeat-x; | 580 background-repeat: repeat-x; |
755 } | 581 } |
756 | 582 |
757 footer | 583 footer |
758 { | 584 { |
759 margin: 0 auto 30px; | 585 margin: 0 auto 30px; |
760 max-width: 960px; | 586 max-width: 960px; |
761 text-align: center; | 587 text-align: center; |
762 } | 588 } |
OLD | NEW |