bug(form-field): label position doesn't take outline-width into consideration
- 主要言語
- TypeScript
- スター
- 25k
- フォーク
- 6.8k
- 平均マージ
- 1日 8時間
- マージ済み PR(30日)
- 91
説明
### Is this a regression?
- [ ] Yes, this behavior used to work in the previous version
### The previous version in which this bug was not present was
_No response_
### Description
When using form-field with the outline appearance, the vertical position of the label isn't taking into consideration the outline width.
which means that the thicker the outline is, the more the label is offset from the center.
When using 2px outline, this is not really visible, unless you dynamically change the outline width from 1px to 2px when hovering the form-field, which is really annoying to experience 😅

### Reproduction
https://stackblitz.com/edit/tk7fhpq7?file=src%2Fexample%2Fform-field.scss
### Expected Behavior
The label should remain vertically centered like the input value/placeholder is.
### Actual Behavior
The label isn't vertically centered like the input value/placeholder is.
### Environment
- Angular: 20.0.4
- CDK/Material: 20.0.4
- Browser(s): Chrome 137
- Operating System: macOS
コントリビューションガイド
調査の方向性
Start with the linked StackBlitz reproduction and inspect src/example/form-field.scss to reproduce the outline-label offset with different outline widths. Trace the Angular Material form-field outline label positioning, then verify that the label remains vertically centered like the input value or placeholder across the reported widths.
索引モデルが issue の本文から書いたものです。
評価
- 技術スタック
- angular, typescript
- 領域
- frontend
- issue の種類
- バグ
- 難易度
- 3/5
- 見積もり時間
- 1〜2日
- 活発さ
- 静か
- 明瞭さ
- おおむね明確
- 初心者へのやさしさ
- 55/100