html.css (24189B)
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 @namespace url(http://www.w3.org/1999/xhtml); /* set default namespace to HTML */ 6 @namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul); 7 8 @font-face { 9 font-family: -moz-bullet-font; 10 src: url("data:font/woff2;base64,d09GMgABAAAAAAScAAsAAAAACfAAAARNAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAABmAAhBIRCAqGMIRJATYCJAMsCxgABCAFhF4HaBsuCMgehXEsLOlXaXd7sgbPQ172fjLwdhYFM92mABaiTuRVdO5/mx9I5UJiJom3phLRQw/TSF2M/vo25+pNyWkNws81NrUDAAf0QOdfcf7nmPEyBPZtCbbZEDuosskKZG922ZhBenh05qcSXktf6s3Oy9dAkWsyDzMoM5QTKcwKNjFayUPSREGFhUMrdE8MJsH052qGcYNO3pbEaYIBoDTItIKGAqhDdKHRD0kkKg6QGSCWEfueTNr3P6OvYaIbDH/8ULEAbjQtUt+hT/qmX/SH/twwMLDqN4jxzXjy4PHtltSA6lINqkpRd7N7onVBP20y7YBWyDIHFEBjqKBFMmECfQcTZtD3MmEB/SATVtCPM2ED/TQTdtCfS0/pEsN4ySin3r8q8xHE+0D0XMg8gJi4YrNpNv3qetXuDyeo6OBNZrq5gi7ouC1zcmB2Fd+FewIhcUIfszpF1hzXhrmMCwxaznRyZjig6Y2W7+bBn2DL8fJu/2oHbWc6X80+LUTXcVzv8O3IOy4qKVyFw/DHaMtfzNQEi5gbFT/EDpiofbpkYq2dQui6WcpfxrVBEJ/KxbLA4ZroZoVx+iE+QeTIiI7oKuoUIk/a1ekEOoNFjozm0suYYUelq13/88K1c3PTH9O9Q0d5LZbu7+J2aT7XP23KyQs+34WTU7r8d/k0l6dLl98Dn+/BSUZc7U0mm7FqhSMO9EHV/j5FB4qYX4aXNaKwz/4RRfAWsW8xGW+hvr8PTAf6IP9mRpkDwwv7QFz9HRuOeGWfd8rkyYsWTVy4vpG/pgVNWzBx0aTeIgeq58XFVfZXVduwuOq51a77aT0XLVw4v1PBFjRsQzO+tVeVp3KIwqfKbd6sdjzGvFSuPMquGpMT29lkrhwbE5uz6cGHhIETB06oUk+6tHLJgfnu/3nVnJzYxiXNjQNjYqsu+vCgYKDla5uUOzTNDZg46eCBd3d3gSk9Kz/bFiv8hvOzCT5eqyjBGerT+EiG/JGqwbC+UQ6Bv9bmKGWMj8Yn+fPVRJxKBGqTFXQyM9DhHSlvEHmLVxyYjY/Fdd3hACfLyP3VVZLvVR7B0pxSsGIBqHhwT5sSMOMkRG0BJhpsWMkEO24KwE0pqp3tIYTWCIjJjuBiGNTKTj8JoBLKAn4TmPFnj9oywZwFGx4egp1g3oObeLHdwUO2pFcYTITZCa2c1GQbNg6RCsu9bpikThhAWnLaBi3LM8+5VbMU6rUn30owOC83ULcfBlClb5BBre46BinaWRal85SUvlCbUx1Nbyj2HWCxBTkEgWScQKzsTioJW0IanAYRZqET4mZLSKU2JABII9np01lQ7lOt3srtM1KAeqgQPhYJSMCZJRuAukRZB1CF35gB1MJBr4ilIPZchNyIlDkpRt+3s96cz9K8XKQvCdZfcqWxgtLoXZ2AoKAyVSRRxSRmsYjVOriP089q3z6gdMjE5KI7kzumWzpnAwAAAA=="); 11 } 12 13 /* bidi */ 14 15 :-moz-has-dir-attr { 16 unicode-bidi: isolate; 17 } 18 :-moz-dir-attr-rtl { 19 direction: rtl; 20 } 21 :-moz-dir-attr-ltr { 22 direction: ltr; 23 } 24 25 :-moz-dir-attr-like-auto:dir(ltr) { 26 direction: ltr; 27 } 28 :-moz-dir-attr-like-auto:dir(rtl) { 29 direction: rtl; 30 } 31 32 /* https://html.spec.whatwg.org/#bidi-rendering */ 33 input[type="tel"]:dir(ltr) { 34 direction: ltr; 35 } 36 37 /* To ensure http://www.w3.org/TR/REC-html40/struct/dirlang.html#style-bidi: 38 * 39 * "When a block element that does not have a dir attribute is transformed to 40 * the style of an inline element by a style sheet, the resulting presentation 41 * should be equivalent, in terms of bidirectional formatting, to the 42 * formatting obtained by explicitly adding a dir attribute (assigned the 43 * inherited value) to the transformed element." 44 * 45 * and the rules in http://dev.w3.org/html5/spec/rendering.html#rendering 46 */ 47 48 address, 49 article, 50 aside, 51 blockquote, 52 body, 53 caption, 54 center, 55 col, 56 colgroup, 57 dd, 58 dir, 59 div, 60 dl, 61 dt, 62 fieldset, 63 figcaption, 64 figure, 65 footer, 66 form, 67 h1, 68 h2, 69 h3, 70 h4, 71 h5, 72 h6, 73 header, 74 hgroup, 75 hr, 76 html, 77 legend, 78 li, 79 listing, 80 main, 81 marquee, 82 menu, 83 nav, 84 noframes, 85 ol, 86 p, 87 plaintext, 88 pre, 89 search, 90 section, 91 summary, 92 table, 93 tbody, 94 td, 95 tfoot, 96 th, 97 thead, 98 tr, 99 ul, 100 xmp { 101 unicode-bidi: isolate; 102 } 103 104 bdi, 105 output { 106 unicode-bidi: isolate; 107 } 108 /* We need the "bdo:-moz-has-dir-attr" bit because "bdo" has lower 109 specificity than the ":-moz-has-dir-attr" selector above. */ 110 bdo, 111 bdo:-moz-has-dir-attr { 112 unicode-bidi: isolate-override; 113 } 114 textarea:-moz-dir-attr-like-auto, 115 pre:-moz-dir-attr-like-auto { 116 unicode-bidi: plaintext; 117 } 118 119 /* blocks */ 120 121 article, 122 aside, 123 details, 124 div, 125 dt, 126 figcaption, 127 footer, 128 form, 129 header, 130 hgroup, 131 html, 132 main, 133 nav, 134 search, 135 section, 136 summary { 137 display: block; 138 } 139 140 body { 141 display: block; 142 margin: 8px; 143 } 144 145 p, 146 dl { 147 display: block; 148 margin-block-start: 1em; 149 margin-block-end: 1em; 150 } 151 152 dd { 153 display: block; 154 margin-inline-start: 40px; 155 } 156 157 blockquote, 158 figure { 159 display: block; 160 margin-block: 1em; 161 margin-inline: 40px; 162 } 163 164 address { 165 display: block; 166 font-style: italic; 167 } 168 169 center { 170 display: block; 171 text-align: -moz-center; 172 } 173 174 h1 { 175 display: block; 176 font-size: 2em; 177 font-weight: bold; 178 margin-block: 0.67em; 179 } 180 181 h2 { 182 display: block; 183 font-size: 1.5em; 184 font-weight: bold; 185 margin-block: 0.83em; 186 } 187 188 h3 { 189 display: block; 190 font-size: 1.17em; 191 font-weight: bold; 192 margin-block: 1em; 193 } 194 195 h4 { 196 display: block; 197 font-size: 1em; 198 font-weight: bold; 199 margin-block: 1.33em; 200 } 201 202 h5 { 203 display: block; 204 font-size: 0.83em; 205 font-weight: bold; 206 margin-block: 1.67em; 207 } 208 209 h6 { 210 display: block; 211 font-size: 0.67em; 212 font-weight: bold; 213 margin-block: 2.33em; 214 } 215 216 /* properties from https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/core/css/fullscreen.css;l=68-83;drc=4670338ccf46aaf26aee2402b0f722106d55b003 */ 217 /* stylelint-disable-next-line media-query-no-invalid */ 218 @media (-moz-in-android-pip-mode) and -moz-pref("layout.css.android-pip.enabled") { 219 video { 220 position: fixed !important; 221 left: 0 !important; 222 top: 0 !important; 223 margin: 0 !important; 224 min-width: 0 !important; 225 max-width: none !important; 226 min-height: 0 !important; 227 max-height: none !important; 228 width: 100% !important; 229 height: 100% !important; 230 transform: none !important; 231 232 background-color: black !important; 233 z-index: 2147483647 !important; 234 } 235 } 236 237 listing { 238 display: block; 239 font-family: -moz-fixed; 240 font-size: medium; 241 white-space: pre; 242 margin-block: 1em; 243 } 244 245 xmp, 246 pre, 247 plaintext { 248 display: block; 249 font-family: -moz-fixed; 250 white-space: pre; 251 margin-block: 1em; 252 } 253 254 /* tables */ 255 256 table { 257 display: table; 258 border-spacing: 2px; 259 border-collapse: separate; 260 /* XXXldb do we want this if we're border-collapse:collapse ? */ 261 box-sizing: border-box; 262 text-indent: 0; 263 } 264 265 /* border collapse rules */ 266 267 /* Set hidden if we have 'frame' or 'rules' attribute. 268 Set it on all sides when we do so there's more consistency 269 in what authors should expect */ 270 271 /* Put this first so 'border' and 'frame' rules can override it. */ 272 table[rules] { 273 border-width: thin; 274 border-style: hidden; 275 } 276 277 /* 'border' before 'frame' so 'frame' overrides 278 A border with a given value should, of course, pass that value 279 as the border-width in pixels -> attr mapping */ 280 281 /* :-moz-table-border-nonzero is like [border]:not([border="0"]) except it 282 also checks for other zero-like values according to HTML attribute 283 parsing rules */ 284 table:-moz-table-border-nonzero { 285 border-width: thin; 286 border-style: outset; 287 } 288 289 table[frame] { 290 border: thin hidden; 291 } 292 293 /* specificity must beat table:-moz-table-border-nonzero rule above */ 294 table[frame="void"] { 295 border-style: hidden; 296 } 297 table[frame="above"] { 298 border-style: outset hidden hidden hidden; 299 } 300 table[frame="below"] { 301 border-style: hidden hidden outset hidden; 302 } 303 table[frame="lhs"] { 304 border-style: hidden hidden hidden outset; 305 } 306 table[frame="rhs"] { 307 border-style: hidden outset hidden hidden; 308 } 309 table[frame="hsides"] { 310 border-style: outset hidden; 311 } 312 table[frame="vsides"] { 313 border-style: hidden outset; 314 } 315 table[frame="box"], 316 table[frame="border"] { 317 border-style: outset; 318 } 319 320 /* Internal Table Borders */ 321 322 /* 'border' cell borders first */ 323 324 table:-moz-table-border-nonzero > * > tr > td, 325 table:-moz-table-border-nonzero > * > tr > th, 326 table:-moz-table-border-nonzero > * > td, 327 table:-moz-table-border-nonzero > * > th, 328 table:-moz-table-border-nonzero > td, 329 table:-moz-table-border-nonzero > th { 330 border-width: thin; 331 border-style: inset; 332 } 333 334 /* collapse only if rules are really specified */ 335 table[rules]:not([rules="none"], [rules=""]) { 336 border-collapse: collapse; 337 } 338 339 /* only specified rules override 'border' settings 340 (increased specificity to achieve this) */ 341 table[rules]:not([rules=""]) > tr > td, 342 table[rules]:not([rules=""]) > * > tr > td, 343 table[rules]:not([rules=""]) > tr > th, 344 table[rules]:not([rules=""]) > * > tr > th, 345 table[rules]:not([rules=""]) > td, 346 table[rules]:not([rules=""]) > th { 347 border-width: thin; 348 border-style: none; 349 } 350 351 table[rules][rules="none"] > tr > td, 352 table[rules][rules="none"] > * > tr > td, 353 table[rules][rules="none"] > tr > th, 354 table[rules][rules="none"] > * > tr > th, 355 table[rules][rules="none"] > td, 356 table[rules][rules="none"] > th { 357 border-width: thin; 358 border-style: none; 359 } 360 361 table[rules][rules="all"] > tr > td, 362 table[rules][rules="all"] > * > tr > td, 363 table[rules][rules="all"] > tr > th, 364 table[rules][rules="all"] > * > tr > th, 365 table[rules][rules="all"] > td, 366 table[rules][rules="all"] > th { 367 border-width: thin; 368 border-style: solid; 369 } 370 371 table[rules][rules="rows"] > tr, 372 table[rules][rules="rows"] > * > tr { 373 border-block-start-width: thin; 374 border-block-end-width: thin; 375 border-block-start-style: solid; 376 border-block-end-style: solid; 377 } 378 379 table[rules][rules="cols"] > tr > td, 380 table[rules][rules="cols"] > * > tr > td, 381 table[rules][rules="cols"] > tr > th, 382 table[rules][rules="cols"] > * > tr > th { 383 border-inline-width: thin; 384 border-inline-style: solid; 385 } 386 387 table[rules][rules="groups"] > colgroup { 388 border-inline-width: thin; 389 border-inline-style: solid; 390 } 391 table[rules][rules="groups"] > tfoot, 392 table[rules][rules="groups"] > thead, 393 table[rules][rules="groups"] > tbody { 394 border-block-width: thin; 395 border-block-style: solid; 396 } 397 398 /* caption inherits from table not table-outer */ 399 caption { 400 display: table-caption; 401 text-align: center; 402 } 403 404 table[align="center"] > caption { 405 margin-inline: auto; 406 } 407 408 table[align="center"] > caption[align="left"]:dir(ltr) { 409 margin-inline-end: 0; 410 } 411 table[align="center"] > caption[align="left"]:dir(rtl) { 412 margin-inline-start: 0; 413 } 414 415 table[align="center"] > caption[align="right"]:dir(ltr) { 416 margin-inline-start: 0; 417 } 418 table[align="center"] > caption[align="right"]:dir(rtl) { 419 margin-inline-end: 0; 420 } 421 422 tr { 423 display: table-row; 424 vertical-align: inherit; 425 } 426 427 col { 428 display: table-column; 429 } 430 431 colgroup { 432 display: table-column-group; 433 } 434 435 tbody { 436 display: table-row-group; 437 vertical-align: middle; 438 } 439 440 thead { 441 display: table-header-group; 442 vertical-align: middle; 443 } 444 445 tfoot { 446 display: table-footer-group; 447 vertical-align: middle; 448 } 449 450 /* for XHTML tables without tbody */ 451 table > tr { 452 vertical-align: middle; 453 } 454 455 td { 456 display: table-cell; 457 vertical-align: inherit; 458 text-align: unset; 459 padding: 1px; 460 } 461 462 th { 463 display: table-cell; 464 vertical-align: inherit; 465 font-weight: bold; 466 padding: 1px; 467 text-align: -moz-center-or-inherit; 468 } 469 470 :is(tr, tbody, thead, tfoot, table) > form:-moz-is-html { 471 /* Important: don't show these forms in HTML */ 472 display: none !important; 473 } 474 475 table[bordercolor] > tbody, 476 table[bordercolor] > thead, 477 table[bordercolor] > tfoot, 478 table[bordercolor] > col, 479 table[bordercolor] > colgroup, 480 table[bordercolor] > tr, 481 table[bordercolor] > * > tr, 482 table[bordercolor] > tr > td, 483 table[bordercolor] > * > tr > td, 484 table[bordercolor] > tr > th, 485 table[bordercolor] > * > tr > th { 486 border-color: inherit; 487 } 488 489 /* inlines */ 490 491 q:before { 492 content: open-quote; 493 } 494 495 q:after { 496 content: close-quote; 497 } 498 499 b, 500 strong { 501 font-weight: bolder; 502 } 503 504 i, 505 cite, 506 em, 507 var, 508 dfn { 509 font-style: italic; 510 } 511 512 tt, 513 code, 514 kbd, 515 samp { 516 font-family: -moz-fixed; 517 } 518 519 u, 520 ins { 521 text-decoration: underline; 522 } 523 524 s, 525 strike, 526 del { 527 text-decoration: line-through; 528 } 529 530 u:lang(ja), 531 u:lang(ko), 532 u:lang(zh), 533 s:lang(ja), 534 s:lang(ko), 535 s:lang(zh), 536 ins:lang(ja), 537 ins:lang(ko), 538 ins:lang(zh), 539 del:lang(ja), 540 del:lang(ko), 541 del:lang(zh), 542 strike:lang(ja), 543 strike:lang(ko), 544 strike:lang(zh) { 545 /* stylelint-disable-next-line */ 546 text-decoration-inset: auto; 547 } 548 549 big { 550 font-size: larger; 551 } 552 553 small { 554 font-size: smaller; 555 } 556 557 sub { 558 vertical-align: sub; 559 font-size: smaller; 560 } 561 562 sup { 563 vertical-align: super; 564 font-size: smaller; 565 } 566 567 nobr { 568 white-space: nowrap; 569 } 570 571 mark { 572 background: Mark; 573 color: MarkText; 574 } 575 576 /* titles */ 577 abbr[title], 578 acronym[title] { 579 text-decoration: dotted underline; 580 } 581 582 /* lists */ 583 584 ul, 585 menu, 586 dir { 587 display: block; 588 list-style-type: disc; 589 margin-block-start: 1em; 590 margin-block-end: 1em; 591 padding-inline-start: 40px; 592 } 593 594 ul, 595 ol, 596 menu { 597 counter-reset: list-item; 598 } 599 600 ol { 601 display: block; 602 list-style-type: decimal; 603 margin-block-start: 1em; 604 margin-block-end: 1em; 605 padding-inline-start: 40px; 606 } 607 608 li { 609 display: list-item; 610 text-align: match-parent; 611 } 612 613 /* nested lists have no top/bottom margins */ 614 :is(ul, ol, dir, menu, dl) ul, 615 :is(ul, ol, dir, menu, dl) ol, 616 :is(ul, ol, dir, menu, dl) dir, 617 :is(ul, ol, dir, menu, dl) menu, 618 :is(ul, ol, dir, menu, dl) dl { 619 margin-block: 0; 620 } 621 622 /* 2 deep unordered lists use a circle */ 623 :is(ol, ul, menu, dir) ul, 624 :is(ol, ul, menu, dir) menu, 625 :is(ol, ul, menu, dir) dir { 626 list-style-type: circle; 627 } 628 629 /* 3 deep (or more) unordered lists use a square */ 630 :is(ol, ul, menu, dir) :is(ol, ul, menu, dir) ul, 631 :is(ol, ul, menu, dir) :is(ol, ul, menu, dir) menu, 632 :is(ol, ul, menu, dir) :is(ol, ul, menu, dir) dir { 633 list-style-type: square; 634 } 635 636 /* leafs */ 637 638 /* <hr> noshade and color attributes are handled completely by 639 * HTMLHRElement::MapAttributesIntoRule. 640 * https://html.spec.whatwg.org/#the-hr-element-2 641 */ 642 hr { 643 color: gray; 644 border-width: 1px; 645 border-style: inset; 646 margin-block: 0.5em; 647 margin-inline: auto; 648 overflow: hidden; 649 650 /* FIXME: This is not really per spec */ 651 display: block; 652 } 653 654 hr[size="1"] { 655 border-style: solid none none none; 656 } 657 658 /* Note that we only intend for the alt content to show up if the image is 659 * broken. But non-broken images/inputs will have a replaced box, and thus we 660 * won't we don't generate the pseudo-element anyways. This prevents 661 * unnecessary reframing when images become broken / non-broken. */ 662 input[type="image"]::before, 663 img::before { 664 content: -moz-alt-content !important; 665 unicode-bidi: isolate; 666 } 667 668 img[usemap], 669 object[usemap] { 670 color: blue; 671 } 672 673 /* https://drafts.csswg.org/css-overflow-4/#overflow-control: 674 * 675 * Host languages should define UA style sheet rules that apply a default value 676 * of clip to such elements and set their overflow-clip-margin to content-box. 677 * 678 * NOTE(emilio): This rule is very hand-wavy, for now the 679 * <embed>/<iframe>/<object> cases are !important to match Blink, but see 680 * https://github.com/whatwg/html/issues/11986 for some discussion about making 681 * it explicit. 682 */ 683 canvas, 684 img, 685 video { 686 overflow-clip-margin: content-box; 687 overflow: clip; 688 } 689 690 frameset { 691 display: block !important; 692 overflow: clip; 693 position: static !important; 694 float: none !important; 695 border: none !important; 696 } 697 698 frame { 699 border-radius: 0 !important; 700 } 701 702 iframe { 703 border: 2px inset; 704 } 705 706 spacer { 707 position: static !important; 708 float: none !important; 709 } 710 711 iframe:focus-visible, 712 body:focus-visible, 713 html:focus-visible { 714 /* These elements historically don't show outlines when focused by default. 715 * We could consider changing that if needed. */ 716 outline-style: none; 717 } 718 719 /* hidden elements: https://html.spec.whatwg.org/#hidden-elements 720 * 721 * Exceptions: 722 * 723 * * area declaration needs to be !important, see below / bug 135040. That's 724 * hacky and broken. 725 * 726 * * [hidden] is implemented as a presentation attribute to avoid a global 727 * selector in a UA sheet. 728 */ 729 base, 730 basefont, 731 datalist, 732 head, 733 link, 734 meta, 735 noembed, 736 noframes, 737 param, 738 rp, 739 script, 740 style, 741 template, 742 title { 743 display: none; 744 } 745 746 area { 747 /* Don't give it frames other than its imageframe */ 748 display: none !important; 749 } 750 751 iframe:fullscreen { 752 /* iframes in full-screen mode don't show a border. */ 753 border: none !important; 754 padding: unset !important; 755 } 756 757 /* Details and summary 758 * https://html.spec.whatwg.org/#the-details-and-summary-elements 759 * 760 * Note that these rules need to be duplicated in details.css for the anonymous 761 * summary, which wouldn't match otherwise. 762 */ 763 details > summary:first-of-type { 764 display: list-item; 765 counter-increment: list-item 0; 766 list-style: disclosure-closed inside; 767 } 768 details[open] > summary:first-of-type { 769 list-style-type: disclosure-open; 770 } 771 772 details::details-content { 773 display: block; 774 content-visibility: hidden; 775 } 776 details[open]::details-content { 777 content-visibility: revert; 778 } 779 780 /* media elements */ 781 video { 782 object-fit: contain; 783 } 784 785 video > img:-moz-native-anonymous { 786 /* Video poster images should render with the video element's "object-fit" & 787 "object-position" properties */ 788 object-fit: inherit !important; 789 object-position: inherit !important; 790 } 791 792 audio:not([controls]) { 793 display: none !important; 794 } 795 796 audio[controls] { 797 /* This ensures that intrinsic sizing can reliably shrinkwrap our 798 controls (which are also always horizontal) and produce a 799 reasonable intrinsic size from them. */ 800 writing-mode: horizontal-tb !important; 801 } 802 803 *|*::-moz-html-canvas-content { 804 display: block !important; 805 /* we want to be an absolute and fixed container */ 806 transform: translate(0) !important; 807 } 808 809 video > .caption-box:-moz-native-anonymous { 810 width: 100%; 811 height: 100%; 812 position: relative; 813 pointer-events: none; 814 } 815 816 /** 817 * The pseudo element won't inherit CSS styles from its direct parent, `::cue` 818 * would actually inherit styles from video because it's video's pseudo element. 819 * Therefore, we have to explicitly set some styles which are already defined 820 * in its parent element in vtt.sys.mjs. 821 */ 822 ::cue { 823 color: rgba(255, 255, 255, 1); 824 white-space: pre-line; 825 background-color: rgba(0, 0, 0, 0.8); 826 font: 10px sans-serif; 827 overflow-wrap: break-word; 828 /* TODO : enable unicode-bidi, right now enable it would cause incorrect 829 display direction, maybe related with bug 1558431. */ 830 } 831 832 /* <dialog> element styles */ 833 834 dialog { 835 position: absolute; 836 display: block; 837 inset-inline-start: 0; 838 inset-inline-end: 0; 839 margin: auto; 840 border-width: initial; 841 border-style: solid; 842 border-color: initial; 843 border-image: initial; 844 padding: 1em; 845 background-color: Canvas; 846 color: CanvasText; 847 width: -moz-fit-content; 848 height: -moz-fit-content; 849 } 850 851 dialog:not([open]) { 852 display: none; 853 } 854 855 dialog:modal { 856 -moz-top-layer: auto !important; 857 position: fixed; 858 overflow: auto; 859 visibility: visible; 860 inset-block-start: 0; 861 inset-block-end: 0; 862 max-width: calc(100% - 6px - 2em); 863 max-height: calc(100% - 6px - 2em); 864 } 865 866 /* https://html.spec.whatwg.org/#flow-content-3 */ 867 dialog::backdrop { 868 background: rgba(0, 0, 0, 0.1); 869 } 870 871 /* https://html.spec.whatwg.org/#the-marquee-element-2 */ 872 marquee { 873 display: inline-block; 874 text-align: initial; 875 overflow: hidden !important; 876 877 /* See https://github.com/whatwg/html/issues/10249 */ 878 inline-size: -moz-available; 879 vertical-align: text-bottom; 880 white-space: nowrap; 881 } 882 883 marquee:is([direction="up"], [direction="down"]) { 884 block-size: 200px; 885 white-space: unset; 886 } 887 888 /* Ruby */ 889 890 ruby { 891 display: ruby; 892 } 893 rb { 894 display: ruby-base; 895 white-space: nowrap; 896 } 897 rt { 898 display: ruby-text; 899 } 900 rtc { 901 display: ruby-text-container; 902 } 903 rtc, 904 rt { 905 white-space: nowrap; 906 font-size: 50%; 907 -moz-min-font-size-ratio: 50%; 908 line-height: 1; 909 } 910 @media not (-moz-platform: windows) { 911 rtc, 912 rt { 913 /* The widely-used Windows font Meiryo doesn't work fine with this 914 * setting, so disable this on Windows. We should re-enable it once 915 * Microsoft fixes this issue. See bug 1164279. */ 916 font-variant-east-asian: ruby; 917 } 918 } 919 rtc, 920 rt { 921 text-emphasis: none; 922 } 923 rtc:lang(zh), 924 rt:lang(zh) { 925 ruby-align: center; 926 } 927 rtc:lang(zh-TW), 928 rt:lang(zh-TW) { 929 font-size: 30%; /* bopomofo */ 930 -moz-min-font-size-ratio: 30%; 931 } 932 rtc > rt { 933 font-size: unset; 934 } 935 ruby, 936 rb, 937 rt, 938 rtc { 939 unicode-bidi: isolate; 940 } 941 942 /* Shadow DOM v1 943 * https://drafts.csswg.org/css-scoping/#slots-in-shadow-tree */ 944 slot { 945 display: contents; 946 } 947 948 /* Hide noscript elements if scripting is enabled */ 949 @media (scripting) { 950 noscript { 951 display: none !important; 952 } 953 } 954 955 @media print { 956 input, 957 textarea, 958 select, 959 button, 960 details { 961 -moz-inert: inert; 962 } 963 } 964 965 /* Popover UA style, https://html.spec.whatwg.org/#flow-content-3 */ 966 967 [popover]:not(:popover-open):not(dialog[open]) { 968 display: none; 969 } 970 971 dialog:popover-open { 972 display: block; 973 } 974 975 [popover] { 976 position: fixed; 977 position-anchor: auto; 978 inset: 0; 979 width: fit-content; 980 height: fit-content; 981 margin: auto; 982 border: solid; 983 padding: 0.25em; 984 overflow: auto; 985 color: CanvasText; 986 background-color: Canvas; 987 } 988 989 :popover-open { 990 -moz-top-layer: auto; 991 } 992 993 :popover-open::backdrop { 994 position: fixed; 995 inset: 0; 996 pointer-events: none !important; 997 background-color: transparent; 998 } 999 1000 /* Editor support */ 1001 1002 .mozResizer:-moz-native-anonymous { 1003 width: 5px; 1004 height: 5px; 1005 position: absolute; 1006 border: 1px black solid; 1007 background-color: white; 1008 user-select: none; 1009 z-index: 2147483646; /* max value -1 for this property */ 1010 1011 /* we can't use :active below */ 1012 &.active, 1013 &:hover { 1014 background-color: black; 1015 } 1016 } 1017 1018 .mozGrabber:-moz-native-anonymous { 1019 outline: ridge 2px silver; 1020 padding: 2px; 1021 position: absolute; 1022 width: 12px; 1023 height: 12px; 1024 background-image: url("resource://gre/res/grabber.gif"); 1025 background-repeat: no-repeat; 1026 background-position: center center; 1027 user-select: none; 1028 cursor: move; 1029 } 1030 1031 .mozResizingShadow:-moz-native-anonymous { 1032 outline: thin dashed black; 1033 user-select: none; 1034 opacity: 0.5; 1035 position: absolute; 1036 z-index: 2147483647; /* max value for this property */ 1037 } 1038 1039 .mozResizingInfo:-moz-native-anonymous { 1040 font-family: sans-serif; 1041 font-size: x-small; 1042 color: black; 1043 background-color: #d0d0d0; 1044 border: ridge 2px #d0d0d0; 1045 padding: 2px; 1046 position: absolute; 1047 z-index: 2147483647; /* max value for this property */ 1048 } 1049 1050 .mozTableAddColumnBefore:-moz-native-anonymous, 1051 .mozTableAddColumnAfter:-moz-native-anonymous, 1052 .mozTableAddRowBefore:-moz-native-anonymous, 1053 .mozTableAddRowAfter:-moz-native-anonymous, 1054 .mozTableRemoveColumn:-moz-native-anonymous, 1055 .mozTableRemoveRow:-moz-native-anonymous { 1056 position: absolute; 1057 z-index: 2147483647; /* max value for this property */ 1058 text-decoration: none !important; 1059 border: none 0 !important; 1060 width: 4px; 1061 height: 8px; 1062 background-repeat: no-repeat; 1063 background-position: center center; 1064 user-select: none; 1065 } 1066 1067 .mozTableAddColumnBefore:-moz-native-anonymous { 1068 background-image: url("resource://gre/res/table-add-column-before.gif"); 1069 &:hover { 1070 background-image: url("resource://gre/res/table-add-column-before-hover.gif"); 1071 } 1072 &:active { 1073 background-image: url("resource://gre/res/table-add-column-before-active.gif"); 1074 } 1075 } 1076 1077 .mozTableAddColumnAfter:-moz-native-anonymous { 1078 background-image: url("resource://gre/res/table-add-column-after.gif"); 1079 &:hover { 1080 background-image: url("resource://gre/res/table-add-column-after-hover.gif"); 1081 } 1082 &:active { 1083 background-image: url("resource://gre/res/table-add-column-after-active.gif"); 1084 } 1085 } 1086 1087 .mozTableAddRowBefore:-moz-native-anonymous, 1088 .mozTableAddRowAfter:-moz-native-anonymous { 1089 width: 8px; 1090 height: 4px; 1091 } 1092 1093 .mozTableAddRowBefore:-moz-native-anonymous { 1094 background-image: url("resource://gre/res/table-add-row-before.gif"); 1095 &:hover { 1096 background-image: url("resource://gre/res/table-add-row-before-hover.gif"); 1097 } 1098 &:active { 1099 background-image: url("resource://gre/res/table-add-row-before-active.gif"); 1100 } 1101 } 1102 1103 .mozTableAddRowAfter:-moz-native-anonymous { 1104 background-image: url("resource://gre/res/table-add-row-after.gif"); 1105 &:hover { 1106 background-image: url("resource://gre/res/table-add-row-after-hover.gif"); 1107 } 1108 &:active { 1109 background-image: url("resource://gre/res/table-add-row-after-active.gif"); 1110 } 1111 } 1112 1113 .mozTableRemoveColumn:-moz-native-anonymous, 1114 .mozTableRemoveRow:-moz-native-anonymous { 1115 width: 8px; 1116 height: 8px; 1117 } 1118 1119 .mozTableRemoveColumn:-moz-native-anonymous { 1120 background-image: url("resource://gre/res/table-remove-column.gif"); 1121 &:hover { 1122 background-image: url("resource://gre/res/table-remove-column-hover.gif"); 1123 } 1124 &:active { 1125 background-image: url("resource://gre/res/table-remove-column-active.gif"); 1126 } 1127 } 1128 1129 .mozTableRemoveRow:-moz-native-anonymous { 1130 background-image: url("resource://gre/res/table-remove-row.gif"); 1131 &:hover { 1132 background-image: url("resource://gre/res/table-remove-row-hover.gif"); 1133 } 1134 &:active { 1135 background-image: url("resource://gre/res/table-remove-row-active.gif"); 1136 } 1137 }