- Created _navigation.html component with 5-step progress indicator - Added German labels (E-Mail, Persönliche Daten, Motivation, Dokumente, Bestätigung) - Implemented can_access_page() validation in routes.py - Users can navigate backward to completed pages (data preserved) - Sequential forward progression enforced (cannot skip ahead) - Visual states: completed (green checkmark), current (blue), future (gray) - Added comprehensive CSS styling with responsive design - Updated base.html to include navigation component - Updated page templates to pass current_page context - Navigation appears on pages 2-5 only - All 102 tests passing with no regressions
40 lines
1.2 KiB
HTML
40 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{% block title %}Bewerbungsformular{% endblock %}</title>
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<header>
|
|
<h1>{% block header %}Bewerbungsformular{% endblock %}</h1>
|
|
</header>
|
|
|
|
<!-- Progress Navigation -->
|
|
{% include '_navigation.html' %}
|
|
|
|
<main>
|
|
{% with messages = get_flashed_messages(with_categories=true) %}
|
|
{% if messages %}
|
|
<div class="messages">
|
|
{% for category, message in messages %}
|
|
<div class="message message-{{ category }}">
|
|
{{ message }}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
{% endwith %}
|
|
|
|
{% block content %}{% endblock %}
|
|
</main>
|
|
|
|
<footer>
|
|
<p>© 2025 - Alle Rechte vorbehalten</p>
|
|
</footer>
|
|
</div>
|
|
</body>
|
|
</html>
|