<?php
ob_start();
include('../include/db_conx.php') ?>

<!doctype html>
<html lang="en">


<head>

    <meta charset="utf-8" />
    <title>Login | <?php echo $sitename ?> Admin </title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- App favicon -->
    <link rel="shortcut icon" href="../images/favicon.png">


    <!-- preloader css -->
    <link rel="stylesheet" href="assets/css/preloader.min.css" type="text/css" />

    <!-- Bootstrap Css -->
    <link href="assets/css/bootstrap.min.css" id="bootstrap-style" rel="stylesheet" type="text/css" />
    <!-- Icons Css -->
    <link href="assets/css/icons.min.css" rel="stylesheet" type="text/css" />
    <!-- App Css-->
    <link href="assets/css/app.min.css" id="app-style" rel="stylesheet" type="text/css" />

</head>

<style>
    @import url("https://fonts.googleapis.com/css2?family=Audiowide&display=swap");



    .new_font {
        font-family: "Audiowide", cursive;
    }

    p {
        margin: auto;
    }

    .large {
        font-size: 2rem;
    }

    .small {
        font-size: 3rem;
    }

    .rise {
        text-shadow: -0.01em -0.01em 0.01em #000;
        animation: rise 2s ease-in-out 0.5s forwards;
    }

    @keyframes rise {
        to {
            text-shadow: 0em 0.01em #ff5, 0em 0.02em #ff5, 0em 0.02em 0.03em #ff5,
                -0.01em 0.01em #333, -0.02em 0.02em #333, -0.03em 0.03em #333,
                -0.04em 0.04em #333, -0.01em -0.01em 0.03em #000, -0.02em -0.02em 0.03em #000,
                -0.03em -0.03em 0.03em #000;
            transform: translateY(-0.025em) translateX(0.04em);
        }
    }

    .outline {
        background-clip: text;
        color: #ffdd40;
        animation: outline 1s ease-in-out 1.5s forwards;
    }

    @keyframes outline {
        from {
            text-shadow: 0em -7em 10em #fff;
        }

        to {
            text-shadow: 0 0.02em #fff, 0.02em 0 #fff, -0.02em 0 #fff, 0 -0.02em #fff;
        }
    }
</style>

