Skip to content

fix(ui-dialog): allow consumers to override inherited border-radius#2595

Open
HerrTopi wants to merge 1 commit into
masterfrom
fix-margin-border-radius
Open

fix(ui-dialog): allow consumers to override inherited border-radius#2595
HerrTopi wants to merge 1 commit into
masterfrom
fix-margin-border-radius

Conversation

@HerrTopi

Copy link
Copy Markdown
Contributor

Summary

  • Replace Dialog's forced inline border-radius: inherit with an @layer-wrapped emotion rule so unlayered consumer styles (e.g. Modal) can override it while the inherit fallback still applies when none is set.

Test Plan

  • Open a Modal and confirm it renders with its own border-radius (not the wrapping container's).
  • Verify Menu / DateInput rendered inside a rounded View still inherit the View's corner radius.

Fixes INSTUI-5068

🤖 Generated with Claude Code

The dialog forced `border-radius: inherit` via an inline style so that content like Menu
and DateInput could inherit a wrapping View's radius. Inline styles (and an equivalent
emotion `css` rule) cannot be overridden by a consumer's own `css` prop, so components
like Modal could not set their own border-radius.

Wrap the `inherit` rule in an `@layer` cascade layer instead. Unlayered consumer styles
always win over layered ones regardless of specificity or source order, so an explicit
border-radius from Modal takes effect while the inherit fallback still applies when no
radius is provided.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@HerrTopi HerrTopi self-assigned this Jun 17, 2026
@github-actions

Copy link
Copy Markdown
PR Preview Action v1.8.1

QR code for preview link

🚀 View preview at
https://instructure.design/pr-preview/pr-2595/

Built to branch gh-pages at 2026-06-17 15:11 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

github-actions Bot pushed a commit that referenced this pull request Jun 17, 2026
@github-actions

Copy link
Copy Markdown

Visual regression report

No changes.

Status Count
Unchanged 32
Changed 0
New 0
Removed 0

📊 View full report

Baselines come from the visual-baselines branch. They refresh on every merge to master.

@HerrTopi HerrTopi requested review from git-nandor and matyasf and removed request for git-nandor June 17, 2026 16:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant