Fix layout bug with Claude button

[alexandratran]

In most cases, when reloading a documentation page, the "Open in Claude" button appears above the page title for a split second before moving to the right of the title.

[swastik7805]

Hi @alexandratran,

Root Cause

The flash occurs because CopyPageButton renders in its default DOM position (top-left) before useEffect in DocH1CopyPageWrapper can move it inside .h1Wrapper. This is a hydration/paint timing issue — the browser paints the button at its natural flow position for a split second before JS repositions it.

Fix (PR #2816)

Pure CSS fix in CopyPageButton.module.css — no JS changes required:

• .container → display: none by default (hidden until positioned)
• .h1Wrapper .container → display: inline-block (visible only after useEffect moves it into the wrapper)
• .standalone → display: inline-block (preserves standalone behavior on MDX pages where no .h1Wrapper exists)

This ensures the button is never visible until it's already in the correct position — eliminating the flash entirely.

Verification

Verified via npm run build && npm run serve (production build) since the flash is not reliably reproducible in dev mode due to HMR timing differences. The fix was also reviewed by Cursor Bugbot as Low Risk with no functional regressions.

[Video proof attached — screen recording of hard reload before and after fix]

Happy to make any changes based on feedback!

[swastik7805]

Atleast bro first check the main website and then post the issue.There is no such bugs right now.