Emily
Add comprehensive Privacy Attacks visualization page
7bfe1af
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}DP-SGD Explorer{% endblock %}</title>
<link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='css/learning.css') }}">
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-annotation"></script>
<script>
// Register the annotation plugin
Chart.register(ChartAnnotation);
</script>
{% block extra_head %}{% endblock %}
</head>
<body>
<div class="app-container">
<header class="main-header">
<div class="header-container">
<div>
<div class="logo">DP-SGD Explorer</div>
<div class="tagline">Interactive Learning & Experimentation</div>
</div>
<nav>
<ul class="nav-list">
<li><a href="{{ url_for('main.attacks') }}" class="nav-link {% if request.endpoint == 'main.attacks' %}active{% endif %}">Privacy Attacks</a></li>
<li><a href="{{ url_for('main.learning') }}" class="nav-link {% if request.endpoint == 'main.learning' %}active{% endif %}">Learning Hub</a></li>
<li><a href="{{ url_for('main.index') }}" class="nav-link {% if request.endpoint == 'main.index' %}active{% endif %}">Playground</a></li>
</ul>
</nav>
</div>
</header>
<main class="main-content">
{% block content %}{% endblock %}
</main>
<footer class="footer">
<p>DP-SGD Explorer - An Educational Tool for Differential Privacy in Machine Learning</p>
<p>© 2024 - For educational purposes</p>
</footer>
</div>
<script src="{{ url_for('static', filename='js/main.js') }}"></script>
{% block extra_scripts %}{% endblock %}
</body>
</html>