Enes Eken• 540
@eneseken
Posted
You should add some styles for setting input valid or invalid
Utils css
.text-danger{ color: red }
.border-danger{ border: 1px solid red }
.d-none{display:none}
<p class="valid-email-text d-none">Valid email required</p>
<input id="email" class="border-1 p-3 rounded" type="email" required placeholder="[email protected]"
oninvalid="
this.classList.add('text-danger', 'border-danger');
document.querySelector('.valid-email-text').classList.remove('d-none');"
oninput="
this.classList.remove('text-danger', 'border-danger');
document.querySelector('.valid-email-text').classList.add('d-none');"
/>
Give me a star please :(
https://github.com/eneseken/front-end-mentor/tree/main/newsletter-sign-up-with-success-message-main
0
