491 lines
26 KiB
XML
491 lines
26 KiB
XML
<?xml version="1.0" encoding="utf-8"?>
|
|
<odoo>
|
|
<!-- Override favicon globally -->
|
|
<template id="custom_favicon" inherit_id="web.layout">
|
|
<xpath expr="//link[@rel='shortcut icon']" position="replace">
|
|
<link type="image/png" rel="shortcut icon" href="/education_dashboard/static/src/img/favicon.png"/>
|
|
</xpath>
|
|
</template>
|
|
|
|
<!-- Custom Login Layout for Odoo Education Portal -->
|
|
<template id="custom_login_layout" inherit_id="web.login_layout" name="Education Portal Custom Login Layout">
|
|
<xpath expr="//div[hasclass('container')]" position="replace">
|
|
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800&display=swap" rel="stylesheet"/>
|
|
<style>
|
|
/* Reset default layout margins and hide default website navbar/footer */
|
|
header, footer, .o_header_standard, .o_footer, .o_frontend_to_backend_nav {
|
|
display: none !important;
|
|
}
|
|
body {
|
|
font-family: 'Nunito', sans-serif !important;
|
|
background-color: #eef9f9 !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
min-height: 100vh;
|
|
}
|
|
#wrapwrap, #wrap, main {
|
|
min-height: 100vh !important;
|
|
display: flex !important;
|
|
flex-direction: column !important;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
width: 100% !important;
|
|
max-width: 100% !important;
|
|
background: transparent !important;
|
|
}
|
|
|
|
/* Full-bleed Split Screen Container */
|
|
.login-split-container {
|
|
display: flex;
|
|
width: 100%;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
/* Left Banner Panel */
|
|
.login-left-panel {
|
|
flex: 1.1;
|
|
position: relative;
|
|
background-image: linear-gradient(135deg, rgba(238, 249, 249, 0.88) 0%, rgba(204, 241, 241, 0.82) 100%), url('/education_portal/static/src/img/campus_login_bg.jpg');
|
|
background-size: cover;
|
|
background-position: center;
|
|
padding: 60px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-around;
|
|
overflow: hidden;
|
|
box-shadow: inset -10px 0 20px rgba(0, 0, 0, 0.02);
|
|
}
|
|
|
|
/* Decorative Ambient Circles */
|
|
.deco-circle-1 {
|
|
position: absolute;
|
|
top: -80px;
|
|
left: -80px;
|
|
width: 320px;
|
|
height: 320px;
|
|
border-radius: 50%;
|
|
background: rgba(31, 143, 143, 0.08);
|
|
pointer-events: none;
|
|
}
|
|
.deco-circle-2 {
|
|
position: absolute;
|
|
bottom: 40px;
|
|
right: -60px;
|
|
width: 280px;
|
|
height: 280px;
|
|
border-radius: 50%;
|
|
background: rgba(31, 143, 143, 0.12);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.left-header-area {
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
.left-campus-logo {
|
|
<!-- max-height: 55px; -->
|
|
width: auto;
|
|
margin-left: -20px;
|
|
<!-- margin-bottom: 24px; -->
|
|
}
|
|
.left-welcome-tag {
|
|
color: #1f8f8f;
|
|
font-weight: 800;
|
|
font-size: 1.15rem;
|
|
letter-spacing: 0.5px;
|
|
margin-bottom: 4px;
|
|
}
|
|
.left-main-title {
|
|
color: #144d4d;
|
|
font-size: 2.6rem;
|
|
font-weight: 800;
|
|
line-height: 1.15;
|
|
margin-bottom: 6px;
|
|
}
|
|
.left-sub-title {
|
|
color: #1f8f8f;
|
|
font-size: 1.2rem;
|
|
font-weight: 700;
|
|
margin-bottom: 20px;
|
|
}
|
|
.left-description-text {
|
|
color: #4a5568;
|
|
font-size: 0.98rem;
|
|
line-height: 1.6;
|
|
max-width: 580px;
|
|
margin-bottom: 16px;
|
|
}
|
|
|
|
/* Feature Highlights Cards */
|
|
.features-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
gap: 16px;
|
|
margin-top: 24px;
|
|
max-width: 620px;
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
.feature-card {
|
|
background: rgba(255, 255, 255, 0.85);
|
|
backdrop-filter: blur(10px);
|
|
border: 1px solid rgba(31, 143, 143, 0.15);
|
|
border-radius: 16px;
|
|
padding: 18px 20px;
|
|
transition: all 0.25s ease;
|
|
box-shadow: 0 4px 15px rgba(31, 143, 143, 0.04);
|
|
}
|
|
.feature-card:hover {
|
|
transform: translateY(-3px);
|
|
background: #ffffff;
|
|
box-shadow: 0 8px 25px rgba(31, 143, 143, 0.1);
|
|
border-color: rgba(31, 143, 143, 0.3);
|
|
}
|
|
.feature-icon-title {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
font-size: 1rem;
|
|
font-weight: 800;
|
|
color: #144d4d;
|
|
margin-bottom: 4px;
|
|
}
|
|
.feature-desc {
|
|
font-size: 0.82rem;
|
|
color: #64748b;
|
|
margin: 0;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
/* Right Login Form Panel */
|
|
.login-right-panel {
|
|
flex: 1;
|
|
background: linear-gradient(135deg, #eef9f9 0%, #e0f2f1 100%);
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 40px 20px;
|
|
position: relative;
|
|
}
|
|
.login-card-box {
|
|
width: 100%;
|
|
max-width: 450px;
|
|
background: #ffffff;
|
|
border-radius: 24px;
|
|
padding: 40px;
|
|
box-shadow: 0 20px 40px rgba(31, 143, 143, 0.08), 0 1px 3px rgba(0, 0, 0, 0.05);
|
|
border: 1px solid rgba(31, 143, 143, 0.12);
|
|
}
|
|
.login-card-title {
|
|
font-size: 2rem;
|
|
font-weight: 800;
|
|
color: #144d4d;
|
|
margin-bottom: 6px;
|
|
text-align: center;
|
|
}
|
|
.login-card-subtitle {
|
|
font-size: 0.92rem;
|
|
color: #718096;
|
|
text-align: center;
|
|
margin-bottom: 28px;
|
|
}
|
|
|
|
/* Input Styles */
|
|
.form-control-custom {
|
|
height: 50px;
|
|
border-radius: 0 12px 12px 0 !important;
|
|
border: 1px solid #cbd5e1 !important;
|
|
font-size: 0.95rem;
|
|
color: #334155;
|
|
padding-left: 14px;
|
|
}
|
|
.form-control-custom:focus {
|
|
border-color: #1f8f8f !important;
|
|
box-shadow: 0 0 0 3px rgba(31, 143, 143, 0.15) !important;
|
|
}
|
|
.input-group-text-custom {
|
|
background: #ffffff !important;
|
|
border: 1px solid #cbd5e1 !important;
|
|
border-right: none !important;
|
|
border-radius: 12px 0 0 12px !important;
|
|
color: #1f8f8f;
|
|
font-size: 1.1rem;
|
|
padding: 0 16px;
|
|
}
|
|
.input-group-text-custom-right {
|
|
background: #ffffff !important;
|
|
border: 1px solid #cbd5e1 !important;
|
|
border-left: none !important;
|
|
border-radius: 0 12px 12px 0 !important;
|
|
color: #94a3b8;
|
|
cursor: pointer;
|
|
padding: 0 16px;
|
|
}
|
|
|
|
/* Button Gradient */
|
|
.btn-login-submit {
|
|
background: linear-gradient(135deg, #1f8f8f 0%, #144d4d 100%) !important;
|
|
color: #ffffff !important;
|
|
font-weight: 800 !important;
|
|
font-size: 1.05rem !important;
|
|
padding: 14px !important;
|
|
border-radius: 12px !important;
|
|
border: none !important;
|
|
box-shadow: 0 6px 20px rgba(31, 143, 143, 0.3) !important;
|
|
transition: all 0.25s ease !important;
|
|
}
|
|
.btn-login-submit:hover {
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 8px 25px rgba(31, 143, 143, 0.4) !important;
|
|
}
|
|
|
|
/* Responsive adjustments */
|
|
@media (max-width: 991px) {
|
|
.login-split-container {
|
|
flex-direction: column;
|
|
}
|
|
.login-left-panel {
|
|
padding: 40px 24px;
|
|
}
|
|
.features-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
.login-right-panel {
|
|
padding: 40px 20px;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<div class="login-split-container">
|
|
<!-- Left Panel Banner -->
|
|
<div class="login-left-panel">
|
|
<div class="deco-circle-1"/>
|
|
<div class="deco-circle-2"/>
|
|
|
|
<div class="left-header-area">
|
|
<!-- Campus Logo -->
|
|
<img src="/education_dashboard/static/src/img/logo.png" alt="Logo" class="left-campus-logo"/>
|
|
|
|
<div class="left-welcome-tag">Welcome to</div>
|
|
<div class="left-main-title">Education Portal</div>
|
|
<div class="left-sub-title">Deemed University</div>
|
|
|
|
<p class="left-description-text">
|
|
Access your workspace securely with a single sign-in experience designed for administrators, staff, faculty, students, and other authorized users.
|
|
</p>
|
|
<p class="left-description-text">
|
|
Manage operations, collaborate efficiently, and stay connected from anywhere through a modern, secure, and reliable platform.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Feature Highlights -->
|
|
<div>
|
|
<h6 class="font-weight-bold text-dark mb-2" style="font-size: 1.5rem; color: #144d4d !important;">Feature Highlights</h6>
|
|
<div class="features-grid">
|
|
<div class="feature-card">
|
|
<div class="feature-icon-title">
|
|
<span>🔐</span> Secure Authentication
|
|
</div>
|
|
<p class="feature-desc">End-to-end encryption & robust data protection.</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon-title">
|
|
<span>⚡</span> Fast & Reliable Access
|
|
</div>
|
|
<p class="feature-desc">High-speed performance for all users.</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon-title">
|
|
<span>📊</span> Real-Time Information
|
|
</div>
|
|
<p class="feature-desc">Instant updates on academics, attendance & fees.</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon-title">
|
|
<span>☁️</span> Cloud-Based Platform
|
|
</div>
|
|
<p class="feature-desc">Accessible anytime, anywhere on any device.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Right Panel Form -->
|
|
<div class="login-right-panel">
|
|
<div class="login-card-box">
|
|
<div class="login-card-title">Welcome!</div>
|
|
<div class="login-card-subtitle">Sign in to access your student portal workspace.</div>
|
|
|
|
<!-- Odoo Login Form -->
|
|
<t t-out="0"/>
|
|
|
|
<!-- Security Footer inside card -->
|
|
<div class="text-center p-2 rounded-lg mt-4" style="background: #f8fafc; border: 1px solid #edf2f7; font-size: 0.82rem; color: #64748b; font-weight: 600;">
|
|
<i class="fa fa-shield text-success mr-1"/> Your data is 100% secure with us.
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Bottom Page Footer -->
|
|
<div class="text-center mt-4" style="font-size: 0.85rem; color: #718096; font-weight: 600;">
|
|
<div>Powered by <a href="https://metatroncubesolutions.com/" style="color: #144d4d; font-weight: 700; text-decoration: none;">Metatroncube</a></div>
|
|
<div>© 2026 Metatron EduPortal. All rights reserved.</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Password Toggle Script -->
|
|
<script type="text/javascript">
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
var toggleBtn = document.getElementById("togglePasswordBtn");
|
|
var passwordInput = document.getElementById("password");
|
|
var toggleIcon = document.getElementById("togglePasswordIcon");
|
|
|
|
if (toggleBtn && passwordInput && toggleIcon) {
|
|
toggleBtn.addEventListener("click", function() {
|
|
if (passwordInput.type === "password") {
|
|
passwordInput.type = "text";
|
|
toggleIcon.classList.remove("fa-eye-slash");
|
|
toggleIcon.classList.add("fa-eye");
|
|
} else {
|
|
passwordInput.type = "password";
|
|
toggleIcon.classList.remove("fa-eye");
|
|
toggleIcon.classList.add("fa-eye-slash");
|
|
}
|
|
});
|
|
}
|
|
});
|
|
</script>
|
|
</xpath>
|
|
</template>
|
|
|
|
<!-- Custom Login Form Template Override -->
|
|
<template id="custom_login_form" inherit_id="web.login" name="Education Portal Custom Login Form">
|
|
<xpath expr="//form[@role='form']" position="replace">
|
|
<form class="oe_login_form" role="form" t-attf-action="/web/login?#{keep_query('*')}" method="post" onsubmit="this.action = this.action + location.hash">
|
|
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
|
|
<input type="hidden" name="db" t-att-value="request.db" t-if="request.db"/>
|
|
|
|
<!-- Database selector if multiple databases exist -->
|
|
<div class="mb-3" t-if="databases and len(databases) > 1">
|
|
<label for="db" class="form-label font-weight-bold" style="color: #4a5568; font-size: 0.88rem;">Database</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text bg-white border-end-0 text-muted" style="border-radius: 12px 0 0 12px; border-color: #cbd5e1;">
|
|
<i class="fa fa-database" style="color: #1f8f8f;"/>
|
|
</span>
|
|
<input type="text" name="db" t-att-value="request.db" id="db" class="form-control border-start-0" required="required" readonly="readonly" style="border-radius: 0 12px 12px 0; border-color: #cbd5e1; height: 48px; font-weight: 600;"/>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Username / Email Field -->
|
|
<div class="mb-3">
|
|
<label for="login" class="form-label font-weight-bold" style="color: #4a5568; font-size: 0.88rem;">Student Email / Username</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text bg-white border-end-0" style="border-radius: 12px 0 0 12px; border-color: #cbd5e1;">
|
|
<i class="fa fa-user-circle" style="color: #1f8f8f; font-size: 1.1rem;"/>
|
|
</span>
|
|
<input type="text" placeholder="Enter your Email" name="login" t-att-value="login" id="login" class="form-control border-start-0" required="required" autocomplete="username" autofocus="autofocus" autocapitalize="off" style="border-radius: 0 12px 12px 0; border-color: #cbd5e1; height: 48px; font-size: 0.95rem;"/>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Password Field -->
|
|
<div class="mb-3">
|
|
<label for="password" class="form-label font-weight-bold" style="color: #4a5568; font-size: 0.88rem;">Password</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text bg-white border-end-0" style="border-radius: 12px 0 0 12px; border-color: #cbd5e1;">
|
|
<i class="fa fa-lock" style="color: #1f8f8f; font-size: 1.1rem;"/>
|
|
</span>
|
|
<input type="password" placeholder="Enter your password" name="password" id="password" class="form-control border-start-0 border-end-0" required="required" autocomplete="current-password" t-att-autofocus="'autofocus' if login else None" style="border-color: #cbd5e1; height: 48px; font-size: 0.95rem;"/>
|
|
<span class="input-group-text bg-white border-start-0" id="togglePasswordBtn" style="border-radius: 0 12px 12px 0; border-color: #cbd5e1; cursor: pointer;">
|
|
<i class="fa fa-eye-slash" id="togglePasswordIcon" style="color: #94a3b8;"/>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Error Alert -->
|
|
<div class="alert alert-danger d-flex align-items-center mb-3 p-3" t-if="error" role="alert" style="border-radius: 12px; font-size: 0.88rem; background: #fdf2f2; border: 1px solid #fde8e8; color: #de3535;">
|
|
<i class="fa fa-exclamation-circle mr-2 fa-lg"/>
|
|
<span><t t-esc="error"/></span>
|
|
</div>
|
|
|
|
<!-- Success/Info Message Alert -->
|
|
<div class="alert alert-success d-flex align-items-center mb-3 p-3" t-if="message" role="status" style="border-radius: 12px; font-size: 0.88rem;">
|
|
<i class="fa fa-check-circle mr-2 fa-lg"/>
|
|
<span><t t-esc="message"/></span>
|
|
</div>
|
|
|
|
<!-- Options Row: Remember Me & Reset Password -->
|
|
<div class="d-flex align-items-center justify-content-between mb-4">
|
|
<div class="form-check d-flex align-items-center gap-2">
|
|
<input class="form-check-input" type="checkbox" id="rememberMe" style="cursor: pointer; width: 16px; height: 16px;"/>
|
|
<label class="form-check-label text-muted small font-weight-bold" for="rememberMe" style="cursor: pointer;">Remember me</label>
|
|
</div>
|
|
<t t-if="reset_password_enabled">
|
|
<a href="/web/reset_password" class="small font-weight-bold text-decoration-none" style="color: #1f8f8f;">Forgot Password?</a>
|
|
</t>
|
|
</div>
|
|
|
|
<!-- Submit Button -->
|
|
<div class="d-grid mb-3">
|
|
<button type="submit" class="btn text-white w-100 font-weight-bold btn-login-submit" style="background: linear-gradient(135deg, #1f8f8f 0%, #144d4d 100%); border-radius: 12px; height: 50px; font-size: 1.05rem;">
|
|
Sign In <i class="fa fa-arrow-right ml-2"/>
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Quick Demo Access Section -->
|
|
<div class="text-center my-4 position-relative">
|
|
<hr style="border-color: #e2e8f0; margin: 0;"/>
|
|
<span class="position-absolute bg-white px-3 text-muted font-weight-bold" style="top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 0.95rem; color: #144d4d !important;">Quick Demo Access</span>
|
|
</div>
|
|
|
|
<div class="text-center mb-3">
|
|
<span class="small text-muted">Demo accounts contain fictional data.</span>
|
|
</div>
|
|
|
|
<div class="d-flex flex-row justify-content-between gap-2 mb-2">
|
|
<form action="/demo/login" method="post" class="flex-fill m-0" style="width: 32%;">
|
|
<input type="hidden" name="role" value="admin"/>
|
|
<button type="submit" class="btn d-flex flex-column align-items-center justify-content-center p-2" style="border-radius: 12px; border: 1.5px solid #1f8f8f; color: #144d4d; background: #eef9f9; transition: all 0.2s; height: 100%; width: 32%;">
|
|
<span class="font-weight-bold mb-1" style="font-size: 0.9rem;"><i class="fa fa-cogs d-block mb-1 text-center" style="font-size: 1.1rem;"/>Admin</span>
|
|
<span class="text-muted text-center" style="font-size: 0.7rem; line-height: 1.1;">Full Access</span>
|
|
</button>
|
|
</form>
|
|
|
|
<form action="/demo/login" method="post" class="flex-fill m-0" style="width: 32%;">
|
|
<input type="hidden" name="role" value="faculty"/>
|
|
<button type="submit" class="btn w-100 d-flex flex-column align-items-center justify-content-center p-2" style="border-radius: 12px; border: 1.5px solid #1f8f8f; color: #144d4d; background: #eef9f9; transition: all 0.2s; height: 100%;">
|
|
<span class="font-weight-bold mb-1" style="font-size: 0.9rem;"><i class="fa fa-graduation-cap d-block mb-1 text-center" style="font-size: 1.1rem;"/>Faculty</span>
|
|
<span class="text-muted text-center" style="font-size: 0.7rem; line-height: 1.1;">Courses & LMS</span>
|
|
</button>
|
|
</form>
|
|
|
|
<form action="/demo/login" method="post" class="flex-fill m-0" style="width: 32%;">
|
|
<input type="hidden" name="role" value="student"/>
|
|
<button type="submit" class="btn w-100 d-flex flex-column align-items-center justify-content-center p-2" style="border-radius: 12px; border: 1.5px solid #1f8f8f; color: #144d4d; background: #eef9f9; transition: all 0.2s; height: 100%;">
|
|
<span class="font-weight-bold mb-1" style="font-size: 0.9rem;"><i class="fa fa-user d-block mb-1 text-center" style="font-size: 1.1rem;"/>Student</span>
|
|
<span class="text-muted text-center" style="font-size: 0.7rem; line-height: 1.1;">Portal & Classes</span>
|
|
</button>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- <div class="row g-2 mb-2">
|
|
<div class="col-6">
|
|
<button type="button" class="btn btn-outline-secondary w-100 font-weight-bold d-flex align-items-center justify-content-center gap-2" style="border-radius: 12px; height: 44px; font-size: 0.85rem; border-color: #cbd5e1; color: #4a5568;">
|
|
<svg width="18" height="18" viewBox="0 0 24 24"><path fill="#4285F4" d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"/><path fill="#34A853" d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"/><path fill="#FBBC05" d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.06H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.94l2.85-2.22.81-.63z"/><path fill="#EA4335" d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.06l3.66 2.84c.87-2.6 3.3-4.52 6.16-4.52z"/></svg>
|
|
Google
|
|
</button>
|
|
</div>
|
|
<div class="col-6">
|
|
<button type="button" class="btn btn-outline-secondary w-100 font-weight-bold d-flex align-items-center justify-content-center gap-2" style="border-radius: 12px; height: 44px; font-size: 0.85rem; border-color: #cbd5e1; color: #4a5568;">
|
|
<svg width="18" height="18" viewBox="0 0 23 23"><path fill="#f35325" d="M1 1h10v10H1z"/><path fill="#81bc06" d="M12 1h10v10H12z"/><path fill="#05a6f0" d="M1 12h10v10H1z"/><path fill="#ffba08" d="M12 12h10v10H12z"/></svg>
|
|
Microsoft
|
|
</button>
|
|
</div>
|
|
</div> -->
|
|
|
|
<input type="hidden" name="redirect" t-att-value="redirect"/>
|
|
</form>
|
|
</xpath>
|
|
</template>
|
|
</odoo>
|