Repository navigation
bug: ion-textarea custom style not working for help or count #3112
Description
Describe the Bug
Based on ionic documentation we can access and change the attributes of count and error .
https://ionicframework.com/docs/api/textarea
Below is a demo to change the size and color.
Expected Behavior
`ion-textarea.custom {
--background: #373737;
--color: #fff;
--padding-end: 10px;
--padding-start: 10px;
--placeholder-color: #ddd;
--placeholder-opacity: 0.8;
}
ion-textarea.custom .helper-text,
ion-textarea.custom .counter {
color: red !important;
font-size: 24px !important;
}`
Is expected to change the the style of helper and counter
Steps to Reproduce
Latest stackblitz from ionic documentation
Screenshots
Operating System
windows
Browser
firefox, chrome
Version
No response
Additional Information
No response
Activity
mapsandapps commentedon Sep 12, 2023
Hi, thank you for the report! I can see that this example in the docs is not working in Angular. Angular encapsulation is preventing the
helper-textclass from getting the styles applied to it. You can fix this in the Stackblitz by movinginto the global.css file.
We need to update the docs to address this and also change the specificity to remove the requirement of
!important.liamdebeasi commentedon Oct 17, 2023
Thanks for reporting this! This is fixed in #3199