bug: The clear button of ion-input remains gray

[SidiBecker]

Bug Report

Ionic version:
[x] 4.8.0

Current behavior:
The clear button color remains gray

Expected behavior:
The clear button color must match the color set

Steps to reproduce:

ionic start

Put <ion-input clearInput value="clear me"></ion-input> on HTML

Set color on app.scss:

:root{ 
      --ion-color-step-600: red;
 }

Related code:

Screenshot of bug

Ionic info:

   Ionic CLI                     : 5.1.0 (C:\Users\sidi\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.8.0
   @angular-devkit/build-angular : 0.13.9
   @angular-devkit/schematics    : 7.3.9
   @angular/cli                  : 7.3.9
   @ionic/angular-toolkit        : 1.5.1

Cordova:

   Cordova CLI       : not installed
   Cordova Platforms : not available
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.0, (and 6 other plugins)

Utility:

   cordova-res : not installed
   native-run  : 0.2.6

System:

   NodeJS : v10.16.0 (C:\Program Files\nodejs\node.exe)
   npm    : 6.9.0
   OS     : Windows 10

[jakubnovak998]

Hi,
The color remains gray because you didn't assign the color to any of ion-input's custom properties https://ionicframework.com/docs/api/input#css-custom-properties

[SidiBecker]

Hi,
The color remains gray because you didn't assign the color to any of ion-input's custom properties https://ionicframework.com/docs/api/input#css-custom-properties

Hi @jakubnovak998,
I set --color: white; and --placeholder-color: white; on ion-input, but the color remains gray

[SidiBecker]

I was able to provisionally resolve this way:

https://forum.ionicframework.com/t/ionic-4-the-clear-button-of-ion-input-remains-gray/171968/8

[ionitron-bot]

This issue has been labeled as help wanted. This label is added to issues that we believe would be good for contributors.

If you'd like to work on this issue, please comment here letting us know that you would like to submit a pull request for it. This helps us to keep track of the pull request and make sure there isn't duplicated effort.

For a guide on how to create a pull request and test this project locally to see your changes, see our contributing documentation.

Thank you!

[liamdebeasi]

Thanks for the issue. This has been resolved via #26354, and a fix will be available in an upcoming release of Ionic Framework.

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.