Skip to content

Breakpoints are set from sharedTokens#2602

Open
matyasf wants to merge 1 commit into
masterfrom
unify_breakpoints
Open

Breakpoints are set from sharedTokens#2602
matyasf wants to merge 1 commit into
masterfrom
unify_breakpoints

Conversation

@matyasf

@matyasf matyasf commented Jun 23, 2026

Copy link
Copy Markdown
Collaborator
  • FormFieldLayout and Grid now uses design tokens from sharedTokens to set breakpoint values.
  • Document app has fewer CSS breakpoints and their value are the same as the breakpoints in SharedTokens.
  • update button example in regression test with more valuers

To test:

  • check the docs app at different sizes and on mobile that it looks OK.
  • check FormFieldLayout and Grid docs pages that they look OK.
  • check the new Button examples in the regression test

INSTUI-5074

@matyasf matyasf self-assigned this Jun 23, 2026
@matyasf matyasf requested a review from adamlobler June 23, 2026 13:59
@github-actions

github-actions Bot commented Jun 23, 2026

Copy link
Copy Markdown
PR Preview Action v1.8.1

QR code for preview link

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

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

@matyasf matyasf force-pushed the unify_breakpoints branch from c6905a7 to cddecab Compare June 23, 2026 14:27
FormFieldLayout and Grid now uses design tokens from sharedTokens to set breakpoint values.
Document app has fewer CSS breakpoints and their value are the same as the breakpoints in
SharedTokens.
update button example in regression test with more valuers

INSTUI-5074
@matyasf matyasf force-pushed the unify_breakpoints branch from cddecab to d72271d Compare June 23, 2026 21:16
github-actions Bot pushed a commit that referenced this pull request Jun 23, 2026
@github-actions

Copy link
Copy Markdown

Visual regression report

⚠️ Changes detected.

Status Count
Unchanged 31
Changed 1
New 0
Removed 0

📊 View full report

Diff images (1)

button-and-derivatives.png — 98193 pixels differ

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

private navFocusRegion: FocusRegion | null = null

static defaultProps = {
trayWidth: 300

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

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

For some reason from ancient times, the App component had this prop. It's now hardcoded

@matyasf matyasf requested a review from HerrTopi June 24, 2026 12:30
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.

2 participants