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