I am using Cordova to make an android app and I have a text field where the user types into. Im using a keyboard function so I can listen for the done key on a text field. When the event fires I want to be able to "animate" the text that was just entered into the field. I don't necessarily want to animate it, but really just put a circular box around the text so that its clear the input has been accepted.
For example:
This is what it looks like after they've typed their text and before they've pressed done on the keyboard.
When the event fires I want to style the text as such where the font weight changes and the background of the text gets bubbled. Is this possible?
In the function that you're using to listen for the done key, you can use Element.classList.add() to add a class to the <input type="text"> element.
const inputElement = document.getElementById('your-input-element')
inputElement.classList.add('recipent-submitted')
Then apply whatever styling you want to .recipent-submitted in your CSS file.