[Button] small button text not vertically centered with Roboto

[apokusin]

Current behavior 😯

The text inside of a button with size="small" is not centered vertically. This is especially obvious when used with an icon or a contained/outlined button.

Expected behavior 🤔

The text inside of a button with size="small" is centered vertically.

Steps to reproduce 🕹

Steps:

1. Use <Button size="small">text</Button>
2. Observe text

Context 🔦

Codesandbox link

Screenshots:
Medium (alignment ok)

Small (text too high)

Your environment 🌎

`npx @mui/envinfo`

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

[mnajdova]

I can notice it. It could be a regression after the span wrapping the text was removed. @danilo-leal could you double-check this please?

[apokusin]

The CodeSandbox I've linked to above uses MUI 5.2.2, but I'm also seeing the issue as far back as 5.0.0-rc.0.

[danilo-leal]

I suppose it could be related to the text line-height. The tricky thing is that it seems the overall Button height is composed of the text line-height. In the below example, the texts are without line-hight which makes the Buttons smaller. They seem to be centered though.

If we were about to remove the typography variant button line-height, we should probably add a minHeight to each component size variant so they don't shrink. Does that make sense?

[siriwatknp]

If we were about to remove the typography variant button line-height, we should probably add a minHeight to each component size variant so they don't shrink. Does that make sense?

At this point, I suggest only adjusting to line-height: 1.5 for size small because changing to use minHeight in v5 might be a breaking change. In v6, we can revisit the size implementation again.

[oliviertassinari]

I had noticed the same problem, on macOS 12, Chrome v96! I'm glad we have an issue open about this problem. @apokusin thanks for the care ❤️ .

The large text and outlined variant feels a bit off too:

[shagungarg0]

can i work on this issue??

[abhinav-22-tech]

can i work on this issue??

#30240 This is already on hold.