<!DOCTYPE html>
<html lang="id">

<head>

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>SIMPAS | Login</title>

<link rel="icon" href="assets/logo/logo.png">

<link rel="stylesheet" href="assets/plugins/fontawesome-free/css/all.min.css">
<link rel="stylesheet" href="assets/dist/css/adminlte.min.css">

<link rel="stylesheet" href="assets/css/login.css">

</head>

<body class="hold-transition login-page">

<div class="login-box">

    <div class="card">

        <div class="card-body login-card-body">

            <div class="text-center">

                <img src="assets/logo/logo.png"
                     class="logo-sekolah"
                     alt="Logo">

                <h2 class="judul">
                    SIMPAS
                </h2>

                <p class="subjudul">

                    Sistem Informasi Presensi dan Absensi Siswa

                </p>

                <strong>

                    SMP Negeri 2 Teluk Kuantan

                </strong>

            </div>

            <hr>

            <form action="cek_login.php" method="POST">

                <div class="input-group mb-3">

                    <input
                    type="text"
                    name="username"
                    class="form-control"
                    placeholder="Username"
                    required>

                    <div class="input-group-append">

                        <div class="input-group-text">

                            <span class="fas fa-user"></span>

                        </div>

                    </div>

                </div>

                <div class="input-group mb-3">

                    <input
                    type="password"
                    name="password"
                    id="password"
                    class="form-control"
                    placeholder="Password"
                    required>

                    <div class="input-group-append">

                        <div
                        class="input-group-text"
                        onclick="showPassword()"
                        style="cursor:pointer;">

                            <span
                            id="eye"
                            class="fas fa-eye"></span>

                        </div>

                    </div>

                </div>

                <button
                type="submit"
                class="btn btn-primary btn-block tombol-login">

                    <i class="fas fa-sign-in-alt"></i>

                    MASUK

                </button>

            </form>

            <div class="footer-login">

                Tahun Ajaran 2026/2027

                <br>

                Versi 1.0

                <br>

                © SMP Negeri 2 Teluk Kuantan

            </div>

        </div>

    </div>

</div>

<script>

function showPassword(){

let x=document.getElementById("password");
let eye=document.getElementById("eye");

if(x.type==="password"){

x.type="text";

eye.classList.remove("fa-eye");

eye.classList.add("fa-eye-slash");

}else{

x.type="password";

eye.classList.remove("fa-eye-slash");

eye.classList.add("fa-eye");

}

}

</script>

<script src="assets/plugins/jquery/jquery.min.js"></script>

<script src="assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>

<script src="assets/dist/js/adminlte.min.js"></script>

</body>

</html>