-1

I have upgraded my project to Ionic 7 and now ion-inputs don't need an ion-label. I have changed it but I don't know how to assign the color they had.

Before:

enter image description here

enter image description here

After: enter image description here

enter image description here

I can't find anything related in the documentation. Can someone help me??

hugocantito
  • 1
  • 1
    Please don't post code as image - paste the actual code and format it for better readability and better chance to get an answer. Anyway, I still didn't move to ionic 7, but there must be some shadow DOM selector you could use to access the label of the ion-input. Check css classes assigned to parts of ion-input and try to target them specifically. Also, experiment with ::part() to see what you can catch. I am also interested to see the real answer. – Misha Mashina May 09 '23 at 19:47

2 Answers2

1

Took a little bit of trial and error but this is what I have found to change the label part of ion-input in ionic7:

css:

::ng-deep ion-input .label-text{
    color: orange;
}
Levy4u
  • 51
  • 8
0
    <ion-item>
        <ion-input labelPlacement="stacked" value="hi@ionic.io">
          <div slot="label"> <ion-text color="danger"> Email (Required)</ion-text></div>
        </ion-input>
   </ion-item>
Ravi Ashara
  • 1,177
  • 7
  • 16