69 lines
3.6 KiB
HTML
69 lines
3.6 KiB
HTML
{% extends "base.html" %}
|
|
{% load static %}
|
|
|
|
{% block content %}
|
|
<div class="row justify-content-center align-items-center" style="min-height: 70vh;">
|
|
<div class="col-md-5 col-lg-4">
|
|
<div class="card glass-card border-0 shadow-lg p-2">
|
|
<div class="card-body p-4 p-md-5">
|
|
<div class="text-center mb-5">
|
|
<div class="bg-primary text-white rounded-4 d-inline-flex align-items-center justify-content-center mb-3" style="width: 64px; height: 64px; box-shadow: 0 10px 20px rgba(67, 97, 238, 0.3);">
|
|
<i data-lucide="shield-check" size="32"></i>
|
|
</div>
|
|
<h2 class="fw-bold text-dark">{{ project_name|default:"DN-WRS" }}</h2>
|
|
<p class="text-muted small">Masukkan kredensial Anda untuk mengakses portal</p>
|
|
</div>
|
|
|
|
{% if form.errors %}
|
|
<div class="alert alert-danger border-0 small py-3 rounded-4 d-flex align-items-center mb-4">
|
|
<i data-lucide="alert-circle" class="me-2" size="18"></i>
|
|
<span>Username atau password salah.</span>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<form method="post" action="{% url 'login' %}">
|
|
{% csrf_token %}
|
|
<div class="mb-3">
|
|
<label for="id_username" class="form-label small fw-bold text-uppercase opacity-50">Username</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text bg-light border-light rounded-start-3">
|
|
<i data-lucide="user" size="18" class="text-muted"></i>
|
|
</span>
|
|
<input type="text" name="username" autofocus maxlength="150" required id="id_username" class="form-control rounded-end-3 py-2 border-light bg-light">
|
|
</div>
|
|
</div>
|
|
<div class="mb-4">
|
|
<label for="id_password" class="form-label small fw-bold text-uppercase opacity-50">Password</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text bg-light border-light rounded-start-3">
|
|
<i data-lucide="lock" size="18" class="text-muted"></i>
|
|
</span>
|
|
<input type="password" name="password" required id="id_password" class="form-control rounded-end-3 py-2 border-light bg-light">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="d-grid pt-2">
|
|
<button type="submit" class="btn btn-primary py-3 rounded-3 d-flex align-items-center justify-content-center">
|
|
<span>Masuk</span>
|
|
<i data-lucide="arrow-right" class="ms-2" size="18"></i>
|
|
</button>
|
|
</div>
|
|
|
|
<input type="hidden" name="next" value="{{ next }}">
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<div class="text-center mt-4 opacity-50">
|
|
<small>Diproteksi oleh DN-Security</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
body {
|
|
background: radial-gradient(circle at 0% 0%, rgba(67, 97, 238, 0.05) 0%, transparent 50%),
|
|
radial-gradient(circle at 100% 100%, rgba(114, 9, 183, 0.05) 0%, transparent 50%),
|
|
linear-gradient(135deg, #f6f8fd 0%, #f1f4f9 100%);
|
|
}
|
|
</style>
|
|
{% endblock %} |