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