Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Side by Side Diff: chrome/skin/firstRun.css

Issue 10860047: New toggle button on First-run page (Closed)
Patch Set: Created June 7, 2013, 12:19 p.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View unified diff | Download patch
OLDNEW
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
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 }
OLDNEW
« chrome/content/ui/firstRun.js ('K') | « chrome/locale/en-US/firstRun.properties ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld