const form = document.getElementById("myForm");
const userName = document.getElementById("input");
const passWord = document.getElementById("password");
const msg = document.getElementById("msg");
const nanny = document.getElementById("nanny");
const info = document.getElementById("info");

form.addEventListener("submit", function (event) {
    event.preventDefault();

    let userNameValue = userName.value;
    let passWordValue = passWord.value;


    msg.textContent = "";
    nanny.textContent = "";
    info.textContent = "";

    let isValid = true;

    if (userNameValue === "" || passWordValue === "") {
        msg.textContent = "Please Fill The Form";
        msg.style.color = "red";
        return;
    }

    if (userNameValue.length < 8) {
        nanny.textContent = "Username must be at least 8 characters";
        nanny.style.color = "red";
        isValid = false;
    }

    if (passWordValue.length < 8) {
        info.textContent = "Password must be at least 8 characters";
        info.style.color = "red";
        isValid = false;
    }

   if (isValid) {
    localStorage.setItem("username", userNameValue);
    localStorage.setItem("password", passWordValue);

    msg.textContent = "Login Successful";
    msg.style.color = "lightgreen";

    form.reset();
}
});











