{% load static %}
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400&display=swap" rel="stylesheet">
<link rel="stylesheet" href="{% static 'assets/fonts/icomoon/style.css' %}">
<link rel="stylesheet" href="{% static 'assets/css/owl.carousel.min.css' %}">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="{% static 'assets/css/bootstrap.min.css' %}">
<!-- Style -->
<link rel="stylesheet" href="{% static 'assets/css/style.css' %}">
<title>Hiring App : Sign In</title>
<style>
.nav-text{
padding: 0px 10px 0 10px;
font-weight: bold;
text-align: center;
font-size: 1.5rem;
color: rgb(77,66,255);
}
@media screen and (max-width: 450px) {
.nav-text{
font-size: 1.2rem;
}
}
#notification-bar {
font-size: large;
font-weight: bolder;
position: fixed;
top: 0;
left: 0;
width: 100%;
color: #fff;
padding: 20px;
text-align: center;
z-index: 9999;
}
.hidden {
display: none;
}
.success {
background-color: #4caf50;
}
.error {
background-color: #f44336;
}
nav{
font-family: "Montserrat", sans-serif;
display: flex;
justify-content: space-around;
align-items: center;
padding:20px ;
position: fixed;
top: 0;
width: 100%;
z-index: 99;
transition: 0.35s;
box-shadow: 0 1px 10px 0px rgba(0, 0, 0, .2);
background-color:white;
transition: 0.5s;
}
.logo{
display: flex;
justify-content: center;
align-items: center;
}
.logo img {
max-width: 50px;
}
.logo-text{
font-weight: bold;
font-size: 20px;
margin-left: 20px;
color: rgb(0, 0, 113);
}
.footer{
padding: 15px;
text-align: center;
border-top: 1px solid rgba(0, 0, 0, 0.162);
background-color: rgb(230 228 228 / 40%);
}
@media screen and (max-width: 500px) {
.logo img {
max-width: 35px;
}
.footer{
font-size: small;
}
nav{
padding: 15px;
}
}
</style>
</head>
<body>
<div id="notification-bar" class="hidden"></div>
<nav>
<a href="/login.html">
<div class="logo">
<div>
<img
class="nitLogo"
src="{% static 'assets/images/bamuLogoNew.png' %}"
alt="Logo"
/>
</div>
<div class="logo-text">B.A.M.U</div>
</div>
</a>
</nav>
<div class="content">
<h1 class="nav-text text-center">Apply for the post of Vice-Chancellor</h1>
<div class="container">
<div class="row">
<div class="col-md-6">
<img src="{% static 'assets/images/undraw_file_sync_ot38.svg' %}" alt="Image" class="img-fluid">
</div>
<div class="col-md-6 contents">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="mb-4">
<h3>Sign In</h3>
<p class="mb-3">Dr. Babasaheb Ambedkar Marathwada University
</p>
<h6 class="card-category">
{% if msg %}
<span class="text-danger">{{ msg | safe }}</span>
{% endif %}
</h6>
</div>
{% if success %}
<div class="card-footer text-center">
<a href="{% url 'login' %}"
class="btn btn-block btn-primary">Login</a>
</div>
{% else %}
<form role="form" method="post" action="{% url 'registeruser' %}">
{% csrf_token %}
<div class="form-group first">
<input type="email" class="form-control" id="email" name="email" placeholder="Email">
</div>
<div class="form-group">
<input type="text" class="form-control" id="password1" name="password1" placeholder="Password">
</div>
<div class="form-group last mb-4">
<input type="password" class="form-control" id="password2" name="password2" placeholder="Confirm Password">
</div>
<input type="submit" name="register" value="Sign In" class="btn btn-block btn-primary">
<div class="d-flex my-3 mb-5 align-items-center">
<span class="text-center">
Have an account? <a href="{% url 'login' %}" class="text-primary">Login</a>
</span>
</div>
</form>
{% endif %}
</div>
</div>
</div>
</div>
</div>
</div>
<footer id="footer" class="footer">
<div class="copyright-text">Created by <strong>Accretion Devs</strong> © <span id="current-year"></span> All rights reserved!</div>
</footer><!-- End Footer -->
<script>
const currentYear = new Date().getFullYear();
document.getElementById("current-year").textContent = currentYear;
document.addEventListener("DOMContentLoaded", function () {
const notificationBar = document.getElementById("notification-bar");
function showNotification(status, message) {
notificationBar.textContent = message;
notificationBar.classList.add(status);
notificationBar.classList.remove("hidden");
setTimeout(function () {
hideNotification();
}, 3000);
}
function hideNotification() {
notificationBar.textContent = "";
notificationBar.classList.remove("success", "error");
notificationBar.classList.add("hidden");
}
const successMessage = "{{ success_message }}";
const errorMessage = "{{ error_message }}";
if (successMessage.trim() !== "") {
showNotification("success", successMessage.trim());
}
if (errorMessage.trim() !== "") {
showNotification("error", errorMessage.trim());
}
});
</script>
<script src="{% static 'assets/js/jquery-3.3.1.min.js' %}"></script>
<script src="{% static 'assets/js/popper.min.js' %}"></script>
<script src="{% static 'assets/js/bootstrap.min.js' %}"></script>
<script src="{% static 'assets/js/main.js' %}"></script>
</body>
</html>