EarlyBlue/mozapps/extensions/extensions.css

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