Topic: How to change input color on mdb-input value when filled and in focus
** Problem **
I want to change the default color of the username and password when I fill something in. The labels are fine (white as defined), but the value entered are still not changing.
Expected behavior
Using the code below should change the default color of the input to use the white color (When in focus and not in focus)
Actual behavior
The username entered is still dark-grey (default color define for .form-control). and it is not overwriting the form-control class color.
Resources (screenshots, code snippets etc.)
<mdb-input
id="username_id"
v-model="username"
label="Username"
labelColor="white"
icon="user"
iconClass="my-icon-class"
required
/>
#username_id {
color: white;
}
#username_id:focus {
color: white;
}
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Free
- Premium support: No
- Technology: MDB Vue
- MDB Version: 6.5.0
- Device: Laptop
- Browser: Chrome
- OS: WIndows 10
- Provided sample code: No
- Provided link: No
Magdalena Dembna staff premium commented 4 years ago
I've recreated your issue - the problem is probably
scopedattribute on the style tags. Create another one without and place you styling there. Let me know if it's working. Best regards, MagdalenaJSONROY commented 4 years ago
That was the problem! Thank you.