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

Side by Side Diff: skin/options.css

Issue 29336364: issue 2377 - Finish design of Advanced tab of new options page (Closed)
Patch Set: Rebased to changeset #78 Created April 20, 2016, 2:14 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
« no previous file with comments | « options.html ('k') | skin/options-sprite.png » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 /* 1 /*
2 * This file is part of Adblock Plus <https://adblockplus.org/>, 2 * This file is part of Adblock Plus <https://adblockplus.org/>,
3 * Copyright (C) 2006-2016 Eyeo GmbH 3 * Copyright (C) 2006-2016 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 37 matching lines...) Expand 10 before | Expand all | Expand 10 after
48 body 48 body
49 { 49 {
50 background-color: #F5F5F5; 50 background-color: #F5F5F5;
51 display: flex; 51 display: flex;
52 margin: 20px 10px; 52 margin: 20px 10px;
53 font-family: "Source Sans Pro", sans-serif; 53 font-family: "Source Sans Pro", sans-serif;
54 font-size: 14px; 54 font-size: 14px;
55 color: #494949; 55 color: #494949;
56 } 56 }
57 57
58 h1 58 h1
59 { 59 {
60 font-size: 24px; 60 font-size: 24px;
61 line-height: 1em; 61 line-height: 1em;
62 font-weight: 300; 62 font-weight: 300;
63 } 63 }
64 64
65 h2 65 h2
66 { 66 {
67 font-size: 16px; 67 font-size: 16px;
68 font-weight: 600; 68 font-weight: 600;
(...skipping 15 matching lines...) Expand all
84 [aria-hidden="true"] 84 [aria-hidden="true"]
85 { 85 {
86 display: none !important; 86 display: none !important;
87 } 87 }
88 88
89 input[type="search"]::-webkit-search-cancel-button 89 input[type="search"]::-webkit-search-cancel-button
90 { 90 {
91 display: none; 91 display: none;
92 } 92 }
93 93
94 input[type="text"], input[type="search"] 94 input[type="text"],
95 input[type="search"],
96 textarea
95 { 97 {
96 -webkit-box-sizing: border-box; 98 -webkit-box-sizing: border-box;
97 -moz-box-sizing: border-box; 99 -moz-box-sizing: border-box;
98 box-sizing: border-box; 100 box-sizing: border-box;
99 } 101 }
100 102
101 button[role="checkbox"] 103 button[role="checkbox"]
102 { 104 {
103 vertical-align: top; 105 vertical-align: top;
104 width: 18px; 106 width: 18px;
105 height: 18px; 107 height: 18px;
106 margin-top: 0px; 108 margin-top: 0px;
107 -moz-margin-end: 20px; 109 -moz-margin-end: 20px;
108 -webkit-margin-end: 20px; 110 -webkit-margin-end: 20px;
109 padding: 0px; 111 padding: 0px;
110 border: none; 112 border: none;
111 background-color: transparent; 113 background-color: transparent;
112 background-position: -51px 0px; 114 background-position: -51px 0px;
113 } 115 }
114 116
115 button[role="checkbox"][aria-checked="true"] 117 button[role="checkbox"][aria-checked="true"]
116 { 118 {
117 background-position: -68px 0px; 119 background-position: -68px 0px;
118 } 120 }
119 121
120 .option-name 122 .option-name
121 { 123 {
122 display: flex; 124 display: flex;
123 margin-bottom: 16px; 125 margin-bottom: 16px;
124 margin-top: 24px;
125 } 126 }
126 127
127 .option-name > :first-child 128 .option-name > :first-child
128 { 129 {
129 flex: 1; 130 flex: 1;
130 overflow: hidden; 131 overflow: hidden;
131 text-overflow: ellipsis; 132 text-overflow: ellipsis;
132 white-space: nowrap; 133 white-space: nowrap;
133 } 134 }
134 135
(...skipping 165 matching lines...) Expand 10 before | Expand all | Expand 10 after
300 border: 1px solid #CDCDCD; 301 border: 1px solid #CDCDCD;
301 border-radius: 8px; 302 border-radius: 8px;
302 box-sizing: border-box; 303 box-sizing: border-box;
303 min-width: 960px; 304 min-width: 960px;
304 padding: 0px 60px 40px 60px; 305 padding: 0px 60px 40px 60px;
305 } 306 }
306 307
307 #content h1 308 #content h1
308 { 309 {
309 border-bottom: 1px solid #CDCDCD; 310 border-bottom: 1px solid #CDCDCD;
310 margin: 0px; 311 margin: 0px 0px 24px 0px;
311 padding: 40px 0px 16px 0px; 312 padding: 40px 0px 16px 0px;
312 } 313 }
313 314
315 #content h1 > *,
316 #content h2 > *
317 {
318 display: inline-block;
319 }
320
314 #link-version 321 #link-version
315 { 322 {
316 display: flex; 323 display: flex;
317 margin: 12px 20px; 324 margin: 12px 20px;
318 color: #3A7BA6; 325 color: #3A7BA6;
319 text-decoration: none; 326 text-decoration: none;
320 } 327 }
321 328
322 #abp-version 329 #abp-version
323 { 330 {
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after
358 365
359 .table li 366 .table li
360 { 367 {
361 display: flex; 368 display: flex;
362 padding: 12px 0px; 369 padding: 12px 0px;
363 -webkit-padding-start: 16px; 370 -webkit-padding-start: 16px;
364 -moz-padding-start: 16px; 371 -moz-padding-start: 16px;
365 border-radius: 3px; 372 border-radius: 3px;
366 } 373 }
367 374
375 .table.list,
376 #custom-wrapper
377 {
378 border-bottom: 1px solid #CDCDCD;
379 }
380
368 .table.list li .display 381 .table.list li .display
369 { 382 {
370 flex: 1; 383 flex: 1;
371 line-height: 16px; 384 line-height: 16px;
372 overflow: hidden; 385 overflow: hidden;
373 text-overflow: ellipsis; 386 text-overflow: ellipsis;
374 white-space: nowrap; 387 white-space: nowrap;
375 } 388 }
376 389
390 .table:not(.list):not(.cols) li
391 {
392 padding-top: 0px;
393 padding-bottom: 6px;
394 }
395
377 .table.list li:nth-of-type(odd), 396 .table.list li:nth-of-type(odd),
378 .table.cols li:nth-of-type(odd), 397 .table.cols li:nth-of-type(odd),
379 .table li.empty-placeholder 398 .table li.empty-placeholder
380 { 399 {
381 background-color: #F5F5F5; 400 background-color: #F5F5F5;
382 } 401 }
383 402
384 .table label 403 .table label
385 { 404 {
386 vertical-align: top; 405 vertical-align: top;
387 } 406 }
388 407
389 .table.cols 408 .table.cols
390 { 409 {
391 border-bottom: 1px solid #CDCDCD; 410 border-bottom: 1px solid #CDCDCD;
392 border-top: 1px solid #CDCDCD; 411 border-top: 1px solid #CDCDCD;
393 } 412 }
394 413
395 button[disabled="true"] 414 button[disabled="true"]
396 { 415 {
397 border-radius: 2px; 416 border-radius: 2px;
398 background-color: #ccc; 417 background-color: #ccc;
399 } 418 }
400 419
401 .table button.delete 420 .table button.delete
402 { 421 {
403 background-color: transparent; 422 background-color: transparent;
404 background-position: -9px -32px; 423 background-position: -10px -33px;
405 border: 0px; 424 border: 0px;
406 height: 10px;
407 margin-top: 5px; 425 margin-top: 5px;
408 -moz-margin-end: 20px; 426 -moz-margin-end: 20px;
409 -webkit-margin-end: 20px; 427 -webkit-margin-end: 20px;
410 padding: 0px; 428 padding: 0px;
411 cursor: pointer;
412 width: 10px;
413 } 429 }
414 430
415 .table .popular 431 .table .popular
416 { 432 {
417 color: #1E8728; 433 color: #1E8728;
418 font-size: 12px; 434 font-size: 12px;
419 -moz-padding-end: 12px; 435 -moz-padding-end: 12px;
420 -webkit-padding-end: 12px; 436 -webkit-padding-end: 12px;
421 } 437 }
422 438
423 .tabs.horizontal 439 .tabs.horizontal
424 { 440 {
425 display: flex; 441 display: flex;
442 margin-top: 0px;
426 margin-bottom: 0px; 443 margin-bottom: 0px;
427 padding: 0px; 444 padding: 0px;
445 border-bottom: 1px solid #CDCDCD;
428 } 446 }
429 447
430 .tabs.horizontal li 448 .tabs.horizontal li
431 { 449 {
432 display: inline-block; 450 display: inline-block;
433 border-bottom: 1px solid #A1A1A1; 451 padding: 0px 46px 10px 46px;
434 padding: 10px 46px;
435 color: #3A7BA6; 452 color: #3A7BA6;
436 text-align: center; 453 text-align: center;
437 } 454 }
438 455
439 .icon, 456 .icon,
440 button[role="checkbox"], 457 button[role="checkbox"],
441 .table button.delete, 458 .table button.delete,
442 #content-help a::before, 459 #content-help a::before,
443 #dialog-close::before, 460 #dialog-close::before,
444 #custom-filters-add button::after, 461 #custom-filters-add button::after,
445 #dialog-body button::before, 462 #dialog-body button::before,
446 .date::before, 463 .date::before,
447 .time::before, 464 .time::before,
448 #all-filter-lists .arrow, 465 #all-filter-lists .arrow,
449 .context-menu .content a::before 466 .context-menu .content a::before
450 { 467 {
451 background-image: url(options-sprite.png); 468 background-image: url(options-sprite.png);
452 display: inline-block; 469 display: inline-block;
453 } 470 }
454 471
472 .icon-add,
473 .icon-update,
474 .icon-edit
475 {
476 height: 16px;
477 width: 16px;
478 cursor: pointer;
479 }
480
455 .icon-add 481 .icon-add
456 { 482 {
457 background-position: -0px -0px; 483 background-position: -1px -1px;
458 cursor: pointer;
459 height: 18px;
460 min-width: 18px;
461 } 484 }
462 485
463 .icon-update 486 .icon-update
464 { 487 {
465 background-position: -34px -0px; 488 background-position: -35px -1px;
466 cursor: pointer;
467 height: 18px;
468 width: 18px;
469 } 489 }
470 490
471 .icon-edit 491 .icon-edit
472 { 492 {
473 background-position: -17px -0px; 493 background-position: -18px -1px;
494 }
495
496 .icon-save,
497 .icon-cancel
498 {
499 height: 10px;
500 width: 10px;
474 cursor: pointer; 501 cursor: pointer;
475 height: 18px; 502 }
476 width: 18px; 503
504 .icon-save
505 {
506 background-position: -1px -62px;
507 }
508
509 .icon-cancel
510 {
511 background-position: -12px -62px;
512 }
513
514 .icon-enter,
515 #custom-filters-add button::after,
516 .table button.delete
517 {
518 height: 8px;
519 width: 8px;
520 cursor: pointer;
521 }
522
523 #dialog-close::before,
524 .date::before,
525 .time::before
526 {
527 content: "";
528 height: 12px;
529 width: 12px;
477 } 530 }
478 531
479 #content-help a::before, 532 #content-help a::before,
480 #dialog-body button::before 533 #dialog-body button::before
481 { 534 {
482 background-position: 0px -42px; 535 background-position: 0px -42px;
483 content: ""; 536 content: "";
484 cursor: pointer; 537 cursor: pointer;
485 height: 11px; 538 height: 11px;
486 vertical-align: middle; 539 vertical-align: middle;
487 width: 7px; 540 width: 7px;
488 -moz-margin-end: 12px; 541 -moz-margin-end: 12px;
489 -webkit-margin-end: 12px; 542 -webkit-margin-end: 12px;
490 } 543 }
491 544
492 .controls 545 .controls
493 { 546 {
494 border-top: 1px solid #CDCDCD; 547 padding-top: 14px;
495 padding-top: 8px; 548 margin-left: 16px;
496 -moz-padding-start: 16px; 549 margin-right: 16px;
497 -webkit-padding-start: 16px; 550 }
498 position: relative; 551
552 .controls.mode-edit
553 {
554 -moz-margin-end: 0px;
555 -webkit-margin-end: 0px;
499 } 556 }
500 557
501 .controls > div 558 .controls > div
502 { 559 {
503 display: flex; 560 display: flex;
561 position: relative;
504 } 562 }
505 563
506 .controls button, 564 .controls button,
507 #dialog-close 565 #dialog-close
508 { 566 {
567 display: flex;
568 border: none;
569 padding: 0px;
570 align-items: center;
509 background: none; 571 background: none;
510 border: none;
511 cursor: pointer; 572 cursor: pointer;
512 display: block;
513 padding: 0;
514 } 573 }
515 574
516 .controls button span:not(.icon) 575 .controls button span:not(.icon)
517 { 576 {
577 -moz-margin-start: 16px;
578 -webkit-margin-start: 16px;
518 color: #3A7BA6; 579 color: #3A7BA6;
519 display: inline-block;
520 -moz-margin-start: 15px;
521 -webkit-margin-start: 15px;
522 padding-top: 1px;
523 vertical-align: top; 580 vertical-align: top;
524 } 581 }
525 582
526 /* 583 /*
527 General tab content 584 General tab content
528 */ 585 */
529 586
587 #acceptableads-table,
588 #recommend-list-table,
589 #blocking-languages-dialog-table,
590 #custom-wrapper .table,
591 #all-lang-table
592 {
593 border-bottom: none;
594 }
595
530 #blocking-languages, 596 #blocking-languages,
531 #acceptable-ads 597 #acceptable-ads
532 { 598 {
533 -moz-margin-end: 40px; 599 -moz-margin-end: 40px;
534 -webkit-margin-end: 40px; 600 -webkit-margin-end: 40px;
535 } 601 }
536 602
537 #custom-wrapper 603 #custom-wrapper
538 { 604 {
539 height: 290px; 605 height: 290px;
540 overflow: auto; 606 overflow: auto;
541 } 607 }
542 608
543 #custom-wrapper .table 609 #custom-wrapper .table
544 { 610 {
545 width: 100%; 611 width: 100%;
546 } 612 }
547 613
548 #whitelisting .controls
549 {
550 -moz-padding-start: 12px;
551 -webkit-padding-start: 12px;
552 }
553
554 #whitelisting .controls.mode-edit > button, 614 #whitelisting .controls.mode-edit > button,
555 #whitelisting .controls:not(.mode-edit) > div 615 #whitelisting .controls:not(.mode-edit) > div
556 { 616 {
557 display: none; 617 display: none;
558 } 618 }
559 619
560 #whitelisting .controls input[type="text"] 620 #whitelisting .controls input[type="text"]
561 { 621 {
562 border: 0px; 622 border: 0px;
563 border-bottom: 1px solid #A1A1A1; 623 border-bottom: 1px solid #A1A1A1;
(...skipping 19 matching lines...) Expand all
583 -webkit-margin-start: 32px; 643 -webkit-margin-start: 32px;
584 } 644 }
585 645
586 #whitelisting-add-button + span 646 #whitelisting-add-button + span
587 { 647 {
588 flex: 1; 648 flex: 1;
589 } 649 }
590 650
591 .icon-enter 651 .icon-enter
592 { 652 {
593 background-position: -18px -32px; 653 background-position: -19px -33px;
594 cursor: pointer;
595 height: 10px;
596 position: absolute; 654 position: absolute;
597 top: 10px; 655 bottom: 9px;
598 -moz-margin-start: -20px; 656 -moz-margin-start: -20px;
599 -webkit-margin-start: -20px; 657 -webkit-margin-start: -20px;
600 width: 10px;
601 } 658 }
602 659
603 .button-add, .cancel-button 660 .button-add, .cancel-button
604 { 661 {
605 background-color: transparent; 662 background-color: transparent;
606 border: 0px; 663 border: 0px;
607 color: #3A7BA6; 664 color: #3A7BA6;
608 cursor: pointer; 665 cursor: pointer;
609 } 666 }
610 667
611 /* 668 /*
612 Advanced tab content 669 Advanced tab content
613 */ 670 */
614 671
615 #tweaks.table li
616 {
617 padding-bottom: 0px;
618 }
619
620 #restart-safari 672 #restart-safari
621 { 673 {
622 -moz-margin-start: 20px; 674 -moz-margin-start: 20px;
623 -webkit-margin-start: 20px; 675 -webkit-margin-start: 20px;
624 color: red; 676 color: red;
625 font-weight: 600; 677 font-weight: 600;
626 } 678 }
627 679
628 #filter-lists > div 680 #filter-lists > div,
681 #all-filter-lists li.show-message .date,
682 #all-filter-lists li.show-message .time,
683 #all-filter-lists li:not(.show-message) .message,
684 #custom-filters:not(.mode-edit) #custom-filters-raw,
685 #custom-filters:not(.mode-edit) #custom-filters-raw-controls,
686 #custom-filters.mode-edit #custom-filters-show-edit,
687 #custom-filters.mode-edit #custom-filters-list-wrapper
629 { 688 {
630 display: none; 689 display: none;
631 } 690 }
632 691
633 body[data-tab="advanced-allFilterLists"] #all-filter-lists, 692 body[data-tab="advanced-allFilterLists"] #all-filter-lists,
634 body[data-tab="advanced-customFilters"] #custom-filters 693 body[data-tab="advanced-customFilters"] #custom-filters
635 { 694 {
636 display: block; 695 display: block;
637 } 696 }
638 697
698 #all-filter-lists .table
699 {
700 display: inline-block;
701 }
702
639 body[data-tab="advanced-allFilterLists"] #content-advanced [data-tab="advanced-a llFilterLists"], 703 body[data-tab="advanced-allFilterLists"] #content-advanced [data-tab="advanced-a llFilterLists"],
640 body[data-tab="advanced-customFilters"] #content-advanced [data-tab="advanced-cu stomFilters"] 704 body[data-tab="advanced-customFilters"] #content-advanced [data-tab="advanced-cu stomFilters"]
641 { 705 {
642 border-bottom: 2px solid #1E8728; 706 border-bottom: 2px solid #1E8728;
643 padding-bottom: 10px; 707 padding-bottom: 10px;
644 color: black; 708 color: black;
645 font-weight: 600; 709 font-weight: 600;
646 } 710 }
647 711
648 #all-filter-lists .table
649 {
650 display: inline-block;
651 }
652
653 #all-filter-lists .table li 712 #all-filter-lists .table li
654 { 713 {
655 padding-left: 16px; 714 padding-left: 16px;
656 padding-right: 16px; 715 padding-right: 16px;
657 } 716 }
658 717
659 #all-filter-lists .table li > div 718 #all-filter-lists .table li > div
660 { 719 {
661 display: flex; 720 display: flex;
662 width: 330px; 721 width: 330px;
663 } 722 }
664 723
665 .table-header 724 .table-header
666 { 725 {
667 display: flex; 726 display: flex;
668 } 727 }
669 728
670 #filter-lists h3 729 #filter-lists h2
671 { 730 {
672 display: inline-block;
673 margin-bottom: 7px; 731 margin-bottom: 7px;
674 font-size: 14px; 732 font-size: 14px;
675 } 733 }
676 734
677 .table-header h3:first-child 735 .table-header h2:first-child
678 { 736 {
679 width: 330px; 737 width: 330px;
680 -webkit-padding-start: 54px; 738 -webkit-padding-start: 54px;
681 -moz-padding-start: 54px; 739 -moz-padding-start: 54px;
682 } 740 }
683 741
684 #all-filter-lists .table li span.display 742 #all-filter-lists .table li span.display
685 { 743 {
686 cursor: pointer; 744 cursor: pointer;
687 } 745 }
(...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after
721 text-decoration: none; 779 text-decoration: none;
722 cursor: pointer; 780 cursor: pointer;
723 } 781 }
724 782
725 #all-filter-lists .table li:last-of-type > span:last-child 783 #all-filter-lists .table li:last-of-type > span:last-child
726 { 784 {
727 -webkit-margin-start: auto; 785 -webkit-margin-start: auto;
728 -moz-margin-start: auto; 786 -moz-margin-start: auto;
729 } 787 }
730 788
731 #all-filter-lists li.show-message .date,
732 #all-filter-lists li.show-message .time,
733 #all-filter-lists li:not(.show-message) .message
734 {
735 display: none;
736 }
737
738 .date::before 789 .date::before
739 { 790 {
740 content: "";
741 -webkit-margin-end: 6px; 791 -webkit-margin-end: 6px;
742 -moz-margin-end: 6px; 792 -moz-margin-end: 6px;
743 height: 12px;
744 width: 12px;
745 background-position: -7px -49px; 793 background-position: -7px -49px;
746 } 794 }
747 795
748 .time::before 796 .time::before
749 { 797 {
750 content: "";
751 -webkit-margin-end: 6px; 798 -webkit-margin-end: 6px;
752 -moz-margin-end: 6px; 799 -moz-margin-end: 6px;
753 -webkit-margin-start: 12px; 800 -webkit-margin-start: 12px;
754 -moz-margin-start: 12px; 801 -moz-margin-start: 12px;
755 height: 12px;
756 width: 12px;
757 background-position: -20px -49px; 802 background-position: -20px -49px;
758 } 803 }
759 804
805 #all-filter-lists-table .static label
806 {
807 font-weight: 600;
808 }
809
760 #custom-filters-header 810 #custom-filters-header
761 { 811 {
762 padding: 0px 20px; 812 padding: 0px 16px;
763 margin-bottom: 10px; 813 margin-bottom: 10px;
764 } 814 }
765 815
766 #custom-filters-raw-controls 816 #custom-filters-raw-controls
767 { 817 {
768 display: flex; 818 justify-content: space-between;
769 }
770
771 #custom-filters:not(.mode-edit) #custom-filters-raw,
772 #custom-filters:not(.mode-edit) #custom-filters-raw-controls,
773 #custom-filters.mode-edit #custom-filters-show-edit,
774 #custom-filters.mode-edit #custom-filters-list-wrapper
775 {
776 display: none;
777 }
778
779 #custom-filters-raw-save
780 {
781 padding: 0px 16px;
782 }
783
784 #custom-filters .table
785 {
786 height: 290px;
787 overflow: auto;
788 width: auto;
789 }
790
791 #custom-filters-add
792 {
793 display: flex;
794 padding: 0px;
795 border: none;
796 }
797
798 #custom-filters .controls
799 {
800 border-top: none;
801 } 819 }
802 820
803 #custom-filters-raw 821 #custom-filters-raw
804 { 822 {
805 width: 100%; 823 width: 100%;
806 height: 100%; 824 height: 100%;
825 padding: 2px 16px;
807 } 826 }
808 827
809 #custom-filters-wrapper 828 #custom-filters-wrapper
810 { 829 {
811 height: 330px; 830 height: 330px;
812 } 831 }
813 832
814 #custom-filters input[type="text"] 833 #custom-filters-add
815 { 834 {
835 display: flex;
816 border-width: 1px 0px 1px 0px; 836 border-width: 1px 0px 1px 0px;
817 border-bottom-style: solid; 837 border-bottom-style: solid;
818 border-top-style: solid; 838 border-top-style: solid;
819 border-color: #1E8728; 839 border-color: #1E8728;
820 height: 25px; 840 padding: 0px;
821 -moz-padding-start: 10px; 841 margin: 0px;
822 -webkit-padding-start: 10px; 842 background-color: #F5F5F5;
823 -moz-padding-end: 60px;
824 -webkit-padding-end: 60px;
825 padding-top: 18px;
826 padding-bottom: 18px;
827 width: 100%;
828 } 843 }
829 844
830 #custom-filters input[type="text"]:focus 845 #custom-filters-add input[type="text"]
846 {
847 -moz-padding-start: 16px;
848 -webkit-padding-start: 16px;
849 padding-top: 10px;
850 padding-bottom: 10px;
851 border: none;
852 background-color: transparent;
853 flex-grow: 1;
854 }
855
856 #custom-filters-add input[type="text"]:focus
831 { 857 {
832 outline: 0px; 858 outline: 0px;
833 } 859 }
834 860
835 #custom-filters-add input
836 {
837 font-size: 13px;
838 background-color: #F5F5F5;
839 }
840
841 #custom-filters-add input::-webkit-input-placeholder
842 {
843 font-weight: 600;
844 }
845 #custom-filters-add input::-moz-placeholder
846 {
847 font-weight: 600;
848 }
849
850 #custom-filters-table 861 #custom-filters-table
851 { 862 {
863 height: 290px;
852 border-top: 1px solid #CDCDCD; 864 border-top: 1px solid #CDCDCD;
865 overflow: auto;
853 } 866 }
854 867
855 #custom-filters-add button 868 #custom-filters-add button
856 { 869 {
857 font-size: 14px; 870 font-size: 14px;
858 -webkit-margin-start: -60px;
859 -moz-margin-start: -60px;
860 -webkit-padding-end: 6px; 871 -webkit-padding-end: 6px;
861 -moz-padding-end: 6px; 872 -moz-padding-end: 6px;
862 cursor: pointer; 873 cursor: pointer;
863 color: #3A7BA6; 874 color: #3A7BA6;
864 } 875 }
865 876
866 #custom-filters-add button::before 877 #custom-filters-add button::before
867 { 878 {
868 content: ""; 879 content: "";
869 display: inline-block; 880 display: inline-block;
870 -moz-border-end: 1px solid #CDCDCD; 881 -moz-border-end: 1px solid #CDCDCD;
871 -webkit-border-end: 1px solid #CDCDCD; 882 -webkit-border-end: 1px solid #CDCDCD;
872 height: 15px; 883 height: 15px;
873 -webkit-margin-end: 10px; 884 -webkit-margin-end: 10px;
874 -moz-margin-end: 10px; 885 -moz-margin-end: 10px;
875 margin-bottom: -2px; 886 margin-bottom: -2px;
876 width: 1px; 887 width: 1px;
877 } 888 }
878 889
879 #custom-filters-add button::after 890 #custom-filters-add button::after
880 { 891 {
881 content: ""; 892 content: "";
882 background-position: -28px -32px; 893 background-position: -28px -33px;
883 cursor: pointer;
884 height: 10px;
885 -webkit-margin-start: 6px; 894 -webkit-margin-start: 6px;
886 -moz-margin-start: 6px; 895 -moz-margin-start: 6px;
887 width: 10px;
888 } 896 }
889 897
890 /* 898 /*
891 Tooltips 899 Tooltips
892 */ 900 */
893 901
894 .tooltip 902 .tooltip
895 { 903 {
904 position: relative;
905 margin: 0px 4px;
896 border-bottom: dashed 1px; 906 border-bottom: dashed 1px;
907 height: 15px;
897 color: #3A7BA6; 908 color: #3A7BA6;
909 font-size: 12px;
910 line-height: 19px;
911 text-decoration: none;
912 font-weight: 400;
898 cursor: default; 913 cursor: default;
899 font-size: 12px;
900 height: 15px;
901 line-height: 19px;
902 margin: 0px 4px;
903 position: relative;
904 text-decoration: none;
905 } 914 }
906 915
907 .context-menu 916 .context-menu
908 { 917 {
909 display: inline-block; 918 display: inline-block;
910 position: relative; 919 position: relative;
911 border-bottom: none; 920 border-bottom: none;
912 } 921 }
913 922
914 .context-menu a 923 .context-menu a
(...skipping 279 matching lines...) Expand 10 before | Expand all | Expand 10 after
1194 display: inline-block; 1203 display: inline-block;
1195 height: 20px; 1204 height: 20px;
1196 font-size: 15px; 1205 font-size: 15px;
1197 -moz-padding-start: 10px; 1206 -moz-padding-start: 10px;
1198 -webkit-padding-start: 10px; 1207 -webkit-padding-start: 10px;
1199 } 1208 }
1200 1209
1201 #dialog-close::before 1210 #dialog-close::before
1202 { 1211 {
1203 background-position: -10px -33px; 1212 background-position: -10px -33px;
1204 content: "";
1205 cursor: pointer; 1213 cursor: pointer;
1206 height: 8px; 1214 height: 8px;
1207 width: 8px; 1215 width: 8px;
1208 vertical-align: middle; 1216 vertical-align: middle;
1209 -moz-margin-end: 6px; 1217 -moz-margin-end: 6px;
1210 -webkit-margin-end: 6px; 1218 -webkit-margin-end: 6px;
1211 } 1219 }
1212 1220
1213 #dialog #dialog-body 1221 #dialog #dialog-body
1214 { 1222 {
(...skipping 107 matching lines...) Expand 10 before | Expand all | Expand 10 after
1322 #other-language .button-add::before 1330 #other-language .button-add::before
1323 { 1331 {
1324 display: none; 1332 display: none;
1325 } 1333 }
1326 1334
1327 #other-language .display 1335 #other-language .display
1328 { 1336 {
1329 -webkit-margin-start: 10px; 1337 -webkit-margin-start: 10px;
1330 -moz-margin-start: 10px; 1338 -moz-margin-start: 10px;
1331 } 1339 }
OLDNEW
« no previous file with comments | « options.html ('k') | skin/options-sprite.png » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld