Skip to content

Retain authored data attributes used by motion background layout selectors #2354

Description

@chubes4

Reproduction

A fresh 17-route capture of https://www.donihomeimprovement.com/about/ retains a background layer with data-motion-part="BG_MEDIA comp-kbaeog2x". Its source stylesheet selects #comp-kbaeog2x [data-motion-part="BG_MEDIA comp-kbaeog2x"] to supply a 2450px height and -900px top margin at 1600px. The static capture renders the hero image at y=0.

In the paired WordPress import, the same editable group (#bgMedia_comp-kbaeog2x) loses data-motion-part; the selector no longer matches, so the group becomes height 0, margin 0 and the hero moves to y=421. The containing #comp-kbaeog2x also loses the captured inline --motion-comp-height:650px, and computes height 0. This is a capture→WordPress regression independent of the source→capture gallery changes. The homepage shares the same wrapper structure.

Acceptance

Keep source-authored selector identity on native editable blocks when a retained stylesheet references a safe data attribute. Carry geometry-bearing custom properties needed by retained CSS. Verify the imported background wrapper and hero positions at 390, 768, 1600 and 1728px; do not trade away native editability.

AI assistance

OpenAI GPT-6 Sol via OpenCode compared computed source, captured and imported DOM ancestry and measured the lost selectors; Chris Huber directed the parity loop.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions