56 lines
2.0 KiB
HTML
56 lines
2.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Login</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body class="body-login">
|
|
<div class="login-container">
|
|
<div class="logo">Login</div>
|
|
<form class="login-form">
|
|
<input type="text" id="username" placeholder="Username" />
|
|
<input type="password" id="password" placeholder="Password" />
|
|
<input type="submit" value="Login" />
|
|
</form>
|
|
</div>
|
|
<div class="notification">
|
|
<div class="bubble"></div>
|
|
<p>Login berhasil!</p>
|
|
</div>
|
|
|
|
<script>
|
|
const usernameInput = document.getElementById('username');
|
|
const passwordInput = document.getElementById('password');
|
|
const loginForm = document.querySelector('.login-form');
|
|
const notification = document.querySelector('.notification');
|
|
|
|
loginForm.addEventListener('submit', (e) => {
|
|
e.preventDefault();
|
|
const username = usernameInput.value;
|
|
const password = passwordInput.value;
|
|
|
|
if ((username === 'admin1' && password === 'admin1') ||
|
|
(username === 'user' && password === 'user') ||
|
|
(username === 'admin2' && password === 'admin2')) {
|
|
|
|
notification.classList.add('show');
|
|
setTimeout(() => {
|
|
notification.classList.remove('show');
|
|
if (username === 'admin1') {
|
|
window.location.href = 'admin.php';
|
|
} else if (username === 'user') {
|
|
window.location.href = 'user.php';
|
|
} else if (username === 'admin2') {
|
|
window.location.href = 'admin2.php';
|
|
}
|
|
}, 2000);
|
|
} else {
|
|
alert('Username atau password salah!');
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|