<body>

    <!-- <body data-layout="horizontal"> -->
    <div class="auth-page">
        <div class="container-fluid p-0">
            <div class="row g-0">
                <div class="col-xxl-5 col-lg-4 col-md-5">
                    <div class="auth-full-page-content d-flex p-sm-5 p-4">
                        <div class="w-100">
                            <div class="d-flex flex-column h-100">
                                <div class=" mb-md-3 text-center">
                                    <a href="../index.php" class="d-block auth-logo">
                                        <p class="large rise new_font"> <?= $sitename ?> </p>
                                    </a>
                                </div>
                                <div class="auth-content my-auto">
                                    <div class="text-center">
                                        <h5 class="mb-0">Welcome Back !</h5>
                                        <p class="text-muted mt-2">Sign in to continue to Admin.</p>
                                    </div>
                                    <form class="mt-4 pt-2" method='POST'>
                                        <div class="mb-3">
                                            <label class="form-label">Email</label>
                                            <input type="text" class="form-control" id="username" placeholder="Enter Email" name='mail'>
                                        </div>
                                        <div class="mb-3">
                                            <div class="d-flex align-items-start">
                                                <div class="flex-grow-1">
                                                    <label class="form-label">Password</label>
                                                </div>
                                                <div class="flex-shrink-0">
                                                    <div class="">
                                                        <a href="#" class="text-muted">Forgot password?</a>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="input-group auth-pass-inputgroup">
                                                <input type="password" class="form-control" placeholder="Enter password" aria-label="Password" aria-describedby="password-addon" name='password'>
                                                <button class="btn btn-light shadow-none ms-0" type="button" id="password-addon"><i class="mdi mdi-eye-outline"></i></button>
                                            </div>
                                        </div>
                                        <div class="row mb-4">
                                            <div class="col">
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" id="remember-check">
                                                    <label class="form-check-label" for="remember-check">
                                                        Remember me
                                                    </label>
                                                </div>
                                            </div>

                                        </div>
                                        <div class="mb-3">
                                            <button class="btn btn-primary w-100 waves-effect waves-light" type="submit" name='submit'>Log In</button>
                                        </div>
                                    </form>

                                    <?php



                                    if (isset($_POST['submit'])) {

                                        //collecting the values for the ajax post method

                                        $mail = $db_conx->real_escape_string($_POST['mail']);

                                        $password = $db_conx->real_escape_string($_POST['password']);

                                        if ($mail == $prince_uname && $password == $prince_pwrd) {

                                            $_SESSION['admin_login'] = $_SERVER['HTTP_USER_AGENT'] . $_SERVER['REMOTE_ADDR'];

                                            header('location: index.php');
                                        } else {



                                            echo '
                                                
                                                    <div class="alert alert-danger" role="alert">
                                                    Invalid Admin Credentials
                                                    </div>

                                                    ';
                                        }
                                    } //end isset

                                    ?>



                                </div>
                                <div class="mt-4 mt-md-5 text-center">
                                    <p class="mb-0">© <script>
                                            document.write(new Date().getFullYear())
                                        </script> <?php echo $sitename ?> . Crafted with <i class="mdi mdi-heart text-danger"></i> </p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- end auth full page content -->
                </div>
                <!-- end col -->
                <div class="col-xxl-7 col-lg-8 col-md-7">
                    <div class="auth-bg pt-md-5 p-4 d-flex">
                        <div class="bg-overlay bg-primary"></div>
                        <ul class="bg-bubbles">
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                        </ul>
                        <!-- end bubble effect -->
                        <div class="row justify-content-center align-items-center">
                            <div class="col-xl-7">
                                <div class="p-0 p-sm-4 px-xl-0">
                                    <div id="reviewcarouselIndicators" class="carousel slide" data-bs-ride="carousel">
                                        <div class="carousel-indicators carousel-indicators-rounded justify-content-start ms-0 mb-0">
                                            <button type="button" data-bs-target="#reviewcarouselIndicators" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
                                            <button type="button" data-bs-target="#reviewcarouselIndicators" data-bs-slide-to="1" aria-label="Slide 2"></button>
                                            <button type="button" data-bs-target="#reviewcarouselIndicators" data-bs-slide-to="2" aria-label="Slide 3"></button>
                                        </div>
                                        <!-- end carouselIndicators -->
                                        <div class="carousel-inner">
                                            <div class="carousel-item active">
                                                <div class="testi-contain text-white">
                                                    <i class="bx bxs-quote-alt-left text-success display-6"></i>

                                                    <h4 class="mt-4 fw-medium lh-base text-white">“This is a restricted Area Please if you dont have authorized details kindly contact the webmaster for details .”
                                                    </h4>

                                                    <div class="mt-4 pt-3 pb-5">
                                                        <div class="d-flex align-items-start">

                                                        </div>
                                                    </div>

                                                </div>
                                            </div>


                                        </div>
                                        <!-- end carousel-inner -->
                                    </div>
                                    <!-- end review carousel -->
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- end col -->
            </div>
            <!-- end row -->
        </div>
        <!-- end container fluid -->
    </div>


    <!-- JAVASCRIPT -->
    <script src="assets/libs/jquery/jquery.min.js"></script>
    <script src="assets/libs/bootstrap/js/bootstrap.bundle.min.js"></script>
    <script src="assets/libs/metismenu/metisMenu.min.js"></script>
    <script src="assets/libs/simplebar/simplebar.min.js"></script>
    <script src="assets/libs/node-waves/waves.min.js"></script>
    <script src="assets/libs/feather-icons/feather.min.js"></script>
    <!-- pace js -->
    <script src="assets/libs/pace-js/pace.min.js"></script>
    <!-- password addon init -->
    <script src="assets/js/pages/pass-addon.init.js"></script>

</body>


</html>

<?php
ob_end_flush();
?>