Open Ykseew opened 1 year ago
Got this inconsistency too.
That's too bad this issue is not corrected by the PrimeNG team because it's a simple scss fix like this :
Need to put this in the primeng bootstrap theme : https://github.com/primefaces/primeng-sass-theme/tree/main/themes/bootstrap4
.p-inputnumber-buttons-stacked {
.p-inputnumber-button-group {
.p-button.p-inputnumber-button {
flex: 1 1 auto;
height: 1rem; // <--- ADDED
}
}
}
As depicted in the screenshot, it appears that the input number field is larger in size compared to the other fields when utilizing a Bootstrap theme.
You can see the issue on the stackblitz associated.
Themes with the issue : primeng/resources/themes/bootstrap4-light-blue/theme.css primeng/resources/themes/bootstrap4-light-purple/theme.css primeng/resources/themes/bootstrap4-dark-blue/theme.css primeng/resources/themes/bootstrap4-dark-purple/theme.css
Thanks.
Environment
PrimeNGDoc, Google Chrome Latest version, Opera latest version Windows 10.
Reproducer
https://stackblitz.com/edit/ibmm32?file=src%2Fapp%2Fdemo%2Finput-number-buttons-demo.html,src%2Fapp%2Fdemo%2Finput-number-buttons-demo.scss
Angular version
16.2.0
PrimeNG version
16.3.1
Build / Runtime
Angular CLI App
Language
TypeScript
Node version (for AoT issues node --version)
18.18.0
Steps to reproduce the behavior
Try with the stackblitz : https://stackblitz.com/edit/ibmm32?file=src%2Fapp%2Fdemo%2Finput-number-buttons-demo.html,src%2Fapp%2Fdemo%2Finput-number-buttons-demo.scss
OR