LCARStrek/browser/preferences/in-content/preferences.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 file,
   3    - You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 /* === BEGIN shared/in-content/preferences.css === */
   6
   7 @namespace html "http://www.w3.org/1999/xhtml";
   8
   9 #dialogBox,
  10 dialog,
  11 window,
  12 prefwindow,
  13 .windowDialog,
  14 page {
  15   background-color: #000000;
  16 }
  17
  18 * {
  19   -moz-user-select: text;
  20 }
  21
  22 treecol {
  23   /* override the * rule to let the treecol be sortable */
  24   -moz-user-select: none;
  25 }
  26
  27 caption {
  28 }
  29
  30 caption > label {
  31 }
  32
  33 .main-content {
  34   padding: 10px 20px 0px;
  35   overflow: auto;
  36 }
  37
  38 prefpane {
  39   max-width: 800px;
  40   padding: 0;
  41   font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
  42   font-size: 1.25rem;
  43   line-height: 22px;
  44   color: #FF9F00;
  45 }
  46
  47 prefpane > .content-box {
  48   max-width: 800px;
  49   overflow: visible;
  50 }
  51
  52 /* groupboxes */
  53
  54 groupbox {
  55 }
  56
  57 groupbox label {
  58 }
  59
  60 /* tabpanels and tabs */
  61
  62 tabpanels {
  63 }
  64
  65 tabs {
  66 }
  67
  68 .tabs-left,
  69 .tabs-right {
  70 }
  71
  72 tab {
  73 }
  74
  75 tab[selected] {
  76 }
  77
  78 .tab-text {
  79 }
  80
  81 tab:not([selected]):hover > .tab-middle > .tab-text {
  82 }
  83
  84 tab:not([selected]):hover:active > .tab-middle > .tab-text {
  85 }
  86
  87 tab[selected] > .tab-middle > .tab-text {
  88 }
  89
  90 /* buttons and menulists */
  91
  92 button,
  93 menulist {
  94 }
  95
  96 button:not([disabled]):hover,
  97 menulist:not([disabled]):hover {
  98 }
  99
 100 button:not([disabled]):hover:active,
 101 menulist[open="true"]:not([disabled]) {
 102 }
 103
 104 button[disabled],
 105 menulist[disabled] {
 106 }
 107
 108 button > .button-box,
 109 menulist > .menulist-label-box {
 110 }
 111
 112 button[type="menu"] > .button-box > .button-menu-dropmarker {
 113 }
 114 /*
 115 .help-button {
 116   min-width: 30px;
 117   border-radius: 2px;
 118   border: 1px solid #C1C1C1;
 119   background-color: #FFCB00;
 120   background-image: none;
 121   box-shadow: none;
 122 }
 123
 124 .help-button:not([disabled="true"]):hover {
 125   background-color: #F4C200;
 126   background-image: none;
 127 }
 128
 129 .help-button:not([disabled="true"]):hover:active {
 130   background-color: #EABA00;
 131   background-image: none;
 132 }
 133
 134 .close-icon > .button-box,
 135 .help-button > .button-box {
 136   padding-top: 0;
 137   padding-bottom: 0;
 138   padding-right: 0 !important;
 139   padding-left: 0 !important;
 140 }
 141 */
 142 .help-button > .button-box > .button-icon {
 143   width: 26px;
 144   height: 26px;
 145   background-image: url("chrome://browser/skin/preferences/in-content/help-glyph.png");
 146   background-position: center;
 147 }
 148
 149 @media (min-resolution: 2dppx) {
 150   .help-button > .button-box > .button-icon {
 151     background-size: 26px 26px;
 152     background-image: url("chrome://browser/skin/preferences/in-content/help-glyph@2x.png");
 153   }
 154 }
 155
 156 .help-button > .button-box > .button-text {
 157   display: none;
 158 }
 159
 160 .spinbuttons-button {
 161 }
 162
 163 .spinbuttons-up {
 164 }
 165
 166 .spinbuttons-down  {
 167 }
 168
 169 .spinbuttons-button > .button-box {
 170 }
 171
 172 .spinbuttons-up > .button-box > .button-icon {
 173 }
 174
 175 .spinbuttons-up[disabled] > .button-box > .button-icon {
 176 }
 177
 178 .spinbuttons-down > .button-box > .button-icon {
 179 }
 180
 181 .spinbuttons-down[disabled] > .button-box > .button-icon {
 182 }
 183
 184 menulist:not([editable="true"]) > .menulist-dropmarker {
 185 }
 186
 187 menulist[disabled]:not([editable="true"]) > .menulist-dropmarker {
 188 }
 189
 190 menulist > menupopup,
 191 button[type="menu"] > menupopup {
 192 }
 193
 194 menulist > menupopup menu,
 195 menulist > menupopup menuitem,
 196 button[type="menu"] > menupopup menu,
 197 button[type="menu"] > menupopup menuitem {
 198 }
 199
 200 menulist > menupopup > menu[_moz-menuactive="true"],
 201 menulist > menupopup > menuitem[_moz-menuactive="true"],
 202 button[type="menu"] > menupopup > menu[_moz-menuactive="true"],
 203 button[type="menu"] > menupopup > menuitem[_moz-menuactive="true"] {
 204 }
 205
 206 menulist > menupopup > menu[selected="true"],
 207 menulist > menupopup > menuitem[selected="true"],
 208 button[type="menu"] > menupopup > menu[selected="true"],
 209 button[type="menu"] > menupopup > menuitem[selected="true"] {
 210 }
 211
 212 menulist > menupopup menuseparator,
 213 button[type="menu"] > menupopup menuseparator {
 214 }
 215
 216 /* textboxes */
 217
 218 textbox {
 219 }
 220
 221 textbox[focused] {
 222 }
 223
 224 textbox[disabled] {
 225 }
 226
 227 /* Links */
 228
 229 .text-link,
 230 .inline-link,
 231 html|a.inline-link {
 232 }
 233
 234 .text-link:hover,
 235 .inline-link:hover {
 236 }
 237
 238 .text-link:hover:active,
 239 .inline-link:hover:active {
 240 }
 241
 242 /* Checkboxes and radio buttons */
 243
 244 .checkbox-check {
 245 }
 246
 247 .checkbox-check[checked] {
 248 }
 249
 250 radio {
 251 }
 252
 253 .radio-check {
 254 }
 255
 256 .radio-check[selected] {
 257 }
 258
 259 /* Category List */
 260
 261 #categories {
 262   background-color: #A09090;
 263   padding-top: 39px;
 264   margin: 0;
 265   border-radius: 1em 0 0 0;
 266 }
 267
 268 .category {
 269   background-color: #000000;
 270   color: #FFCF00;
 271   -moz-border-end-width: 0;
 272   -moz-padding-start: 15px;
 273   -moz-padding-end: 21px;
 274   min-height: 40px;
 275   transition: background-color 150ms;
 276 }
 277
 278 .category:hover {
 279   background-color: #FFCF00;
 280   color: #000000;
 281 }
 282
 283 .category[selected] {
 284   background-color: #008484;
 285   color: #000000;
 286 }
 287
 288 #categories[keyboard-navigation="true"]:-moz-focusring > .category[current] {
 289   border-top: 1px dotted #000000;
 290   border-bottom: 1px dotted #000000;
 291 }
 292
 293 .category-name {
 294   line-height: 22px;
 295   font-size: 1.25rem;
 296   padding-bottom: 2px;
 297   -moz-padding-start: 9px;
 298   margin: 0;
 299 }
 300
 301 .category-icon {
 302   width: 24px;
 303   height: 24px;
 304   list-style-image: url("chrome://browser/skin/preferences/in-content/icons.png");
 305 }
 306
 307 #category-general > .category-icon {
 308   -moz-image-region: rect(0, 24px, 24px, 0);
 309 }
 310
 311 #category-general:hover > .category-icon,
 312 #category-general[selected] > .category-icon {
 313   -moz-image-region: rect(24px, 24px, 48px, 0);
 314 }
 315
 316 #category-content > .category-icon {
 317   -moz-image-region: rect(0, 48px,  24px, 24px)
 318 }
 319
 320 #category-content:hover > .category-icon,
 321 #category-content[selected] > .category-icon {
 322   -moz-image-region: rect(24px, 48px, 48px, 24px);
 323 }
 324
 325 #category-application > .category-icon {
 326   -moz-image-region: rect(0, 72px,  24px, 48px)
 327 }
 328
 329 #category-application:hover > .category-icon,
 330 #category-application[selected] > .category-icon {
 331   -moz-image-region: rect(24px, 72px, 48px, 48px);
 332 }
 333
 334 #category-privacy > .category-icon {
 335   -moz-image-region: rect(0, 96px,  24px, 72px)
 336 }
 337
 338 #category-privacy:hover > .category-icon,
 339 #category-privacy[selected] > .category-icon {
 340   -moz-image-region: rect(24px, 96px, 48px, 72px);
 341 }
 342
 343 #category-security > .category-icon {
 344   -moz-image-region: rect(0, 120px,  24px, 96px)
 345 }
 346
 347 #category-security:hover > .category-icon,
 348 #category-security[selected] > .category-icon {
 349   -moz-image-region: rect(24px, 120px, 48px, 96px);
 350 }
 351
 352 #category-sync > .category-icon {
 353   -moz-image-region: rect(0, 144px, 24px, 120px);
 354 }
 355
 356 #category-sync:hover > .category-icon,
 357 #category-sync[selected] > .category-icon {
 358   -moz-image-region: rect(24px, 144px, 48px, 120px);
 359 }
 360
 361 #category-advanced > .category-icon {
 362   -moz-image-region: rect(0, 168px, 24px, 144px)
 363 }
 364
 365 #category-advanced:hover > .category-icon,
 366 #category-advanced[selected] > .category-icon {
 367   -moz-image-region: rect(24px, 168px, 48px, 144px);
 368 }
 369
 370 /* header */
 371
 372 .header {
 373   margin-bottom: 15px;
 374 }
 375
 376 .header-icon {
 377   width: 40px;
 378   max-height: 40px;
 379   -moz-margin-end: 20px;
 380   list-style-image: url("chrome://browser/skin/preferences/in-content/header.png");
 381 }
 382
 383 .header-name {
 384   font-size: 2.5rem;
 385   font-weight: normal;
 386   line-height: 40px;
 387   margin: 0;
 388 }
 389
 390 #header-general > .header-icon {
 391   -moz-image-region: rect(0, 40px, 40px, 0);
 392 }
 393
 394 #header-content > .header-icon {
 395   -moz-image-region: rect(0, 80px, 40px, 40px);
 396 }
 397
 398 #header-application > .header-icon {
 399   -moz-image-region: rect(0, 120px, 40px, 80px);
 400 }
 401
 402 #header-privacy > .header-icon {
 403   -moz-image-region: rect(0, 160px, 40px, 120px);
 404 }
 405
 406 #header-security > .header-icon {
 407   -moz-image-region: rect(0, 200px, 40px, 160px);
 408 }
 409
 410 #header-sync > .header-icon {
 411   -moz-image-region: rect(0, 240px, 40px, 200px);
 412 }
 413
 414 #header-advanced > .header-icon {
 415   -moz-image-region: rect(0, 280px, 40px, 240px);
 416 }
 417
 418 @media (min-resolution: 2dppx) {
 419   .header-icon {
 420     list-style-image: url("chrome://browser/skin/preferences/in-content/header@2x.png");
 421   }
 422
 423   #header-general > .header-icon {
 424     -moz-image-region: rect(0, 80px, 80px, 0);
 425   }
 426
 427   #header-content > .header-icon {
 428     -moz-image-region: rect(0, 160px, 80px, 80px);
 429   }
 430
 431   #header-application > .header-icon {
 432     -moz-image-region: rect(0, 240px, 80px, 160px);
 433   }
 434
 435   #header-privacy > .header-icon {
 436     -moz-image-region: rect(0, 320px, 80px, 240px);
 437   }
 438
 439   #header-security > .header-icon {
 440     -moz-image-region: rect(0, 400px, 80px, 320px);
 441   }
 442
 443   #header-sync > .header-icon {
 444     -moz-image-region: rect(0, 480px, 80px, 400px);
 445   }
 446
 447   #header-advanced > .header-icon {
 448     -moz-image-region: rect(0, 560px, 80px, 480px);
 449   }
 450 }
 451
 452 .indent {
 453   margin-top: 7px;
 454   margin-bottom: 7px;
 455 }
 456
 457 /* General Pane */
 458 /*
 459 filefield {
 460   -moz-appearance: none;
 461   background-color: transparent;
 462   border: none;
 463   padding: 0;
 464 }
 465
 466 .fileFieldContentBox {
 467   background-color: transparent;
 468 }
 469
 470 .fileFieldIcon {
 471   -moz-margin-start: 10px;
 472   -moz-margin-end: 0;
 473 }
 474
 475 .fileFieldLabel {
 476   -moz-margin-start: -26px;
 477   -moz-padding-start: 36px;
 478 }
 479 */
 480
 481 /* Applications Pane Styles */
 482
 483 #applicationsContent {
 484   -moz-margin-start: 60px;
 485   padding: 15px 0;
 486 }
 487
 488 #filter {
 489   -moz-margin-start: 0;
 490 }
 491
 492 #handlersView {
 493   -moz-margin-start: 0;
 494   font-size: 1.25rem;
 495   line-height: 22px;
 496   border: none; /*1px solid #9C9CFF;*/
 497   margin: 0;
 498   overflow-y: auto;
 499   border-top-left-radius: 0;
 500   border-top-right-radius: 0;
 501   height: 500px;
 502 }
 503
 504 #handersView > listheader > treecol {
 505   border-radius: 0;
 506 }
 507
 508 #typeColumn,
 509 #actionColumn {
 510   line-height: 20px;
 511 /*  color: #737980;
 512   height: 36px;
 513   padding: 0 10px;
 514   background-color: #F7F7F7;
 515   border: 1px solid #CCCCCC;
 516   -moz-border-top-colors: none;
 517   -moz-border-right-colors: none;
 518   -moz-border-bottom-colors: none;
 519   -moz-border-left-colors: none;
 520 */
 521 }
 522
 523 #typeColumn:-moz-locale-dir(ltr),
 524 #actionColumn:-moz-locale-dir(rtl) {
 525   border-top-left-radius: 5px;
 526 }
 527
 528 #typeColumn:-moz-locale-dir(rtl),
 529 #actionColumn:-moz-locale-dir(ltr) {
 530   border-top-right-radius: 5px;
 531 }
 532 /*
 533 #typeColumn:hover,
 534 #actionColumn:hover {
 535   border-color: #737980;
 536 }
 537
 538 #typeColumn:hover:active,
 539 #actionColumn:hover:active {
 540   padding: 0 10px;
 541   border-color: #0096DC;
 542 }
 543 */
 544 #typeColumn > .treecol-sortdirection[sortDirection=ascending],
 545 #actionColumn > .treecol-sortdirection[sortDirection=ascending],
 546 #typeColumn > .treecol-sortdirection[sortDirection=descending],
 547 #actionColumn > .treecol-sortdirection[sortDirection=descending] {
 548 }
 549
 550 #typeColumn > .treecol-sortdirection[sortDirection=descending],
 551 #actionColumn > .treecol-sortdirection[sortDirection=descending] {
 552 }
 553
 554 #handlersView > richlistitem {
 555   min-height: 40px !important;
 556 }
 557
 558 .typeIcon {
 559   -moz-margin-start: 10px !important;
 560   -moz-margin-end: 9px !important;
 561 }
 562
 563 .actionIcon {
 564   -moz-margin-start: 11px !important;
 565   -moz-margin-end: 8px !important;
 566 }
 567
 568 .actionsMenu {
 569   height: 40px;
 570   max-height: 40px;
 571 }
 572
 573 .actionsMenu > menupopup > menuitem {
 574   -moz-padding-start: 10px !important;
 575 }
 576
 577 .actionsMenu > menupopup > menuitem > .menu-iconic-left {
 578   -moz-margin-end: 8px !important;
 579 }
 580
 581 /* XXX This style is for bug 740213 and should be removed once that
 582    bug has a solution. */
 583 description > html|a {
 584   cursor: pointer;
 585 }
 586
 587 #offlineAppsList,
 588 #syncEnginesList {
 589 /*  -moz-appearance: none;
 590   color: #737980;
 591   padding: 10px;
 592   border: 1px solid rgba(23,50,77,0.4);
 593   border-radius: 5px;
 594   background-color: #F1F1F1;*/
 595 }
 596
 597 #weavePrefsDeck {
 598   -moz-margin-start: 60px;
 599 }
 600
 601 #noFxaAccount {
 602   /* Overriding the margins from the base preferences.css theme file.
 603      These overrides can be simplified by fixing bug 1027174 */
 604   margin: 0;
 605 }
 606
 607 #weavePrefsDeck > vbox > label,
 608 #weavePrefsDeck > vbox > groupbox,
 609 #weavePrefsDeck > vbox > description,
 610 #weavePrefsDeck > vbox > #pairDevice > label,
 611 #weavePrefsDeck > #needsUpdate > hbox > #loginError,
 612 #weavePrefsDeck > #hasFxaAccount > hbox:not(#tosPP) > label {
 613   /* no margin-start for elements at the begin of a line */
 614   -moz-margin-start: 0;
 615 }
 616
 617 #advancedPrefs {
 618   padding-bottom: 0; /* no padding needed in inContent prefs */
 619 }
 620
 621 #encryptionPanel {
 622   margin-top: 15px;
 623   -moz-margin-start: 60px;
 624 }
 625
 626 #telemetryLearnMore,
 627 #FHRLearnMore,
 628 #crashReporterLearnMore {
 629   /* center the links */
 630   margin-top: 8px;
 631   margin-bottom: 8px;
 632 }
 633
 634
 635 /**
 636  * Sub-dialog
 637  */
 638
 639 #dialogOverlay {
 640   background-color: rgba(0,0,0,0.75);
 641   visibility: hidden;
 642 }
 643
 644 #dialogBox {
 645   border: 1px solid #9C9CFF;
 646   display: -moz-box;
 647   margin: 0;
 648   padding-right: 6px;
 649   padding-left: 6px;
 650 }
 651
 652 #dialogBox[resizable="true"] {
 653   resize: both;
 654   overflow: hidden;
 655   min-height: 30em;
 656   min-width: 66ch;
 657 }
 658
 659 #dialogTitle {
 660   -moz-margin-start: 5px !important;
 661 }
 662
 663 .close-icon {
 664   background-color: transparent !important;
 665   border: none;
 666   box-shadow: none;
 667   height: 18px;
 668   padding: 0;
 669   min-width: 18px;
 670 }
 671
 672 #dialogBox > .groupbox-body {
 673   -moz-appearance: none;
 674   padding: 0;
 675 }
 676
 677 #dialogFrame {
 678   -moz-box-flex: 1;
 679   /* Default dialog dimensions */
 680   height: 20em;
 681   width: 66ch;
 682 }
 683
 684 /* needs to be removed with bug 1035625 */
 685 :-moz-any(dialog, window, prefwindow) resizer {
 686   display: none;
 687 }
 688
 689 tree:not(#rejectsTree) {
 690   min-height: 15em;
 691 }
 692
 693 :-moz-any(dialog, window, prefwindow) groupbox {
 694   -moz-margin-start: 8px;
 695   -moz-margin-end: 8px;
 696 }
 697
 698 /**
 699  * End sub-dialog
 700  */
 701
 702 /* === END shared/in-content/preferences.css === */
 703
 704 caption {
 705 }
 706
 707 .indent-small {
 708   -moz-margin-start: 10px;
 709 }
 710
 711 @media (min-resolution: 2dppx) {
 712   checkbox:hover::before,
 713   checkbox[checked]::before {
 714   }
 715
 716   checkbox[checked]::before {
 717   }
 718
 719   .category-icon {
 720     list-style-image: url("chrome://browser/skin/preferences/in-content/icons@2x.png");
 721   }
 722
 723   #category-general > .category-icon {
 724     -moz-image-region: rect(0, 48px, 48px, 0);
 725   }
 726
 727   #category-general[selected] > .category-icon {
 728     -moz-image-region: rect(48px, 48px, 96px, 0);
 729   }
 730
 731   #category-content > .category-icon {
 732     -moz-image-region: rect(0, 96px, 48px, 48px);
 733   }
 734
 735   #category-content[selected] > .category-icon {
 736     -moz-image-region: rect(48px, 96px, 96px, 48px);
 737   }
 738
 739   #category-application > .category-icon {
 740     -moz-image-region: rect(0, 144px, 48px, 96px);
 741   }
 742
 743   #category-application[selected] > .category-icon {
 744     -moz-image-region: rect(48px, 144px, 96px, 96px);
 745   }
 746
 747   #category-privacy > .category-icon {
 748     -moz-image-region: rect(0, 192px, 48px, 144px);
 749   }
 750
 751   #category-privacy[selected] > .category-icon {
 752     -moz-image-region: rect(48px, 192px, 96px, 144px);
 753   }
 754
 755   #category-security > .category-icon {
 756     -moz-image-region: rect(0, 240px, 48px, 192px);
 757   }
 758
 759   #category-security[selected] > .category-icon {
 760     -moz-image-region: rect(48px, 240px, 96px, 192px);
 761   }
 762
 763   #category-sync > .category-icon {
 764     -moz-image-region: rect(0, 288px, 48px, 240px);
 765   }
 766
 767   #category-sync[selected] > .category-icon {
 768     -moz-image-region: rect(48px, 288px, 96px, 240px);
 769   }
 770
 771   #category-advanced > .category-icon {
 772     -moz-image-region: rect(0, 336px, 48px, 288px);
 773   }
 774
 775   #category-advanced[selected] > .category-icon {
 776     -moz-image-region: rect(48px, 336px, 96px, 288px);
 777   }
 778 }