Repository navigation
Conversation
`.prose figure.code:has(.code-copy) pre` opened 16px above the code only once the client script inserted the copy button, so every code block on screen moved down after a slow load. With scripts held back a second the shift was measured on /ranui/select/ (0.0009) and /ranui/button/ (0.0020); keyed to the `js` class the head script sets before paint, both are 0. This is one confirmed contributor to the intermittent "pages do not shift" failure on Linux CI (0.092 on /ranui/select/), not necessarily all of it: that value has not been reproduced on macOS or in a Linux container. The test now names what moved when it fails. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Deploying ran with
|
| Latest commit: |
3fd50b1
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://914238b3.ran-4ty.pages.dev |
| Branch Preview URL: | https://fix-code-copy-shift.ran-4ty.pages.dev |
This branch has not been deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
The code-block copy button is inserted by the client script. The rule that makes room for it,
.prose figure.code:has(.code-copy) pre { padding-top: 32px }, therefore applied only after insertion, so every code block on screen moved 16px down once scripts ran. On a slow load that happens after first paint and counts as layout shift.Fix
Key the padding to the
jsclass that the inline head script sets before first paint (.js .prose figure.code pre). No-JS readers keep the compact block; if the client script fails, 16px stays empty.Evidence
With every script held back one second (Chromium, 1280×900, built site):
Docs browser tests (design-checklist, layout-audit, controls, reading-width): 95 passed on Chromium.
What this does not prove
CI's intermittent
pages do not shift while they loadfailure measured 0.092 on /ranui/select/ (2 of the last 6 runs). By the shift formula, this 16px move of a partly visible code block cannot alone reach 0.092, so it is one confirmed contributor, not necessarily the whole cause. I could not reproduce 0.092 on macOS (where Geist is installed system-wide, which hides font-swap effects) or in the repository's Linux container. The test now prints the moved elements on failure, so the next occurrence will show the rest.🤖 Generated with Claude Code