ua.css (14683B)
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 parsererror url(http://www.mozilla.org/newlayout/xml/parsererror.xml); 6 @namespace html url(http://www.w3.org/1999/xhtml); 7 @namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul); 8 9 /* magic -- some of these rules are important to keep pages from overriding 10 them 11 */ 12 13 /* Tables */ 14 15 *|*::-moz-table { 16 display: table; 17 box-sizing: border-box; /* XXX do we really want this? */ 18 } 19 20 *|*::-moz-inline-table { 21 display: inline-table; 22 box-sizing: border-box; /* XXX do we really want this? */ 23 } 24 25 *|*::-moz-table-wrapper { 26 /* The inherited properties here need to be safe to have on both the 27 * table and the table wrapper, generally because code ignores them 28 * for the table. */ 29 display: inherit; /* table or inline-table */ 30 -moz-top-layer: inherit; 31 margin: inherit; 32 float: inherit; 33 clear: inherit; 34 position: inherit; 35 top: inherit; 36 right: inherit; 37 bottom: inherit; 38 left: inherit; 39 z-index: inherit; 40 page-break-before: inherit; 41 page-break-after: inherit; 42 page-break-inside: inherit; 43 vertical-align: inherit; /* needed for inline-table */ 44 line-height: inherit; /* needed for vertical-align on inline-table */ 45 /* Bug 722777 */ 46 transform: inherit; 47 transform-origin: inherit; 48 /* Bug 724750 */ 49 backface-visibility: inherit; 50 clip: inherit; 51 /* Other transform-related properties */ 52 /* transform-style: inherit; Bug 1560704 */ 53 rotate: inherit; 54 scale: inherit; 55 translate: inherit; 56 /* When the table wrapper is a Flex/Grid item we need these: */ 57 align-self: inherit; 58 justify-self: inherit; 59 grid-column-start: inherit; 60 grid-column-end: inherit; 61 grid-row-start: inherit; 62 grid-row-end: inherit; 63 order: inherit; 64 outline: inherit; 65 outline-offset: inherit; 66 column-span: inherit; /* needed if <table> has "column-span:all" */ 67 contain: inherit; /* needed if table has 'contain:layout' or 'paint' */ 68 container: inherit; /* Bug 1805588 */ 69 scroll-margin: inherit; /* Bug 1633192 */ 70 view-transition-name: inherit; /* Bug 1985925 */ 71 } 72 73 *|*::-moz-table-row { 74 display: table-row; 75 } 76 77 /* The ::-moz-table-column pseudo-element is for extra columns at the end 78 of a table. */ 79 *|*::-moz-table-column { 80 display: table-column; 81 /* Make sure anonymous columns don't interfere with hit testing. Basically, 82 * they should pretend as much as possible to not exist (since in the spec 83 * they do not exist). 84 * 85 * Please make sure to not reintroduce 86 * https://bugzilla.mozilla.org/show_bug.cgi?id=1403293 if you change this 87 * bit! 88 */ 89 visibility: hidden; 90 } 91 92 *|*::-moz-table-column-group { 93 display: table-column-group; 94 /* Make sure anonymous colgroups don't interfere with hit testing. Basically, 95 * they should pretend as much as possible to not exist (since in the spec 96 * they do not exist). 97 * 98 * Please make sure to not reintroduce 99 * https://bugzilla.mozilla.org/show_bug.cgi?id=1403293 if you change this 100 * bit! 101 */ 102 visibility: hidden; 103 } 104 105 *|*::-moz-table-row-group { 106 display: table-row-group; 107 } 108 109 *|*::-moz-table-cell { 110 display: table-cell; 111 white-space: inherit; 112 } 113 114 /* Ruby */ 115 *|*::-moz-ruby { 116 display: ruby; 117 unicode-bidi: isolate; 118 } 119 *|*::-moz-ruby-base { 120 display: ruby-base; 121 unicode-bidi: isolate; 122 } 123 *|*::-moz-ruby-text { 124 display: ruby-text; 125 unicode-bidi: isolate; 126 } 127 *|*::-moz-ruby-base-container { 128 display: ruby-base-container; 129 unicode-bidi: isolate; 130 } 131 *|*::-moz-ruby-text-container { 132 display: ruby-text-container; 133 unicode-bidi: isolate; 134 } 135 136 /* https://drafts.csswg.org/css-lists-3/#ua-stylesheet */ 137 ::marker, 138 ::before::marker, 139 ::after::marker { 140 text-align: end; 141 text-align-last: end; 142 text-indent: 0; 143 text-transform: none; 144 unicode-bidi: isolate; 145 font-variant-numeric: tabular-nums; 146 white-space: pre; 147 } 148 149 /* SVG documents don't always load this file but they do have links. 150 * If you change the link rules, consider carefully whether to make 151 * the same changes to svg.css. 152 */ 153 154 /* Links and focusable content */ 155 156 :any-link { 157 cursor: pointer; 158 text-decoration: underline; 159 } 160 161 :any-link:lang(ja), 162 :any-link:lang(ko), 163 :any-link:lang(zh) { 164 /* stylelint-disable-next-line */ 165 text-decoration-inset: auto; 166 } 167 168 :link { 169 color: LinkText; 170 } 171 172 :visited { 173 color: VisitedText; 174 } 175 176 :any-link:active { 177 color: ActiveText; 178 } 179 180 :any-link:read-write { 181 cursor: text; 182 } 183 184 /* stylelint-disable-next-line media-query-no-invalid */ 185 @media -moz-pref("layout.css.always_underline_links") { 186 :any-link { 187 text-decoration: underline !important; 188 } 189 } 190 191 :focus-visible { 192 outline: 1px auto; 193 } 194 195 /* Inert subtrees */ 196 :-moz-inert { 197 -moz-inert: inert; 198 } 199 200 /* Miscellaneous */ 201 202 *|*::-moz-cell-content { 203 display: block; 204 unicode-bidi: inherit; 205 text-overflow: inherit; 206 overflow: inherit; 207 resize: inherit; 208 padding: inherit; 209 box-decoration-break: inherit; 210 } 211 212 *|*::-moz-block-inside-inline-wrapper { 213 display: block; 214 /* we currently inherit from the inline that is split */ 215 position: inherit; /* static or relative or sticky */ 216 outline: inherit; 217 outline-offset: inherit; 218 clip-path: inherit; 219 filter: inherit; 220 mask: inherit; 221 opacity: inherit; 222 text-decoration: inherit; 223 unicode-bidi: inherit; 224 user-select: inherit; 225 text-overflow: inherit; 226 /* The properties below here don't apply if our position is static, 227 and we do want them to have an effect if it's not, so it's fine 228 to always inherit them. */ 229 top: inherit; 230 left: inherit; 231 bottom: inherit; 232 right: inherit; 233 z-index: inherit; 234 } 235 236 *|*::-moz-scrolled-content, 237 *|*::-moz-scrolled-canvas { 238 /* e.g., text inputs, select boxes */ 239 padding: inherit; 240 /* The display doesn't affect the kind of frame constructed here. This just 241 affects auto-width sizing of the block we create. */ 242 display: block; 243 /* make unicode-bidi inherit, otherwise it has no effect on text inputs and 244 blocks with overflow: scroll; */ 245 unicode-bidi: inherit; 246 text-overflow: inherit; 247 /* Please keep the declarations below in sync with ::-moz-fieldset-content 248 in forms.css */ 249 content: inherit; 250 /* Multicol container */ 251 column-count: inherit; 252 column-width: inherit; 253 column-gap: inherit; 254 column-rule: inherit; 255 column-fill: inherit; 256 /* Flex container */ 257 flex-direction: inherit; 258 flex-wrap: inherit; 259 /* -webkit-box container (aliased from -webkit versions to -moz versions) */ 260 -moz-box-orient: inherit; 261 -moz-box-direction: inherit; 262 -moz-box-pack: inherit; 263 -moz-box-align: inherit; 264 -webkit-line-clamp: inherit; 265 /* Grid container */ 266 grid-auto-columns: inherit; 267 grid-auto-rows: inherit; 268 grid-auto-flow: inherit; 269 grid-column-gap: inherit; 270 grid-row-gap: inherit; 271 grid-template-areas: inherit; 272 grid-template-columns: inherit; 273 grid-template-rows: inherit; 274 /* CSS Align */ 275 align-content: inherit; 276 align-items: inherit; 277 justify-content: inherit; 278 justify-items: inherit; 279 } 280 281 *|*::-moz-viewport, 282 *|*::-moz-viewport-scroll, 283 *|*::-moz-canvas, 284 *|*::-moz-scrolled-canvas { 285 display: block; 286 background-color: inherit; 287 } 288 289 *|*::-moz-viewport-scroll { 290 overflow: auto; 291 } 292 293 *|*::-moz-column-set, 294 *|*::-moz-column-content { 295 /* the column boxes inside a column-flowed block */ 296 /* make unicode-bidi inherit, otherwise it has no effect on column boxes */ 297 unicode-bidi: inherit; 298 text-overflow: inherit; 299 /* Both -moz-column-set and -moz-column-content need to be blocks. */ 300 display: block; 301 } 302 303 *|*::-moz-column-set { 304 /* Inherit from ColumnSetWrapperFrame so that nsColumnSetFrame is aware of 305 them.*/ 306 columns: inherit; 307 column-gap: inherit; 308 column-rule: inherit; 309 column-fill: inherit; 310 } 311 312 *|*::-moz-column-span-wrapper { 313 /* As a result of the discussion in 314 * https://github.com/w3c/csswg-drafts/issues/1072, most of the styles 315 * currently applied to ::-moz-block-inside-inline-wrapper should not 316 * apply here. */ 317 display: block; 318 column-span: all; 319 } 320 321 *|*::-moz-anonymous-item { 322 /* Anonymous blocks that wrap contiguous runs of text 323 * inside of a flex / grid / -moz-box container. */ 324 display: block; 325 } 326 327 *|*::-moz-page-sequence { 328 /* Collection of pages in print/print preview. Visual styles may only appear 329 * in print preview. */ 330 display: block; 331 background: #606060 linear-gradient(#606060, #8a8a8a) fixed; 332 print-color-adjust: exact; 333 /* We always fill the available space in both directions */ 334 height: 100%; 335 width: 100%; 336 } 337 338 *|*::-moz-printed-sheet { 339 /* Individual sheet of paper in print/print preview. Visual styles may only 340 * appear in print preview. */ 341 display: block; 342 background: white; 343 print-color-adjust: exact; 344 box-shadow: 5px 5px 8px #202020; 345 box-decoration-break: clone; 346 /* TODO: Remove margin if viewport is small or something? */ 347 margin: 0.125in 0.25in; 348 } 349 350 @media (monochrome) and (-moz-print-preview) { 351 *|*::-moz-page { 352 filter: grayscale(1); 353 } 354 } 355 356 *|*::-moz-page-content { 357 display: block; 358 margin: auto; 359 } 360 361 *|*::-moz-page-break { 362 display: block; 363 } 364 365 /* Printing */ 366 367 @media print { 368 * { 369 cursor: default !important; 370 } 371 } 372 373 :fullscreen:not(:root) { 374 -moz-top-layer: auto !important; 375 position: fixed !important; 376 inset: 0 !important; 377 width: 100% !important; 378 height: 100% !important; 379 margin: 0 !important; 380 min-width: 0 !important; 381 max-width: none !important; 382 min-height: 0 !important; 383 max-height: none !important; 384 box-sizing: border-box !important; 385 object-fit: contain; 386 transform: none !important; 387 } 388 389 /* This pseudo-class is used to remove the inertness for the topmost modal 390 * element in top layer. 391 * 392 * Avoid doing this if the element is explicitly inert though. */ 393 :-moz-topmost-modal:not(html|*[inert]) { 394 -moz-inert: none; 395 /* Topmost modal elements need to be selectable even though ancestors are 396 * inert, but allow users to override this if they want to. */ 397 user-select: text; 398 } 399 400 :root { 401 /** 402 * Ensure we recompute the default color for the root based on its 403 * computed color-scheme. This matches other browsers. 404 * 405 * For the default background, we look at the root 406 * element style frame in 407 * PresShell::GetDefaultBackgroundColorToDraw, however we 408 * can't make the initial style (the style the root element 409 * inherits from) depend on the root element's style, as that 410 * is trivially cyclic. 411 */ 412 color: CanvasText; 413 /* https://drafts.csswg.org/css-view-transitions-1/#ua-styles */ 414 view-transition-name: root; 415 } 416 417 ::backdrop { 418 -moz-top-layer: auto !important; 419 display: block; 420 position: fixed; 421 inset: 0; 422 /* This prevents undesired interactions with the selection code. */ 423 user-select: none; 424 } 425 426 :fullscreen:not(:root)::backdrop { 427 background: black; 428 } 429 430 /* XML parse error reporting */ 431 432 parsererror|parsererror { 433 display: block; 434 font-family: sans-serif; 435 font-weight: bold; 436 white-space: pre; 437 margin: 1em; 438 padding: 1em; 439 border-width: thin; 440 border-style: inset; 441 border-color: red; 442 font-size: 14pt; 443 background-color: lightyellow; 444 color: black; 445 } 446 447 parsererror|parsererror[dir="rtl"] { 448 direction: rtl; 449 } 450 451 parsererror|sourcetext { 452 display: block; 453 white-space: pre; 454 font-family: -moz-fixed; 455 margin-top: 2em; 456 margin-bottom: 1em; 457 color: red; 458 font-weight: bold; 459 font-size: 12pt; 460 direction: ltr; 461 } 462 463 /* Custom content container in the CanvasFrame, positioned on top of everything 464 everything else, not reacting to pointer events. */ 465 .moz-custom-content-container:-moz-native-anonymous { 466 pointer-events: none; 467 user-select: none; 468 -moz-top-layer: auto; 469 position: absolute; 470 top: 0; 471 left: 0; 472 width: 100%; 473 height: 100%; 474 /* Initial direction depends on the document, make sure to reset it */ 475 direction: ltr; 476 } 477 478 /* https://drafts.csswg.org/css-view-transitions-1/#ua-styles */ 479 480 /* :root section moved to the other root selectors for performance */ 481 482 /* ::-moz-snapshot-containing-block is a wrapper of ::view-transition, so we set 483 * some necessary properties here, instead of in ::view-transition. */ 484 :root::-moz-snapshot-containing-block { 485 /* The snapshot containing block is considered to be an absolute positioning 486 * containing block and a fixed positioning containing block for 487 * ::view-transition and its descendants. 488 * Note that we use will-change property to make sure this pseudo-element 489 * establish a fixed positioning containing block. */ 490 will-change: -moz-fixed-pos-containing-block; 491 /* The snapshot containing block itself should be fixed positioned. It doesn't 492 * move when scrolling. */ 493 position: fixed; 494 /* The snapshot containing block origin refers to the top-left corner of the 495 * snapshot containing block. 496 * The snapshot containing block size refers to the width and height of the 497 * snapshot containing block as a tuple of two numbers. */ 498 inset: 0; 499 /* Avoid hit-testing on this pseudo-element. 500 * Note that this doesn't affect `::view-transition` because that inherits 501 * directly from the root. */ 502 pointer-events: none; 503 /* Gecko implementation detail to make sure view transitions render in the 504 * top layer */ 505 -moz-top-layer: auto; 506 } 507 508 :root::view-transition { 509 position: absolute; 510 inset: 0; 511 } 512 513 :root::view-transition-group(*) { 514 position: absolute; 515 top: 0; 516 left: 0; 517 518 animation-duration: 0.25s; 519 animation-fill-mode: both; 520 } 521 522 :root::view-transition-image-pair(*) { 523 position: absolute; 524 inset: 0; 525 } 526 527 :root::view-transition-old(*), 528 :root::view-transition-new(*) { 529 position: absolute; 530 inset-block-start: 0; 531 inline-size: 100%; 532 block-size: auto; 533 } 534 535 :root::view-transition-image-pair(*), 536 :root::view-transition-old(*), 537 :root::view-transition-new(*) { 538 animation-duration: inherit; 539 animation-fill-mode: inherit; 540 animation-delay: inherit; 541 animation-timing-function: inherit; 542 animation-iteration-count: inherit; 543 animation-direction: inherit; 544 animation-play-state: inherit; 545 } 546 547 /* Avoid exposing these keyframe names when view transitions are disabled */ 548 /* stylelint-disable-next-line media-query-no-invalid */ 549 @media -moz-pref("dom.viewTransitions.enabled") { 550 /* Default cross-fade transition */ 551 @keyframes -ua-view-transition-fade-out { 552 to { 553 opacity: 0; 554 } 555 } 556 @keyframes -ua-view-transition-fade-in { 557 from { 558 opacity: 0; 559 } 560 } 561 562 /* Keyframes for blending when there are 2 images */ 563 @keyframes -ua-mix-blend-mode-plus-lighter { 564 from { 565 mix-blend-mode: plus-lighter; 566 } 567 to { 568 mix-blend-mode: plus-lighter; 569 } 570 } 571 } 572 573 @media print { 574 :-moz-suppress-for-print-selection { 575 display: none !important; 576 } 577 }