<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Klinik Mobil | Aplikasi Bengkel Mobil</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <!-- Font Awesome -->
  <link rel="stylesheet" href="<?= base_url() ?>/assets/plugins/fontawesome-free/css/all.min.css">
  <!-- icheck bootstrap -->
  <link rel="stylesheet" href="<?= base_url() ?>/assets/plugins/icheck-bootstrap/icheck-bootstrap.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="<?= base_url() ?>/assets/dist/css/adminlte.min.css">
  <!-- Google Font: Source Sans Pro -->

</head>

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

  <div class="login-box ">
    <div class="login-logo">
      <b>Klinik Mobil App</b> <i class="text-sm">V.1.0.1</i>
    </div>
    <!-- /.login-logo -->
    <div class="card shadow">
      <div class="info-box-content m-3 ">
        <p class="login-box-msg text-black-50 font-weight-bold">Akses Login</p>
        <form action="<?= site_url('auth/proses') ?>" method="post">
          <div class="input-group mb-3">
            <input name='username' type="text" class="form-control" placeholder="username" required>
            <div class="input-group-append">
              <div class="input-group-text">
                <span class="fas fa-user">&nbsp;</span>
              </div>
            </div>
          </div>
          <div class="input-group mb-3">
            <input id="pass" name="password" type="password" class="form-control" placeholder="Password" required>
            <div class="input-group-append">
              <div class="input-group-text">
                <span id="mybutton" onclick="change()"><i class="fas fa-eye-slash"></i></span>
              </div>
            </div>
          </div>
          <div class="row">

            <div class="col-12">
              <button name="login" type="submit" class="btn btn-secondary btn-block">Login</button>
            </div>
            <!-- /.col -->
          </div>
        </form>

      </div>

    </div>
    <p class="login-box-msg">

      <strong>Support by <a class="text-warning" href=".">riaucreativeID</a> </strong> <strong>- All rights reserved</strong>

    </p>

    <!-- /.login-box -->

    <!-- jQuery -->
    <script src="<?= base_url() ?>/assets/plugins/jquery/jquery.min.js"></script>
    <!-- Bootstrap 4 -->
    <script src="<?= base_url() ?>/assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
    <!-- AdminLTE App -->
    <script src="<?= base_url() ?>/assets/dist/js/adminlte.min.js"></script>


    <script>
      function change() {
        var x = document.getElementById('pass').type;

        if (x == 'password') {
          document.getElementById('pass').type = 'text';
          document.getElementById('mybutton').innerHTML = '<i class="fas fa-eye"></i>';
        } else {
          document.getElementById('pass').type = 'password';
          document.getElementById('mybutton').innerHTML = '<i class="fas fa-eye-slash"></i>';
        }
      }
    </script>






</body>

</html>