Spaces:
Sleeping
Sleeping
| {% load static %} | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <!-- Bootstrap 5 --> | |
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"> | |
| <!-- FontAwesome --> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"> | |
| <!-- Google Fonts --> | |
| <link | |
| href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;900&family=Orbitron:wght@400;700;900&display=swap" | |
| rel="stylesheet"> | |
| <!-- Custom 3D Cyber CSS --> | |
| <link rel="stylesheet" href="{% static 'css/style.css' %}"> | |
| <title>Credit Card Fraud Detection | AI Console</title> | |
| </head> | |
| <body class="video-enabled"> | |
| <!-- Video Background Container --> | |
| <div class="video-bg-container"> | |
| <video autoplay muted loop playsinline class="video-bg" id="bgVideo"> | |
| <source src="{% static 'videos/home_bg.mp4' %}" type="video/mp4"> | |
| Your browser does not support the video tag. | |
| </video> | |
| <div class="video-overlay"></div> | |
| </div> | |
| <!-- Modern Glass Header --> | |
| <nav class="header-modern"> | |
| <div class="d-flex align-items-center"> | |
| <i class="fas fa-shield-alt text-primary fs-3 me-3"></i> | |
| <div> | |
| <h4 class="m-0 fw-bold text-white" style="letter-spacing: -0.5px;">Fraud<span | |
| class="text-primary">Guard</span></h4> | |
| </div> | |
| </div> | |
| <div class="d-none d-md-flex align-items-center"> | |
| <a class="nav-link-modern {% if request.path == '/' %}active{% endif %}" href="{% url 'index' %}">Hub</a> | |
| <a class="nav-link-modern" href="{% url 'UserLogin' %}">User Portal</a> | |
| <a class="nav-link-modern" href="{% url 'AdminLoginCheck' %}">Admin Console</a> | |
| <a class="btn-modern ms-3" href="{% url 'UserRegisterForm' %}" | |
| style="padding: 8px 20px; font-size: 0.8rem;"> | |
| Get Started | |
| </a> | |
| </div> | |
| </nav> | |
| <!-- Main Content Area --> | |
| <div style="padding-top: 80px; position: relative; z-index: 2;"> | |
| {% block contents %} | |
| {% endblock %} | |
| </div> | |
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script> | |
| <script> | |
| window.addEventListener('scroll', function () { | |
| const header = document.querySelector('.header-modern'); | |
| if (window.scrollY > 50) { | |
| header.classList.add('scrolled'); | |
| } else { | |
| header.classList.remove('scrolled'); | |
| } | |
| }); | |
| document.addEventListener("DOMContentLoaded", function () { | |
| var video = document.getElementById("bgVideo"); | |
| if (video) { | |
| video.playbackRate = 0.6; // Lower video speed | |
| } | |
| }); | |
| </script> | |
| </body> | |
| </html> |