Change form label color when in focus/active

bobdempsey83 asked 7 months ago

Hey everyone, I have an md-form that I'd like to change the color of an input label when the cursor enters it. I've tried input:active & input:focus to change color, but it's not working for me.

Any suggestions?

Thanks! 🙂


Hi,

try this code:

.md-form input[type=text]:focus:not([readonly]) + label { color: #CC0000; }

Best,

Marta


bobdempsey83 commented 7 months ago

Hey thanks so much Maria.

That code worked for my name & email inputs, but not the textarea.

Do you have anything that will work for the textarea?

Thanks!


Hi,

I don't have a solution for textarea now. In MDB, we don't change label color of textarea on active.

Best,

Marta


bobdempsey83 commented 7 months ago

Ok thanks very much!


Marta Szymanska commented 7 months ago

I've just got the idea for textarea label. You need to add a new class to .md-form wrapper of textarea. Try this:
.primary-textarea.md-form label.active {
color: #4285F4;
}


bobdempsey83 commented 6 months ago

Hey here's the working example:

Change form color & label on focus
.navy-blue-skin textarea.md-textarea:focus:not([readonly])+label

Change input color on focus:
.navy-blue-skin textarea.md-textarea:focus:not([readonly])

Thanks again for the help! :)


Marta Szymanska commented 6 months ago

You're welcome.


Please insert min. 20 characters.
Status

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No