diff --git a/fixtures/test-html/L0/README.md b/fixtures/test-html/L0/README.md index 93e58a2b9..832edface 100644 --- a/fixtures/test-html/L0/README.md +++ b/fixtures/test-html/L0/README.md @@ -41,6 +41,7 @@ A small set of broad subsystems — not one domain per CSS property. | `text` | `color`, `font-*`, `text-align`, `text-transform`, `text-indent`, `text-overflow`, `text-shadow`, `line-height`, `letter-spacing`, `word-spacing`, `text-decoration-*`, `white-space`, `word-break`, `overflow-wrap`, `direction`, `writing-mode` | | `inline` | Inline element rendering (``, ``, ``, inline box decoration) | | `list` | `
    `, `
      `, `list-style-type`, counters, nested lists | +| `form` | ``, ` + +
      +
      placeholder
      + +
      +
      +
      disabled
      + +
      +
      +
      readonly
      + +
      +
      +
      resize: none (styled)
      + +
      + + + diff --git a/fixtures/test-html/L0/grid-template.html b/fixtures/test-html/L0/grid-template.html index 9f1b44e0b..fd0ba5c4e 100644 --- a/fixtures/test-html/L0/grid-template.html +++ b/fixtures/test-html/L0/grid-template.html @@ -34,99 +34,153 @@
      -
      grid-template-columns: 100px 100px 100px
      -
      -
      1
      -
      2
      -
      3
      +
      +
      1
      +
      2
      +
      3
      grid-template-columns: 1fr 2fr 1fr
      -
      -
      1fr
      -
      2fr
      -
      1fr
      +
      +
      1fr
      +
      2fr
      +
      1fr
      grid-template-columns: repeat(4, 1fr)
      -
      -
      1
      -
      2
      -
      3
      -
      4
      +
      +
      1
      +
      2
      +
      3
      +
      4
      grid-template-rows: 40px 80px 40px
      -
      -
      r1
      -
      r1
      -
      r2
      -
      r2
      -
      r3
      -
      r3
      +
      +
      r1
      +
      r1
      +
      r2
      +
      r2
      +
      r3
      +
      r3
      gap: 8px 16px
      -
      -
      1
      -
      2
      -
      3
      -
      4
      -
      5
      -
      6
      +
      +
      1
      +
      2
      +
      3
      +
      4
      +
      5
      +
      6
      grid-column: span 2 / grid-row: span 2
      -
      -
      span 2 cols
      -
      1x1
      -
      1x1
      -
      span 2 rows
      -
      1x1
      +
      +
      + span 2 cols +
      +
      1x1
      +
      1x1
      +
      + span 2 rows +
      +
      1x1
      grid-auto-flow: dense
      -
      -
      wide
      -
      a
      -
      b
      -
      wide
      -
      c
      +
      +
      + wide +
      +
      a
      +
      b
      +
      + wide +
      +
      c
      grid-template-areas: "h h" "s m" "f f"
      -
      -
      header
      -
      side
      -
      main
      -
      footer
      +
      +
      header
      +
      side
      +
      main
      +
      footer
      -
      diff --git a/fixtures/test-html/L0/inline-elements.html b/fixtures/test-html/L0/inline-elements.html index 74005ea44..aaa469180 100644 --- a/fixtures/test-html/L0/inline-elements.html +++ b/fixtures/test-html/L0/inline-elements.html @@ -93,7 +93,8 @@

      Heading with inline code

      A paragraph with bold, italic, and - link text. Also bold nested italic + link text. Also + bold nested italic and plain text after.

      @@ -112,7 +113,8 @@

      Code and keyboard

       alpha bravo charlie
-delta echo foxtrot
      +delta echo foxtrot

      Highlight and decoration

      @@ -133,9 +135,9 @@

      Highlight and decoration

      Wrapping behavior

      - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do - eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim - ad minim veniam, quis nostrud exercitation ullamco laboris. + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod + tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim + veniam, quis nostrud exercitation ullamco laboris.

      diff --git a/fixtures/test-html/L0/list-style.html b/fixtures/test-html/L0/list-style.html index f4a8b7f54..c87065b68 100644 --- a/fixtures/test-html/L0/list-style.html +++ b/fixtures/test-html/L0/list-style.html @@ -57,13 +57,15 @@

      Ordered list

      Nested lists

        -
      • Outer one +
      • + Outer one
        • Inner alpha
        • Inner bravo
        • -
      • Outer two +
      • + Outer two
        1. Numbered inner
        2. Numbered inner
          3. @@ -98,7 +100,10 @@

          No bullets

          Inside position

            -
          • Marker is inside the content flow and wraps with the text if the line is long enough to demonstrate wrapping behavior
            • +
          • + Marker is inside the content flow and wraps with the text if the line is + long enough to demonstrate wrapping behavior +
          • Short item
          diff --git a/fixtures/test-html/L0/mixed-form.html b/fixtures/test-html/L0/mixed-form.html new file mode 100644 index 000000000..8b914e6ec --- /dev/null +++ b/fixtures/test-html/L0/mixed-form.html @@ -0,0 +1,156 @@ + + + + + Mixed: Form Layout + + + + +
          +
          Contact Form
          + +
          + + +
          + +
          + + + We'll never share your email. +
          + +
          + + +
          + +
          + + +
          + +
          + + I agree to the terms +
          + +
          + + +
          +
          + + diff --git a/fixtures/test-html/L0/mixed-inline-style.html b/fixtures/test-html/L0/mixed-inline-style.html index 0b760bbfe..3ca7eea3a 100644 --- a/fixtures/test-html/L0/mixed-inline-style.html +++ b/fixtures/test-html/L0/mixed-inline-style.html @@ -50,9 +50,7 @@
          inline color override
          -
          - color: #f00 via style="" -
          +
          color: #f00 via style=""
          diff --git a/fixtures/test-html/L0/paint-blend-mode.html b/fixtures/test-html/L0/paint-blend-mode.html index ea594cc5e..95f37b95e 100644 --- a/fixtures/test-html/L0/paint-blend-mode.html +++ b/fixtures/test-html/L0/paint-blend-mode.html @@ -41,18 +41,42 @@ background: #f00; } - .normal .inner { mix-blend-mode: normal; } - .multiply .inner { mix-blend-mode: multiply; } - .screen .inner { mix-blend-mode: screen; } - .overlay .inner { mix-blend-mode: overlay; } - .darken .inner { mix-blend-mode: darken; } - .lighten .inner { mix-blend-mode: lighten; } - .color-dodge .inner { mix-blend-mode: color-dodge; } - .color-burn .inner { mix-blend-mode: color-burn; } - .hard-light .inner { mix-blend-mode: hard-light; } - .soft-light .inner { mix-blend-mode: soft-light; } - .difference .inner { mix-blend-mode: difference; } - .exclusion .inner { mix-blend-mode: exclusion; } + .normal .inner { + mix-blend-mode: normal; + } + .multiply .inner { + mix-blend-mode: multiply; + } + .screen .inner { + mix-blend-mode: screen; + } + .overlay .inner { + mix-blend-mode: overlay; + } + .darken .inner { + mix-blend-mode: darken; + } + .lighten .inner { + mix-blend-mode: lighten; + } + .color-dodge .inner { + mix-blend-mode: color-dodge; + } + .color-burn .inner { + mix-blend-mode: color-burn; + } + .hard-light .inner { + mix-blend-mode: hard-light; + } + .soft-light .inner { + mix-blend-mode: soft-light; + } + .difference .inner { + mix-blend-mode: difference; + } + .exclusion .inner { + mix-blend-mode: exclusion; + } diff --git a/fixtures/test-html/L0/transform-2d.html b/fixtures/test-html/L0/transform-2d.html index d2c769a34..07b9dfced 100644 --- a/fixtures/test-html/L0/transform-2d.html +++ b/fixtures/test-html/L0/transform-2d.html @@ -47,16 +47,32 @@ } /* Individual transforms */ - .translate { transform: translate(20px, 10px); } - .rotate { transform: rotate(45deg); } - .scale { transform: scale(1.5); } - .scale-xy { transform: scale(0.5, 1.5); } - .skew-x { transform: skewX(15deg); } - .skew-y { transform: skewY(15deg); } - .matrix { transform: matrix(0.866, 0.5, -0.5, 0.866, 10, 20); } + .translate { + transform: translate(20px, 10px); + } + .rotate { + transform: rotate(45deg); + } + .scale { + transform: scale(1.5); + } + .scale-xy { + transform: scale(0.5, 1.5); + } + .skew-x { + transform: skewX(15deg); + } + .skew-y { + transform: skewY(15deg); + } + .matrix { + transform: matrix(0.866, 0.5, -0.5, 0.866, 10, 20); + } /* Combined transforms */ - .combined { transform: translate(10px, 10px) rotate(30deg) scale(0.8); } + .combined { + transform: translate(10px, 10px) rotate(30deg) scale(0.8); + }