//@TODO
// Can we make it work with 'label'
// how to init script when dom has changed with new fields?
// on blur if value in field and invalid - make invalid (border red).
// Grab all the inputs (not the submit button).
var inputs = document.querySelectorAll('input:not(.form__submit)');
// For each input.
inputs.forEach( function(input, index) {
// Grab the 'name' attribute value.
var inpAttr = input.getAttribute("name");
// Grab the correct element via the data attribute.
var ph = document.querySelector('[data-input="' + inpAttr + '"]');
// When in focus, remove the class.
input.onfocus = function() {
ph.classList.remove('ph-big');
}
// On blur, if input is empty add the class back on.
input.onblur = function() {
if (this.value === "") {
ph.classList.add('ph-big');
}
};
});