bug: Custom CSS Properties Not Applying to ion-input with "fill" Attribute

[MustafaBaban]

bug: Custom CSS Properties Not Applying to ion-input with "fill" Attribute

[sean-perkins]

Hello @MustafaBaban thanks for this issue.

The problem you are experiencing is related to CSS specificity. The Ionic Framework implementation applies the styles to an .input-fill-solid class that has a higher specificity than your .custom-input class.

Applying a more specific selector, such as:

.custom-input.md {

will result in the styles applying as expected.

[MustafaBaban]

I plan on creating a pull request for this Issue

[MustafaBaban]

Thank you for your quick answer and guidance on the CSS specificity issue

While your suggestion is valid, it requires an additional class not mentioned in the documentation.

To maintain consistency with the Ionic documentation and improve developer experience, may I propose submitting a PR myself to address this?

I believe a slight adjustment could help others facing the same issue, ensuring styles apply as expected without extra specificity. Would that be ok?

[sean-perkins]

@MustafaBaban could you share what your suggestion for a PR would include? I want to make sure you aren't investing time into a path we may not accept.

[MustafaBaban]

Hey @sean-perkins,

It looks like I won't be able to get to that PR. Really sorry about that. I was looking forward to contributing, but it seems like it's not in the cards right now.

I'm still hoping the issue with the ion-input fill custom CSS properties gets some attention. Just won't be able to tackle it myself at the moment. Sorry <3