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 420 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
431 | 431 |
432 #share-popup.visible | 432 #share-popup.visible |
433 { | 433 { |
434 -webkit-transition-duration: 0.15s; | 434 -webkit-transition-duration: 0.15s; |
435 -moz-transition-duration: 0.15s; | 435 -moz-transition-duration: 0.15s; |
436 -o-transition-duration: 0.15s; | 436 -o-transition-duration: 0.15s; |
437 -ms-transition-duration: 0.15s; | 437 -ms-transition-duration: 0.15s; |
438 transition-duration: 0.15s; | 438 transition-duration: 0.15s; |
439 } | 439 } |
440 | 440 |
| 441 .toggle |
| 442 { |
| 443 cursor: pointer; |
| 444 display: inline-block; |
| 445 width: 69px; |
| 446 border-radius: 9999px; |
| 447 box-shadow: 0 0 0 1px #999; |
| 448 overflow: hidden; |
| 449 } |
| 450 |
| 451 .toggle-on, .toggle-off, .toggle-blob |
| 452 { |
| 453 height: 22px; |
| 454 font-size: 11px; |
| 455 font-weight: 500; |
| 456 text-align: center; |
| 457 line-height: 22px; |
| 458 float: left; |
| 459 } |
| 460 |
| 461 .toggle-inner, .toggle-on, .toggle-off, .toggle-blob |
| 462 { |
| 463 -moz-transition: all 0.2s; |
| 464 -webkit-transition: all 0.2s; |
| 465 transition: all 0.2s; |
| 466 } |
| 467 |
| 468 .toggle-inner |
| 469 { |
| 470 width: 185px; |
| 471 } |
| 472 |
| 473 .toggle-blob |
| 474 { |
| 475 position: relative; |
| 476 width: 22px; |
| 477 border-radius: 50px; |
| 478 box-shadow: 1px 1px 2px #888; |
| 479 background: #cfcfcf; |
| 480 background: -moz-linear-gradient(bottom, #cfcfcf 0%, #f5f5f5 100%); |
| 481 background: -webkit-linear-gradient(bottom, #cfcfcf 0%,#f5f5f5 100%); |
| 482 background: linear-gradient(to top, #cfcfcf 0%,#f5f5f5 100%); |
| 483 z-index: 99; |
| 484 } |
| 485 |
| 486 .toggle-blob:hover |
| 487 { |
| 488 background: #e4e4e4; |
| 489 background: -moz-linear-gradient(top, #e4e4e4 0%, #f9f9f9 100%); |
| 490 background: -webkit-linear-gradient(top, #e4e4e4 0%,#f9f9f9 100%); |
| 491 background: linear-gradient(to bottom, #e4e4e4 0%,#f9f9f9 100%); |
| 492 } |
| 493 |
| 494 .toggle-on |
| 495 { |
| 496 color: rgba(255,255,255, 0.8); |
| 497 text-shadow: 1px 1px rgba(0,0,0,0.2); |
| 498 box-shadow: inset 2px 2px 6px rgba(0,0,0,0.2); |
| 499 background: rgb(69,163,31); |
| 500 } |
| 501 |
| 502 .toggle-off |
| 503 { |
| 504 width: 59px; |
| 505 margin-left: -11px; |
| 506 text-indent: 11px; |
| 507 color: rgba(0,0,0,0.6); |
| 508 text-shadow: 1px 1px rgba(255,255,255,0.2); |
| 509 background: #cfcfcf; |
| 510 background: -moz-linear-gradient(top, #cfcfcf 0%, #f5f5f5 100%); |
| 511 background: -webkit-linear-gradient(top, #cfcfcf 0%,#f5f5f5 100%); |
| 512 background: linear-gradient(to bottom, #cfcfcf 0%,#f5f5f5 100%); |
| 513 } |
| 514 |
| 515 .disable .toggle-inner |
| 516 { |
| 517 margin-left: 0px; |
| 518 } |
| 519 |
| 520 .disable .toggle-blob |
| 521 { |
| 522 margin-left: -11px; |
| 523 } |
| 524 |
| 525 .disable .toggle-on |
| 526 { |
| 527 width: 59px; |
| 528 text-indent: -11px; |
| 529 } |
| 530 |
| 531 .enable .toggle-inner |
| 532 { |
| 533 margin-left: -75px; |
| 534 } |
| 535 |
| 536 .enable .toggle-blob |
| 537 { |
| 538 margin-left: -17.5px; |
| 539 } |
| 540 |
| 541 .enable .toggle-on |
| 542 { |
| 543 width: 92.5px; |
| 544 text-indent: -17.5px; |
| 545 } |
| 546 |
441 /* Adjust font size on smaller screens */ | 547 /* Adjust font size on smaller screens */ |
442 @media (max-height: 800px) | 548 @media (max-height: 800px) |
443 { | 549 { |
444 body | 550 body |
445 { | 551 { |
446 font-size: 19px; | 552 font-size: 19px; |
447 } | 553 } |
448 } | 554 } |
449 | 555 |
450 @media (max-height: 750px) | 556 @media (max-height: 750px) |
451 { | 557 { |
452 body | 558 body |
453 { | 559 { |
454 font-size: 17px; | 560 font-size: 17px; |
455 } | 561 } |
456 } | 562 } |
457 | 563 |
458 @media (max-height: 700px) | 564 @media (max-height: 700px) |
459 { | 565 { |
460 body | 566 body |
461 { | 567 { |
462 font-size: 16px; | 568 font-size: 16px; |
463 } | 569 } |
464 } | 570 } |
OLD | NEW |