Skip to content

Adjust grid centre rule clipping - #16141

Merged
frederickobrien merged 1 commit into
mainfrom
adjust-centre-rule-clipping
Jun 12, 2026
Merged

frederickobrien merged 1 commit into
mainfrom
adjust-centre-rule-clipping

Conversation

@frederickobrien

@frederickobrien frederickobrien commented Jun 12, 2026 •

Copy link
Copy Markdown
Contributor

This addresses a bug where the overflow: hidden property applied to containers using the grid module's centreRule() doesn't play nicely with lightbox. Changing the container property contain: paint does the trick and is more semantically correct anyway a grid container's vertical rules should stay in their box.

@frederickobrien frederickobrien changed the title Update grid.ts Adjust grid centre rule clipping Jun 12, 2026
@frederickobrien frederickobrien self-assigned this Jun 12, 2026
@github-actions

Copy link
Copy Markdown

Hello 👋! When you're ready to run Chromatic, please apply the run_chromatic label to this PR.

You will need to reapply the label each time you want to run Chromatic.

Click here to see the Chromatic project.

@frederickobrien
frederickobrien requested a review from a team June 12, 2026 08:48
@frederickobrien frederickobrien added the fix Departmental tracking: fix label Jun 12, 2026
@frederickobrien frederickobrien added this to the Interactives milestone Jun 12, 2026
@frederickobrien frederickobrien added the run_chromatic Runs chromatic when label is applied label Jun 12, 2026
@github-actions github-actions Bot removed the run_chromatic Runs chromatic when label is applied label Jun 12, 2026
@arelra

arelra commented Jun 12, 2026

Copy link
Copy Markdown
Member

A symptom of the bug this PR fixes as raised by @simonbyford :
https://chat.google.com/room/AAAAG9rU0m0/QzREZts8vlo/QzREZts8vlo?cls=10

lightbox-weirdness-2.mp4

*/
const centreRule = (n: number, color?: string): string => `/* CENTRE RULE */
overflow: hidden;
contain: paint;

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@arelra arelra left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🙏

@frederickobrien
frederickobrien merged commit 52eeb86 into main Jun 12, 2026
33 of 35 checks passed
@frederickobrien
frederickobrien deleted the adjust-centre-rule-clipping branch June 12, 2026 09:15
@gu-prout

gu-prout Bot commented Jun 12, 2026

Copy link
Copy Markdown

Seen on PROD (merged by @frederickobrien 9 minutes and 28 seconds ago) Please check your changes!

@groakland groakland added maintenance Departmental tracking: maintenance work, not a fix or a feature and removed fix Departmental tracking: fix labels Sep 2, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

maintenance Departmental tracking: maintenance work, not a fix or a feature Seen-on-PROD

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants