JezK

Edit File: owner_login.php

<!DOCTYPE html>
<html lang="en" class="h-100">

<head>
    <title>Uflexit</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    
    <link rel="icon" href="images/fav.png" type="image/gif" sizes="16x16">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/login1.css">
    <script src="js/jquery.min.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/validations.js"></script>
</head>

<div class="col-md-6 h-100 bg-white mt-5">
                <div class="justify-content-center h-100">
                    <div class="row d-flex justify-content-center">
                        <div class="">
                            <p class="text-center text-clr-blue">Login</p>
                        </div>
                    </div>

<div class="tab-content">

<div class="container tab-pane active"><br>
                            <form class="form" action="app/login.php" method="post">
                                <div class="log-body">
                                    <div class="row h-100">
                                        <div class="col-md-12 mb-4 ">
                                            <label for="inputEmail" class="inpt-label">Email</label>
                                            <div class="input-container">
                                                <input type="email" id="email" name="email" value=""
                                                    class="form-control frm-input" placeholder="name@domain.com"
                                                    autofocus="">
                                            </div>
                                            <div class="error email_error"></div>
                                        </div>

<div class="col-md-12 mb-1 ">
                                            <label for="inputEmail" class="inpt-label">Password</label>
                                            <div class="input-container">
                                                <input type="password" id="password" name="password" value=""
                                                    class="form-control frm-input"
                                                    placeholder="&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;">

<div class="col-md-12 text-right mb-4 ">
                                            <a href="forgetpassword.php" class="forgot-txt">Forgot Password?</a>
                                        </div>

<div class="col-md-12 mb-4 ">
                                            <p class="acct-txt">Don't have an account? &nbsp;&nbsp; <span><a
                                                        href="owner_registration.php"
                                                        class="register-btn">Register</a></span></p>
                                        </div>

</div>
                                </div>
                            </form>
                        </div>

</div>

</div>
                
            </div>
        </div>
    </div>
</body>

</html>

// togglePassword.addEventListener('click', function (e) {
//     // toggle the type attribute
//     const type = password.getAttribute('type') === 'password' ? 'text' : 'password';
//     password.setAttribute('type', type);
//     // toggle the eye slash icon
//     this.classList.toggle('fa-eye-slash');
// });
$(document).on('click', '#togglePassword', function() {

$(this).toggleClass("fa-eye fa-eye-slash");

var input = $("#password");
    input.attr('type') === 'password' ? input.attr('type', 'text') : input.attr('type', 'password')
});
</script>