-
Notifications
You must be signed in to change notification settings - Fork 13.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(many): form controls labels have increased margin #27447
Conversation
Run & review this pull request in StackBlitz Codeflow. |
} | ||
|
||
::slotted([slot="end"]) { | ||
@include margin(0, 0, 0, var(--margin)); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I incorrectly assumed that the margins in the slots should be the same as the margin between the control and the label, so I reverted the --margin
usage.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Full disclosure that I didn't look through all the screenshots; Github seems to have somehow gotten even worse at rendering large PRs like this 😅 In the future it may be useful to make the changes per component and run the screenshot job each time, so that the screenshot commits are broken up into smaller chunks.
Issue number: resolves #27129
What is the current behavior?
Material Design has 16px of margin between the form control and the label, but we have 8px: https://m2.material.io/components/selection-controls#usage
What is the new behavior?
Note: This should only apply to labels that are on the same line as the form control. In other words, they do not apply to stacked/floating labels.
Does this introduce a breaking change?
Other information