<!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="utf-8"/>
            <meta name="viewport" content="width=device-width, initial-scale=1"/>
            <title>SatuRSSA | Log in</title>
            
            <!-- Google Font: Source Sans Pro -->
            <!--link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback"-->
            <!-- Font Awesome -->
            <link rel="stylesheet" href="<?php echo base_url();?>theme/AdminLTE3/plugins/fontawesome-free/css/all.min.css"/>
            <!-- icheck bootstrap -->
            <link rel="stylesheet" href="<?php echo base_url();?>theme/AdminLTE3/plugins/icheck-bootstrap/icheck-bootstrap.min.css"/>
            <!-- Theme style -->
            <link rel="stylesheet" href="<?php echo base_url();?>theme/AdminLTE3/dist/css/adminlte.min.css"/>
        </head>
        <body class="hold-transition login-page">
            <div class="login-box">
                <div class="login-logo">
                    <a><b>Satu</b>RSSA</a>
                </div>
                <div class="card">
                    <div class="card-body login-card-body">
                        <p class="login-box-msg">Masukan Nama User & Password</p>
                        <p><?php echo $error?></p>
                        <script> 
                            setTimeout(function() {
                                $('#alert').hide('fast');
                            }, 3000);
                        </script>
                        <form action="<?php echo base_url();?>index.php/ps_login/process" name="process" method="post" autocomplete="off">
                            <div class="input-group mb-3">
                                <input id="username" name="username" type="text" class="form-control" placeholder="Username"/>
                                <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 id="password" name="password" type="password" class="form-control" placeholder="Password"/>
                                <div class="input-group-append">
                                    <div class="input-group-text">
                                        <span class="fas fa-lock"></span>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-6">
                                    <button type="submit" class="btn btn-info btn-block">Sign In</button>
                                </div>
                                <div class="col-6">
                                    <a href="https://auth.rssa.top/realms/rssa/protocol" class="btn btn-warning btn-block">Keycloak</a>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        <!-- jQuery -->
        <script src="<?php echo base_url();?>theme/AdminLTE3/plugins/jquery/jquery.min.js"></script>
        <!-- Bootstrap 4 -->
        <script src="<?php echo base_url();?>theme/AdminLTE3/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
        <!-- AdminLTE App -->
        <script src="<?php echo base_url();?>theme/AdminLTE3/dist/js/adminlte.min.js"></script>
        </body>
    </html>
