Skip to content

fix(material/button): compute M2 icon-button density padding with CSS calc - #33657

Open
jvanderen1 wants to merge 4 commits into
angular:mainfrom
jvanderen1:fix/icon-button-dynamic-padding-calc
Open

fix(material/button): compute M2 icon-button density padding with CSS calc#33657
jvanderen1 wants to merge 4 commits into
angular:mainfrom
jvanderen1:fix/icon-button-dynamic-padding-calc

Conversation

@jvanderen1

@jvanderen1 jvanderen1 commented Aug 10, 2026

Copy link
Copy Markdown

Summary

  • Replaces compile-time Sass math.div padding in the M2 icon-button density theme with native CSS calc() using --mat-icon-button-state-layer-size and --mat-icon-button-icon-size.
  • Padding now stays centered when either token changes at runtime, matching the existing structural styles in icon-button.scss.
  • Removes obsolete TODOs and the unused sass:math / $icon-size helpers from the density path.

Test plan

  • Verify M2 icon buttons at density scales 0 through -5 keep the icon visually centered
  • Override --mat-icon-button-state-layer-size and confirm padding updates with width/height
  • Override --mat-icon-button-icon-size and confirm padding updates accordingly
  • Smoke-check M3 icon buttons (density path unchanged) for no visual regression

@google-cla

google-cla Bot commented Aug 10, 2026

Copy link
Copy Markdown

Thanks for your pull request! It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

View this failed invocation of the CLA check for more information.

For the most up to date status, view the checks section at the bottom of the pull request.

@jvanderen1 jvanderen1 closed this Aug 10, 2026
@jvanderen1 jvanderen1 reopened this Aug 10, 2026
@jvanderen1

Copy link
Copy Markdown
Author

I went ahead and signed the CLA, but don't know how to re-trigger the check.

@jvanderen1
jvanderen1 force-pushed the fix/icon-button-dynamic-padding-calc branch from 98bafb7 to d1e2d8a Compare August 11, 2026 15:11
@jvanderen1
jvanderen1 force-pushed the fix/icon-button-dynamic-padding-calc branch from d1e2d8a to 1fafde2 Compare August 11, 2026 15:13
jvanderen1 and others added 3 commits August 11, 2026 09:53
Co-authored-by: Cursor <cursoragent@cursor.com>
…e calc

Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants