LCARStrek/mozapps/extensions/extensions.css

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