extensions.css (22471B)
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/. */ 4 5 /* This Source Code Form is subject to the terms of the Mozilla Public 6 * License, v. 2.0. If a copy of the MPL was not distributed with this 7 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ 8 9 @import url("chrome://global/skin/inContentUI.css"); 10 11 #forward-btn { 12 border-inline-start: none; 13 } 14 15 #back-btn:-moz-locale-dir(ltr), 16 #forward-btn:-moz-locale-dir(rtl) { 17 list-style-image: url("chrome://browser/skin/toolbar/back.svg"); 18 border-top-right-radius: 0; 19 border-bottom-right-radius: 0; 20 } 21 22 #back-btn:-moz-locale-dir(rtl), 23 #forward-btn:-moz-locale-dir(ltr) { 24 list-style-image: url("chrome://browser/skin/toolbar/forward.svg"); 25 border-top-left-radius: 0; 26 border-bottom-left-radius: 0; 27 } 28 29 30 /*** global warnings ***/ 31 32 .global-warning-container { 33 overflow-x: hidden; 34 } 35 36 .global-warning { 37 -moz-box-align: center; 38 padding: 0 8px; 39 color: #916D15; 40 font-weight: bold; 41 } 42 43 #addons-page[warning] .global-warning-container { 44 background-image: linear-gradient(transparent, rgba(175, 175, 0, 0.1)); 45 } 46 47 #detail-view .global-warning { 48 padding: 4px 12px; 49 border-bottom: 1px solid #CAD4E0; 50 } 51 52 @media (max-width: 600px) { 53 .global-warning-text { 54 display: none; 55 } 56 57 .global-warning .warning-icon { 58 background-color: #FFF; 59 box-shadow: 0px 0px 2px 5px #FFF; 60 border-radius: 10px; 61 } 62 } 63 64 /*** global informations ***/ 65 #addons-page .global-info-container { 66 border-top-right-radius: 5px; 67 border-top-left-radius: 5px; 68 } 69 70 /* Plugins aren't yet disabled by safemode (bug 342333), 71 so don't show that warning when viewing plugins. */ 72 #addons-page[warning="safemode"] .view-pane[type="plugin"] .global-warning-container, 73 #addons-page[warning="safemode"] #detail-view[loading="true"] .global-warning-container { 74 background-color: inherit; 75 background-image: none; 76 } 77 78 79 /*** notification icons ***/ 80 81 .warning-icon { 82 list-style-image: url("chrome://mozapps/skin/extensions/alerticon-warning.svg"); 83 } 84 85 .error-icon { 86 list-style-image: url("chrome://mozapps/skin/extensions/alerticon-error.svg"); 87 } 88 89 .pending-icon, 90 .info-icon { 91 list-style-image: url("chrome://mozapps/skin/extensions/alerticon-info-positive.svg"); 92 } 93 94 .addon-view[pending="disable"] .pending-icon, 95 .addon-view[pending="uninstall"] .pending-icon { 96 list-style-image: url("chrome://mozapps/skin/extensions/alerticon-info-negative.svg"); 97 } 98 99 100 /*** view alert boxes ***/ 101 102 .alert-container { 103 -moz-box-align: center; 104 } 105 106 .alert-spacer-before { 107 -moz-box-flex: 1; 108 } 109 110 .alert-spacer-after { 111 -moz-box-flex: 3; 112 } 113 114 .alert { 115 -moz-box-align: center; 116 padding: 10px; 117 } 118 119 .alert .alert-title { 120 font-weight: bold; 121 font-size: 200%; 122 margin-bottom: 15px; 123 } 124 125 .alert button { 126 margin: 1em 2em; 127 } 128 129 .loading { 130 list-style-image: url("chrome://global/skin/icons/loading_16.png"); 131 padding-left: 20px; 132 padding-right: 20px; 133 } 134 135 136 /*** category selector ***/ 137 138 #categories { 139 -moz-appearance: none; 140 border: none; 141 margin-inline-end: -1px; 142 background-color: transparent; 143 position: relative; 144 margin-top: 31px; 145 } 146 147 .category { 148 -moz-appearance: none; 149 background-color: transparent; 150 color: #bfbbb6; 151 min-height: 0; 152 padding: 0 4px; 153 border-width: 1px; 154 border-style: solid; 155 border-color: transparent; 156 -moz-box-align: center; 157 overflow: hidden; 158 } 159 160 .category:-moz-locale-dir(ltr) { 161 border-top-left-radius: 5px; 162 border-bottom-left-radius: 5px; 163 } 164 165 .category:-moz-locale-dir(rtl) { 166 border-top-right-radius: 5px; 167 border-bottom-right-radius: 5px; 168 } 169 170 .category[disabled] { 171 border-top: 0; 172 border-bottom: 0; 173 height: 0; 174 opacity: 0; 175 transition-property: height, opacity; 176 transition-duration: 1s, 0.8s; 177 } 178 179 .category:not([disabled]) { 180 height: 52px; 181 transition-property: height, opacity; 182 transition-duration: 1s, 0.8s; 183 } 184 185 .category[selected] { 186 background-color: rgb(110,110,110); 187 color: #bfbbb6; 188 border-color: rgb(50,50,50); 189 border-inline-end-color: rgb(75,75,75); 190 } 191 192 .category-name { 193 font-size: 150%; 194 } 195 196 /* Maximize the size of the viewport when the window is small */ 197 @media (max-width: 800px) { 198 .category-name { 199 display: none; 200 } 201 } 202 203 .category-badge { 204 background-color: #55D4FF; 205 padding: 2px 8px; 206 margin: 6px 0; 207 border-radius: 10000px; 208 color: #FFF; 209 font-weight: bold; 210 text-align: center; 211 } 212 213 .category-badge[value="0"] { 214 visibility: hidden; 215 } 216 217 .category-icon { 218 width: 32px; 219 height: 32px; 220 margin-inline-start: 6px; 221 } 222 223 #category-search > .category-icon { 224 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#search"); 225 } 226 #category-discover > .category-icon { 227 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#discover"); 228 } 229 #category-locale > .category-icon { 230 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#languages"); 231 } 232 #category-searchengine > .category-icon { 233 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#searchengines"); 234 } 235 #category-extension > .category-icon { 236 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#extensions"); 237 } 238 #category-service > .category-icon { 239 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#services"); 240 } 241 #category-theme > .category-icon { 242 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#themes"); 243 } 244 #category-plugin > .category-icon { 245 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#plugins"); 246 } 247 #category-greasemonkey-user-script > .category-icon { 248 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#userscripts") !important; 249 } 250 #category-dictionary > .category-icon { 251 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#dictionaries"); 252 } 253 #category-experiment > .category-icon { 254 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#experiments"); 255 } 256 #category-availableUpdates > .category-icon { 257 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#available"); 258 } 259 #category-recentUpdates > .category-icon { 260 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#recent"); 261 } 262 #category-userstyle > .category-icon { 263 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#userstyle") !important; 264 } 265 266 /*** header ***/ 267 268 #header { 269 margin-bottom: 18px; 270 } 271 272 #header-search { 273 margin: 0; 274 -moz-appearance: none; 275 background-color: #181411; 276 color: #bfbbb6; 277 border: 1px solid rgb(64,64,64); 278 border-radius: 5px; 279 padding: 4px 5px; 280 } 281 282 @media (max-width: 600px) { 283 #header-search { 284 width: 12em; 285 } 286 } 287 288 #header-utils-btn { 289 list-style-image: url("chrome://browser/skin/toolbar/menu.svg"); 290 margin-inline-end: 16px; 291 } 292 293 .view-header { 294 background-color: rgb(1,1,1); 295 padding: 4px; 296 margin: 0; 297 min-height: 31px; 298 border-bottom: 1px solid rgb(75,75,75); 299 } 300 301 302 /*** sorters ***/ 303 304 .sort-controls { 305 -moz-appearance: none; 306 } 307 308 .sorter { 309 -moz-appearance: none; 310 color: #bfbbb6; 311 padding: 0 6px; 312 margin: 0 6px; 313 min-width: 12px !important; 314 -moz-box-direction: reverse; 315 box-shadow: none !important; 316 } 317 318 .sorter .button-box { 319 padding-top: 0; 320 padding-bottom: 0; 321 } 322 323 .sorter[checkState="1"] { 324 list-style-image: url("chrome://global/skin/arrow/arrow-v.svg#dn"); 325 } 326 327 .sorter[checkState="2"] { 328 list-style-image: url("chrome://global/skin/arrow/arrow-v.svg#up"); 329 } 330 331 .sorter .button-icon { 332 margin-inline-start: 4px; 333 } 334 335 336 /*** discover view ***/ 337 338 .discover-spacer-before, 339 .discover-spacer-after { 340 -moz-box-flex: 1; 341 } 342 343 #discover-error .alert { 344 max-width: 45em; 345 -moz-box-flex: 1; 346 } 347 348 .discover-logo { 349 list-style-image: url("chrome://mozapps/skin/extensions/discover-logo.png"); 350 margin-inline-end: 15px; 351 } 352 353 .discover-title { 354 font-weight: bold; 355 font-size: 24px; 356 font-family: MetaWebPro-Book, "Trebuchet MS", sans-serif; 357 margin: 0 0 15px 0; 358 } 359 360 .discover-description { 361 text-align: justify; 362 margin: 0 0 15px 0; 363 } 364 365 .discover-footer { 366 text-align: justify; 367 } 368 369 370 /*** list ***/ 371 372 .list { 373 -moz-appearance: none; 374 margin: 0; 375 border: none; 376 background-color: transparent; 377 } 378 379 .addon { 380 color: #bfbbb6; 381 border-top: 1px solid rgb(75,75,75); 382 padding: 5px; 383 background-origin: border-box; 384 } 385 386 .view-pane:not(#search-view) .addon:first-of-type, 387 #search-view .addon[first] { 388 border-top-width: 0px; 389 } 390 391 .details { 392 cursor: pointer; 393 margin: 0; 394 margin-inline-start: 10px; 395 } 396 397 .icon-container { 398 width: 48px; 399 height: 48px; 400 margin: 3px 7px; 401 -moz-box-align: center; 402 -moz-box-pack: center; 403 } 404 405 .icon { 406 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png"); 407 max-width: 48px; 408 max-height: 48px; 409 } 410 411 .addon[active="false"] .icon { 412 filter: grayscale(100%); 413 } 414 415 416 .addon-view[type="theme"] .icon { 417 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#themeGeneric"); 418 } 419 420 .addon-view[type="locale"] .icon { 421 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#languageGeneric"); 422 } 423 424 .addon-view[type="plugin"] .icon { 425 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#pluginGeneric"); 426 } 427 428 .addon-view[type="dictionary"] .icon { 429 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#dictionaryGeneric"); 430 } 431 432 .addon-view[type="experiment"] .icon { 433 list-style-image: url("chrome://mozapps/skin/extensions/addons.svg#experimentGeneric"); 434 } 435 436 .name-container { 437 font-size: 150%; 438 font-weight: bold; 439 color: #bfbbb6; 440 margin-bottom: 0; 441 -moz-box-align: end; 442 -moz-box-flex: 1; 443 } 444 445 .creator { 446 font-weight: bold; 447 } 448 449 .creator .text-link { 450 color: #bfbbb6; 451 } 452 453 .description-container { 454 margin-inline-start: 6px; 455 -moz-box-align: center; 456 } 457 458 .description { 459 margin: 0; 460 } 461 462 .warning, 463 .pending, 464 .error { 465 margin-inline-start: 48px; 466 font-weight: bold; 467 -moz-box-align: center; 468 } 469 470 .content-container, 471 .basicinfo-container { 472 -moz-box-align: start; 473 } 474 475 .addon[status="installing"] > .content-container { 476 -moz-box-align: stretch; 477 } 478 479 .advancedinfo-container, 480 .update-info-container { 481 -moz-box-align: center; 482 } 483 484 .update-available { 485 -moz-box-align: end; 486 } 487 488 .install-status-container { 489 -moz-box-pack: end; 490 -moz-box-align: end; 491 } 492 493 .name-outer-container { 494 -moz-box-pack: center; 495 } 496 497 .relnotes-toggle-container, 498 .icon-outer-container { 499 -moz-box-pack: start; 500 } 501 502 .status-container, 503 .control-container { 504 -moz-box-pack: end; 505 } 506 507 .addon-view .warning { 508 color: #d8b826; 509 } 510 511 .addon-view .error { 512 color: #e62117; 513 } 514 515 .addon-view .pending { 516 color: #62c44e; 517 } 518 519 .addon-view[pending="disable"] .pending, 520 .addon-view[pending="uninstall"] .pending { 521 color: #7A7E86; 522 } 523 524 .addon .relnotes-container { 525 -moz-box-align: start; 526 margin-inline-start: 6px; 527 height: 0; 528 overflow: hidden; 529 opacity: 0; 530 transition-property: height, opacity; 531 transition-duration: 0.5s, 0.5s; 532 } 533 534 .addon[show-relnotes] .relnotes-container { 535 opacity: 1; 536 transition-property: height, opacity; 537 transition-duration: 0.5s, 0.5s; 538 } 539 540 .addon .relnotes-header { 541 font-weight: bold; 542 margin: 10px 0; 543 } 544 545 .addon .relnotes-toggle { 546 -moz-appearance: none; 547 border: none; 548 background: transparent; 549 font-weight: bold; 550 -moz-box-direction: reverse; 551 cursor: pointer; 552 list-style-image: url("chrome://global/skin/arrow/arrow-v.svg#dn"); 553 } 554 555 .addon .relnotes-toggle > .button-box > .button-icon { 556 padding-inline-start: 4px; 557 } 558 559 .addon[show-relnotes] .relnotes-toggle { 560 list-style-image: url("chrome://global/skin/arrow/arrow-v.svg#up"); 561 } 562 563 .addon-view[active="false"], 564 .addon-view[active="false"] .name-container { 565 color: #AAA; 566 } 567 568 .addon-view[notification], 569 .addon-view[pending] { 570 --view-highlight-color: transparent; 571 background-image: radial-gradient(at 50% 0%, 572 var(--view-highlight-color) 0%, 573 transparent 75%); 574 } 575 .addon-view[notification="warning"] { 576 --view-highlight-color: rgb(86,85,79); 577 } 578 579 .addon-view[notification="error"] { 580 --view-highlight-color: rgb(89,81,81); 581 } 582 583 .addon-view[pending="enable"], 584 .addon-view[pending="upgrade"], 585 .addon-view[pending="install"] { 586 --view-highlight-color: rgb(85,89,86); 587 } 588 589 .addon-view[pending="disable"], 590 .addon-view[pending="uninstall"] { 591 --view-highlight-color: rgb(75,75,75); 592 } 593 594 .addon[selected] { 595 background-color: rgb(1,1,1); 596 color: #bfbbb6; 597 } 598 599 .addon[active="false"][selected]/* .name-container*/ { 600 color: #AAA; 601 } 602 603 604 /*** item - uninstalled ***/ 605 606 .addon[status="uninstalled"] { 607 border: none; 608 } 609 610 .addon[status="uninstalled"] > .container { 611 -moz-box-align: center; 612 padding: 4px 20px; 613 background-color: #FDFFA8; 614 border-radius: 8px; 615 font-size: 120%; 616 } 617 618 .addon[status="uninstalled"][selected] { 619 background-color: transparent; 620 } 621 622 623 624 /*** search view ***/ 625 626 #search-filter { 627 padding: 5px 20px; 628 font-size: 120%; 629 border-bottom: 1px solid #CAD4E0; 630 overflow-x: hidden; 631 } 632 633 #search-filter-label { 634 font-weight: bold; 635 color: grey; 636 } 637 638 .search-filter-radio { 639 -moz-appearance: none; 640 padding: 0 6px; 641 margin: 0 3px; 642 border-radius: 10000px; 643 } 644 645 .search-filter-radio[selected] { 646 background-color: grey; 647 color: white; 648 } 649 650 .search-filter-radio .radio-check-box1 { 651 display: none; 652 } 653 654 .search-filter-radio .radio-icon { 655 display: none; 656 } 657 658 #search-allresults-link { 659 margin-top: 1em; 660 margin-bottom: 2em; 661 } 662 663 /*** discover view ***/ 664 #discover-browser { 665 background: rgb(3,3,3); 666 } 667 668 /*** detail view ***/ 669 670 #detail-view .loading { 671 opacity: 0; 672 } 673 674 #detail-view[loading-extended] .loading { 675 opacity: 1; 676 transition-property: opacity; 677 transition-duration: 1s; 678 } 679 680 .detail-view-container { 681 padding: 0 2em 2em 2em; 682 font-size: 110%; 683 } 684 685 #detail-notifications { 686 margin-top: 1em; 687 margin-bottom: 2em; 688 } 689 690 #detail-notifications .warning, 691 #detail-notifications .pending, 692 #detail-notifications .error { 693 margin-inline-start: 0; 694 } 695 696 #detail-icon-container { 697 width: 64px; 698 margin-inline-end: 10px; 699 margin-top: 6px; 700 } 701 702 #detail-icon { 703 max-width: 64px; 704 max-height: 64px; 705 } 706 707 #detail-summary { 708 margin-bottom: 2em; 709 } 710 711 #detail-name-container { 712 font-size: 200%; 713 } 714 715 #detail-screenshot { 716 margin-inline-end: 2em; 717 max-width: 300px; 718 max-height: 300px; 719 } 720 721 #detail-screenshot[loading] { 722 background-image: url("chrome://global/skin/icons/loading_16.png"), 723 linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0)); 724 background-position: 50% 50%; 725 background-repeat: no-repeat; 726 border-radius: 3px; 727 } 728 729 #detail-screenshot[loading="error"] { 730 background-image: url("chrome://global/skin/media/error.png"), 731 linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0)); 732 } 733 734 #detail-desc-container { 735 margin-bottom: 2em; 736 } 737 738 #detail-desc, #detail-fulldesc { 739 margin-inline-start: 6px; 740 /* This is necessary to fix layout issues with multi-line descriptions, see 741 bug 592712*/ 742 outline: solid transparent; 743 white-space: pre-wrap; 744 min-width: 10em; 745 } 746 747 #detail-fulldesc { 748 margin-top: 1em; 749 } 750 751 #detail-contributions { 752 border-radius: 5px; 753 border: 1px solid #DDD; 754 margin-bottom: 2em; 755 padding: 1em; 756 background-color: #181411; 757 } 758 759 #detail-contrib-description { 760 font-style: italic; 761 margin-bottom: 1em; 762 color: #373D48; 763 } 764 765 #detail-contrib-suggested { 766 color: grey; 767 font-weight: bold; 768 } 769 770 #detail-contrib-btn { 771 -moz-appearance: none; 772 color: #FFF; 773 border: 1px solid #3A4EEE; 774 border-radius: 3px; 775 list-style-image: url("chrome://mozapps/skin/extensions/heart.png"); 776 background: #2F73EF; 777 padding: 4px; 778 } 779 780 #detail-contrib-btn .button-box { 781 padding: 0 6px 1px 6px; 782 } 783 784 #detail-contrib-btn .button-icon { 785 margin-inline-end: 3px; 786 } 787 788 #detail-contrib-btn:not(:active):hover { 789 border-color: #0459F7; 790 background-color: #0459F7; 791 } 792 793 #detail-contrib-btn:active:hover { 794 background: #0039a2; 795 border-color: rgba(0, 0, 0, 0.65) rgba(0, 0, 0, 0.55) rgba(0, 0, 0, 0.5); 796 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4) inset; 797 } 798 799 #detail-grid { 800 margin-bottom: 2em; 801 } 802 803 #detail-grid > columns > column:first-child { 804 min-width: 15em; 805 max-width: 25em; 806 } 807 808 .detail-row[first-row="true"], 809 .detail-row-complex[first-row="true"], 810 setting[first-row="true"] { 811 border-top: none; 812 } 813 814 .detail-row, 815 .detail-row-complex, 816 setting { 817 border-top: 2px solid; 818 -moz-border-top-colors: rgba(28, 31, 37, 0.1) rgba(255, 255, 255, 0.1); 819 -moz-box-align: center; 820 min-height: 30px; 821 } 822 823 #detail-controls { 824 margin-bottom: 1em; 825 } 826 827 #detail-view[active="false"]:not([pending]):not([notification]) { 828 background-image: linear-gradient(rgba(135, 135, 135, 0.1), 829 rgba(135, 135, 135, 0)); 830 } 831 832 setting[first-row="true"] { 833 margin-top: 2em; 834 } 835 836 setting { 837 -moz-box-align: start; 838 } 839 840 .preferences-alignment { 841 min-height: 30px; 842 -moz-box-align: center; 843 } 844 845 .preferences-description { 846 font-size: 90.9%; 847 color: graytext; 848 margin-top: -2px; 849 margin-inline-start: 2em; 850 white-space: pre-wrap; 851 } 852 853 .preferences-description:empty { 854 display: none; 855 } 856 857 setting[type="radio"] > radiogroup { 858 -moz-box-orient: horizontal; 859 } 860 861 menulist { /* Fixes some styling inconsistencies */ 862 margin: 1px 5px 2px 5px; 863 } 864 865 /*** creator ***/ 866 867 .creator > label { 868 margin-inline-start: 0; 869 margin-inline-end: 0; 870 } 871 872 .creator > .text-link { 873 margin-top: 1px; 874 margin-bottom: 1px; 875 } 876 877 878 /*** rating ***/ 879 880 .meta-rating { 881 margin-inline-end: 0; 882 padding-top: 2px; 883 } 884 885 .meta-rating > .star { 886 list-style-image: url("chrome://mozapps/skin/extensions/rating-not-won.png"); 887 padding: 0 1px; 888 } 889 890 .meta-rating > .star[on="true"] { 891 list-style-image: url("chrome://mozapps/skin/extensions/rating-won.png"); 892 } 893 894 895 /*** download progress ***/ 896 897 .download-progress { 898 background-color: rgba(0,0,0,.05); 899 background-image: linear-gradient(rgba(251, 252, 253, 0.95), rgba(246, 247, 248, 0.47) 49%, 900 rgba(231, 232, 233, 0.45) 51%, rgba(225, 226, 229, 0.3)); 901 background-clip: padding-box; 902 border-radius: 3px; 903 border: 1px solid; 904 border-color: rgba(0, 0, 0, 0.12) rgba(0, 0, 0, 0.19) rgba(0, 0, 0, 0.38); 905 box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3) inset, 906 0 0 0 2px rgba(255, 255, 255, 0.1) inset; 907 width: 200px; 908 height: 21px; 909 margin: 0 8px; 910 } 911 912 .download-progress[mode="undetermined"] { 913 border-color: #358942 #317F3D #2E773A; 914 } 915 916 .download-progress[mode="undetermined"] .status-container { 917 padding: 0 2px; 918 } 919 920 .download-progress .start-cap, 921 .download-progress[complete] .end-cap, 922 .download-progress[mode="undetermined"] .end-cap, 923 .download-progress .progress .progress-bar { 924 -moz-appearance: none; 925 background-image: linear-gradient(#92DDA0, #6FC483 49%, #5EB272 51%, #80CE91); 926 margin-top: -1px; 927 margin-bottom: -1px; 928 border: 1px solid; 929 border-color: #358942 #317F3D #2E773A; 930 } 931 932 .download-progress .start-cap { 933 margin-inline-start: -1px; 934 border-inline-end-width: 0; 935 } 936 937 .download-progress .end-cap { 938 margin-inline-end: -1px; 939 border-inline-start-width: 0px !important; 940 } 941 942 .download-progress .progress .progress-bar { 943 border-left-width: 0; 944 border-right-width: 0; 945 min-height: 21px; 946 } 947 948 .download-progress .progress { 949 -moz-appearance: none; 950 background-color: transparent; 951 padding: 0; 952 margin: 0; 953 border: none; 954 } 955 956 .download-progress .start-cap, 957 .download-progress .end-cap { 958 width: 4px; 959 } 960 961 .download-progress .start-cap:-moz-locale-dir(ltr), 962 .download-progress .end-cap:-moz-locale-dir(rtl) { 963 border-radius: 3px 0 0 3px; 964 } 965 966 .download-progress .end-cap:-moz-locale-dir(ltr), 967 .download-progress .start-cap:-moz-locale-dir(rtl) { 968 border-radius: 0 3px 3px 0; 969 } 970 971 .download-progress .cancel { 972 -moz-appearance: none; 973 background-color: rgba(255, 255, 255, 0.4); 974 border: 1px solid rgba(0, 0, 0, 0.4); 975 padding: 3px; 976 border-radius: 3px; 977 min-width: 0; 978 margin: 3px; 979 } 980 981 .download-progress .cancel:hover { 982 background-color: rgba(255, 255, 255, 0.6); 983 border: 1px solid rgba(0, 0, 0, 0.8); 984 } 985 986 .download-progress .cancel:active:hover { 987 box-shadow: inset rgba(0, 0, 0, 0.5) 1px 1px 2px; 988 } 989 990 .download-progress .cancel .button-box { 991 padding: 0; 992 border: none; 993 } 994 995 .download-progress .cancel .button-text { 996 display: none; 997 } 998 999 .download-progress .cancel .button-icon { 1000 margin-inline-start: 0; 1001 } 1002 1003 .download-progress .cancel { 1004 list-style-image: url('chrome://mozapps/skin/extensions/cancel.png'); 1005 } 1006 1007 .download-progress .status-container { 1008 -moz-box-align: center; 1009 } 1010 1011 .download-progress .status { 1012 text-shadow: #FFF 0 0 2px; 1013 } 1014 1015 /*** install status ***/ 1016 1017 .install-status { 1018 -moz-box-align: center; 1019 } 1020 1021 1022 /*** check for updates ***/ 1023 1024 #updates-container { 1025 -moz-box-align: center; 1026 } 1027 1028 #updates-container .button-link { 1029 font-weight: bold; 1030 } 1031 1032 #updates-installed, 1033 #updates-downloaded { 1034 color: #00BB00; 1035 font-weight: bold; 1036 } 1037 1038 #update-selected { 1039 margin: 12px; 1040 } 1041 1042 1043 /*** buttons ***/ 1044 1045 .addon-control[disabled="true"]:not(.no-auto-hide) { 1046 display: none; 1047 } 1048 1049 .no-auto-hide .addon-control { 1050 display: block !important; 1051 } 1052 1053 button.button-link { 1054 -moz-appearance: none; 1055 background: transparent; 1056 border: none; 1057 box-shadow: none; 1058 text-decoration: underline; 1059 color: #bfbbb6; 1060 cursor: pointer; 1061 min-width: 0; 1062 margin: 0 6px; 1063 } 1064 1065 .text-link { 1066 color: #bfbbb6; 1067 } 1068 1069 .button-link:hover, 1070 .text-link:hover { 1071 color: rgb(219,219,219); 1072 } 1073 1074 /* Needed to override normal button style from inContent.css */ 1075 button.button-link:not([disabled="true"]):active:hover { 1076 background: transparent; 1077 border: none; 1078 box-shadow: none; 1079 } 1080 1081 .header-button { 1082 -moz-appearance: none; 1083 padding: 1px 3px; 1084 color: #444; 1085 text-shadow: 0 0 3px white; 1086 background: transparent; 1087 background-clip: padding-box; 1088 border-radius: 2.5px; 1089 border: 1px solid transparent; 1090 } 1091 1092 .header-button[disabled="true"] { 1093 opacity: 0.8; 1094 } 1095 1096 .header-button[disabled="true"] > .toolbarbutton-icon { 1097 opacity: 0.4; 1098 } 1099 1100 .header-button:not([disabled="true"]):active:hover, 1101 .header-button[open="true"] { 1102 background: rgb(110,110,110); 1103 } 1104 1105 .header-button > .toolbarbutton-text { 1106 display: none; 1107 } 1108 1109 /*** telemetry experiments ***/ 1110 1111 #detail-experiment-container { 1112 font-size: 80%; 1113 margin-bottom: 1em; 1114 } 1115 1116 #detail-experiment-bullet-container, 1117 #detail-experiment-state, 1118 #detail-experiment-time, 1119 .experiment-bullet-container, 1120 .experiment-state, 1121 .experiment-time { 1122 vertical-align: middle; 1123 display: inline-block; 1124 } 1125 1126 .addon .experiment-bullet, 1127 #detail-experiment-bullet { 1128 fill: rgb(158, 158, 158); 1129 } 1130 1131 .addon[active="true"] .experiment-bullet, 1132 #detail-view[active="true"] #detail-experiment-bullet { 1133 fill: rgb(106, 201, 20); 1134 } 1135 1136 .sw-alert { 1137 display: none !important; 1138 } 1139 1140 .sw-show { 1141 visibility: visible; 1142 }