Change form label color when in focus/active

MDB SupportCategory: MDB jQueryChange form label color when in focus/active
bobdempsey83 Pro User asked 4 months ago in MDB pro, version:4.5.0

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! 🙂

2 Answers
Marta Szymanska answered 4 months ago

Hi,

try this code:

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

Best,

Marta

bobdempsey83 Pro User replied 3 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!

Marta Szymanska answered 3 months ago

Hi,

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

Best,

Marta

Marta Szymanska replied 3 months ago

You’re welcome.

bobdempsey83 Pro User replied 3 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 replied 3 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 Pro User replied 3 months ago

Ok thanks very much!