aradhyapavan's picture
multi-personality-bot
540412a verified
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}Multi-Personality Bot{% endblock %}</title>
<!-- Bootstrap 5 -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Material Design 3 -->
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- Font Awesome - Multiple CDN Sources -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v6.5.1/css/all.css" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.5.1/css/all.min.css">
<!-- Bootstrap Icons as backup -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
<!-- Primer CSS Components -->
<link href="https://unpkg.com/@primer/css@^20.2.4/dist/primer.css" rel="stylesheet">
<!-- Terminal Font -->
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;700&display=swap" rel="stylesheet">
<!-- Custom Styles -->
<link rel="stylesheet" href="{{ url_for('static', filename='css/terminal.css') }}">
<meta name="theme-color" content="#0d1117">
</head>
<body class="bg-dark text-light">
<!-- Glitch overlay for aesthetic -->
<div class="glitch-overlay"></div>
<!-- Navigation -->
<nav class="navbar navbar-dark terminal-nav">
<div class="container-fluid">
<a class="navbar-brand terminal-brand" href="/">
<i class="fas fa-robot text-success me-2" aria-hidden="true"></i>
<span class="brand-text">Multi-Personality Bot</span>
<span class="brand-cursor">_</span>
</a>
<div class="mx-auto d-flex align-items-center">
<img src="{{ url_for('static', filename='img/maximally.png') }}" alt="Maximally" height="32" class="me-2">
<span class="terminal-title" style="font-size: 1.5rem;">Maximally</span>
</div>
<div class="navbar-nav ms-auto">
<div class="terminal-status">
<span class="status-indicator"></span>
<span class="status-text">ONLINE</span>
</div>
</div>
</div>
</nav>
<!-- Main Content -->
<main class="container-fluid terminal-main">
{% block content %}{% endblock %}
</main>
<!-- Footer -->
<footer class="terminal-footer">
<div class="container-fluid">
<div class="row">
<div class="col-12 text-center">
<small class="text-muted terminal-text">
> Built for Code Hypothesis Hackathon // Testing: "Which bot personality generates the most engagement?"
<span class="text-success">✓ HYPOTHESIS_ACTIVE</span>
</small>
<div class="mt-2">
<div class="terminal-window d-inline-block">
<div class="bg-dark p-2 text-start">
<div class="text-terminal-green">
<i class="fas fa-code me-2"></i>
<span class="text-muted">developer@hackathon:~$</span> whoami<br>
<span class="text-terminal-accent">Designed & developed by</span> <strong class="text-success">Aradhya Pavan H S</strong>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</footer>
<!-- Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
<!-- Socket.IO -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.7.2/socket.io.js"></script>
<!-- Custom Scripts -->
<script src="{{ url_for('static', filename='js/terminal-effects.js') }}"></script>
{% block scripts %}{% endblock %}
</body>
</html>