333 lines
12 KiB
PHP
333 lines
12 KiB
PHP
{{-- <!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>Log In | Hyper - Responsive Bootstrap 5 Admin Dashboard</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta content="A fully featured admin theme which can be used to build CRM, CMS, etc." name="description" />
|
|
<meta content="Coderthemes" name="author" />
|
|
<!-- App favicon -->
|
|
<link rel="shortcut icon" href="assets/images/favicon.ico">
|
|
|
|
<!-- App css -->
|
|
<link href="assets/css/icons.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="assets/css/app.min.css" rel="stylesheet" type="text/css" id="light-style" />
|
|
<link href="assets/css/app-dark.min.css" rel="stylesheet" type="text/css" id="dark-style" />
|
|
|
|
</head>
|
|
|
|
<body class="loading authentication-bg"
|
|
data-layout-config='{"leftSideBarTheme":"dark","layoutBoxed":false, "leftSidebarCondensed":false, "leftSidebarScrollable":false,"darkMode":false, "showRightSidebarOnStart": true}'>
|
|
<div class="account-pages pt-2 pt-sm-5 pb-4 pb-sm-5">
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-xxl-4 col-lg-5">
|
|
<div class="card">
|
|
|
|
<!-- Logo -->
|
|
<div class="card-header pt-4 pb-4 text-center bg-primary">
|
|
<a href="index.html">
|
|
<span><img src="assets/images/logo.png" alt="" height="18"></span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="card-body p-4">
|
|
|
|
<div class="text-center w-75 m-auto">
|
|
<h4 class="text-dark-50 text-center pb-0 fw-bold">Sign In</h4>
|
|
<p class="text-muted mb-4">Enter your email address and password to access admin panel.
|
|
</p>
|
|
</div>
|
|
|
|
<form action="/login" method="POST">
|
|
@csrf
|
|
@if (session()->has('errorLogin'))
|
|
<div class="alert alert-danger" role="alert">
|
|
{{ session('errorLogin') }}
|
|
</div>
|
|
@endif
|
|
<div class="mb-3">
|
|
<label for="emailaddress" class="form-label">Email address</label>
|
|
<input class="form-control" type="email" name="email" required=""
|
|
placeholder="Enter your email">
|
|
</div>
|
|
|
|
|
|
<label for="password" class="form-label">Password</label>
|
|
<div class="input-group input-group-merge">
|
|
<input type="password" name="password" class="form-control"
|
|
placeholder="Enter your password">
|
|
<div class="input-group-text" data-password="false">
|
|
<span class="password-eye"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-3 mb-0 text-center">
|
|
<button class="btn btn-primary" type="submit"> Log In </button>
|
|
</div>
|
|
|
|
</form>
|
|
</div> <!-- end card-body -->
|
|
</div>
|
|
<!-- end card -->
|
|
|
|
<div class="row mt-3">
|
|
<div class="col-12 text-center">
|
|
<p class="text-muted">Don't have an account? <a href="pages-register.html"
|
|
class="text-muted ms-1"><b>Sign Up</b></a></p>
|
|
</div> <!-- end col -->
|
|
</div>
|
|
<!-- end row -->
|
|
|
|
</div> <!-- end col -->
|
|
</div>
|
|
<!-- end row -->
|
|
</div>
|
|
<!-- end container -->
|
|
</div>
|
|
<!-- end page -->
|
|
|
|
<footer class="footer footer-alt">
|
|
2018 - 2021 © Hyper - Coderthemes.com
|
|
</footer>
|
|
|
|
<!-- bundle -->
|
|
<script src="assets/js/vendor.min.js"></script>
|
|
<script src="assets/js/app.min.js"></script>
|
|
|
|
</body>
|
|
|
|
</html> --}}
|
|
|
|
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<title>KEMENDESA | PELAYANAN PELATIHAN</title>
|
|
<link href="assets-login-landing/img/Kemendes_Logo.png" rel="icon">
|
|
|
|
<!-- Favicons -->
|
|
{{-- <link rel="stylesheet" type="text/css" href="assets-login/css/style.css"> --}}
|
|
|
|
<!-- Google Fonts -->
|
|
<link
|
|
href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Poppins:300,300i,400,400i,600,600i,700,700i"
|
|
rel="stylesheet">
|
|
<script src="https://kit.fontawesome.com/a81368914c.js"></script>
|
|
|
|
<!-- Template Main CSS File -->
|
|
{{-- <link href="assets-login-landing/css/style.css" rel="stylesheet"> --}}
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<style>
|
|
/* BASIC */
|
|
.bg-img {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
object-fit: cover;
|
|
width: 100%;
|
|
height: 100%;
|
|
position: absolute;
|
|
}
|
|
|
|
.wrapper {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
}
|
|
|
|
|
|
.icon {
|
|
width: 30%;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.title {
|
|
color: #1D2732;
|
|
text-align: center;
|
|
font-size: 1.3rem;
|
|
font-style: normal;
|
|
font-weight: 600;
|
|
line-height: normal;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.text {
|
|
margin-top: .5rem;
|
|
color: #1D2732;
|
|
font-size: .6rem;
|
|
font-style: normal;
|
|
font-weight: 500;
|
|
line-height: normal;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.footer {
|
|
color: #1D2732;
|
|
font-size: 0.6rem;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: normal;
|
|
padding: 0;
|
|
margin: 75px 0 0 0;
|
|
}
|
|
|
|
.login-card {
|
|
-webkit-border-radius: 10px 10px 10px 10px;
|
|
border-radius: 10px 10px 10px 10px;
|
|
background: #fff;
|
|
padding: 75px 35px 30px 35px;
|
|
width: 90%;
|
|
max-width: 340px;
|
|
position: relative;
|
|
-webkit-box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.3);
|
|
box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.3);
|
|
text-align: center;
|
|
margin: 0;
|
|
}
|
|
|
|
.card-body {
|
|
padding: 0;
|
|
}
|
|
|
|
.input-login {
|
|
width: 100%;
|
|
height: 40px;
|
|
border-radius: .5rem;
|
|
border: none;
|
|
background: #F8F8F8;
|
|
}
|
|
|
|
.btn-login {
|
|
width: 100%;
|
|
height: 40px;
|
|
border-radius: .5rem;
|
|
background: #009C98;
|
|
box-shadow: -2px 4px 4px 0px rgba(0, 0, 0, 0.10);
|
|
padding: 0;
|
|
font-weight: 600;
|
|
font-size: 11px;
|
|
transition: transform 0.3s ease;
|
|
}
|
|
|
|
.btn-login:hover {
|
|
transform: translateY(-5px);
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
{{-- <div class="login">
|
|
<div class="container">
|
|
<div class="img">
|
|
<img src="assets-login-landing/img/login.svg" class="img-fluid animated" id="moving-login-img">
|
|
</div>
|
|
<div class="login-content">
|
|
<form action="/login" method="POST">
|
|
@csrf
|
|
@if (session()->has('errorLogin'))
|
|
<div class="alert alert-danger" role="alert">
|
|
{{ session('errorLogin') }}
|
|
</div>
|
|
@endif
|
|
<h1 class="title">Selamat Datang!</h1>
|
|
<p>Silahkan Masukan Email dan Password Anda</p>
|
|
<div class="input-div one">
|
|
<div class="i">
|
|
<i class="fas fa-user"></i>
|
|
</div>
|
|
<div class="div">
|
|
<h5>Email</h5>
|
|
<input type="email" class="input" name="email">
|
|
</div>
|
|
</div>
|
|
<div class="input-div pass">
|
|
<div class="i">
|
|
<i class="fas fa-lock"></i>
|
|
</div>
|
|
<div class="div">
|
|
<h5>Password</h5>
|
|
<input type="password" class="input" name="password">
|
|
</div>
|
|
</div>
|
|
<input type="submit" class="btn" value="Login" style="color: #fff;">
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
const inputs = document.querySelectorAll(".input");
|
|
|
|
function addcl() {
|
|
let parent = this.parentNode.parentNode;
|
|
parent.classList.add("focus");
|
|
}
|
|
|
|
function remcl() {
|
|
let parent = this.parentNode.parentNode;
|
|
if (this.value == "") {
|
|
parent.classList.remove("focus");
|
|
}
|
|
}
|
|
inputs.forEach(input => {
|
|
input.addEventListener("focus", addcl);
|
|
input.addEventListener("blur", remcl);
|
|
});
|
|
</script> --}}
|
|
<img class="bg-img" src="assets/img/bg-login.png" alt="">
|
|
<div class="wrapper">
|
|
<!-- <div class="card login-card p-2" id="formContent"> -->
|
|
<div class="card login-card" id="formContent">
|
|
<!-- <img class="card-img-top icon" src="assets/img/logo-green.png" alt="login logo"> -->
|
|
<img class="icon" src="assets/img/logo-green.png" alt="login logo">
|
|
<div>
|
|
<p class="title">Selamat Datang</p>
|
|
<p class="text">Lakukan login terlebih dahulu untuk memulai.</p>
|
|
</div>
|
|
<div class="card-body">
|
|
|
|
<form #loginForm="ngForm" (ngSubmit)="submit(loginForm)" novalidate autocomplete="off">
|
|
<div class="row">
|
|
<div class="col">
|
|
<div class="form-group">
|
|
<!-- <input type="text" ngModel placeholder="username" name="username" class="form-control" autocomplete="new-username" required/> -->
|
|
<input type="text" ngModel placeholder="username" name="username"
|
|
class="form-control input-login" autocomplete="new-username" required />
|
|
</div>
|
|
<error-messages [hidden]="!loginForm.controls?.username?.touched && !loginForm.submitted"
|
|
[data]="loginForm.controls?.username?.errors"></error-messages>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col">
|
|
<div class="form-group">
|
|
<!-- <input type="password" ngModel placeholder="password" name="password" class="form-control" autocomplete="new-password" required /> -->
|
|
<input type="password" ngModel placeholder="password" name="password"
|
|
class="form-control input-login" autocomplete="new-password" required />
|
|
</div>
|
|
<error-messages [hidden]="!loginForm.controls?.password?.touched && !loginForm.submitted"
|
|
[data]="loginForm.controls?.password?.errors"></error-messages>
|
|
</div>
|
|
</div>
|
|
<!-- <input type="submit" class="btn btn-info btn-lg btn-block" value="Log In"> -->
|
|
<input type="submit" class="btn btn-info btn-lg btn-block btn-login" value="Log In">
|
|
</form>
|
|
|
|
<div>
|
|
<!-- <a class="">Forgot Password?</a> -->
|
|
</div>
|
|
</div>
|
|
<p class="footer">Daily Report Pendamping</p>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|