Jan Remmer Siebels
544284dd8b
- Remove dashboard view from urls.py and views.py - Delete dashboard.html template - Remove dashboard navigation link from base.html - Replace all dashboard redirects with home redirects in views.py - Update all breadcrumb links from 'Dashboard' to 'Home' in templates - Update German text from 'Dashboard' to 'Startseite' in auth templates - Update 'Zurück zum Dashboard' links to 'Zurück zur Startseite' The dashboard was redundant with the home page functionality. All navigation now directs users to the main home page instead. System check passes without issues after removal.
129 lines
6.2 KiB
HTML
129 lines
6.2 KiB
HTML
{% extends "base.html" %}
|
|
{% load static %}
|
|
|
|
{% block title %}{{ title }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid">
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-8">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h4 class="mb-0">
|
|
<i class="fas fa-shield-alt text-primary"></i>
|
|
Zwei-Faktor-Authentifizierung einrichten
|
|
</h4>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<h5>Schritt 1: Authenticator App installieren</h5>
|
|
<p class="text-muted">
|
|
Installieren Sie eine Authenticator-App auf Ihrem Smartphone:
|
|
</p>
|
|
<ul class="mb-4">
|
|
<li><strong>Google Authenticator</strong> (iOS/Android)</li>
|
|
<li><strong>Microsoft Authenticator</strong> (iOS/Android)</li>
|
|
<li><strong>Authy</strong> (iOS/Android/Desktop)</li>
|
|
<li><strong>1Password</strong> (Premium)</li>
|
|
</ul>
|
|
|
|
<h5>Schritt 2: QR-Code scannen</h5>
|
|
<p class="text-muted">
|
|
Scannen Sie den QR-Code mit Ihrer Authenticator-App:
|
|
</p>
|
|
<div class="text-center mb-4">
|
|
<img src="{% url 'stiftung:two_factor_qr' %}"
|
|
alt="QR Code für 2FA Setup"
|
|
class="img-fluid border rounded"
|
|
style="max-width: 200px;">
|
|
</div>
|
|
|
|
<details class="mb-4">
|
|
<summary class="text-muted small">Manueller Setup-Code anzeigen</summary>
|
|
<div class="mt-2 p-2 bg-light rounded">
|
|
<small class="font-monospace">{{ device.key }}</small>
|
|
</div>
|
|
<small class="text-muted d-block mt-1">
|
|
Falls der QR-Code nicht funktioniert, können Sie diesen Code manuell eingeben.
|
|
</small>
|
|
</details>
|
|
</div>
|
|
|
|
<div class="col-md-6">
|
|
<h5>Schritt 3: Bestätigen</h5>
|
|
<p class="text-muted">
|
|
Geben Sie den 6-stelligen Code aus Ihrer Authenticator-App ein:
|
|
</p>
|
|
|
|
<form method="post">
|
|
{% csrf_token %}
|
|
<div class="mb-3">
|
|
<label for="token" class="form-label">Bestätigungscode</label>
|
|
<input type="text"
|
|
class="form-control"
|
|
id="token"
|
|
name="token"
|
|
placeholder="000000"
|
|
maxlength="6"
|
|
pattern="[0-9]{6}"
|
|
required
|
|
autocomplete="off">
|
|
<div class="form-text">
|
|
Der Code wechselt alle 30 Sekunden.
|
|
</div>
|
|
</div>
|
|
|
|
<div class="d-grid gap-2">
|
|
<button type="submit" class="btn btn-primary">
|
|
<i class="fas fa-check"></i>
|
|
Zwei-Faktor-Authentifizierung aktivieren
|
|
</button>
|
|
<a href="{% url 'stiftung:home' %}" class="btn btn-outline-secondary">
|
|
<i class="fas fa-times"></i>
|
|
Abbrechen
|
|
</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mt-4">
|
|
<div class="col-12">
|
|
<div class="alert alert-info">
|
|
<h6><i class="fas fa-info-circle"></i> Wichtige Hinweise:</h6>
|
|
<ul class="mb-0 small">
|
|
<li>Nach der Aktivierung erhalten Sie Backup-Codes für den Notfall</li>
|
|
<li>Bewahren Sie diese Backup-Codes sicher auf</li>
|
|
<li>Sie benötigen bei jeder Anmeldung einen Code aus der App</li>
|
|
<li>Die Zwei-Faktor-Authentifizierung erhöht die Sicherheit Ihres Kontos erheblich</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Auto-focus on token input
|
|
const tokenInput = document.getElementById('token');
|
|
if (tokenInput) {
|
|
tokenInput.focus();
|
|
|
|
// Auto-submit when 6 digits entered
|
|
tokenInput.addEventListener('input', function() {
|
|
if (this.value.length === 6 && /^\d{6}$/.test(this.value)) {
|
|
// Small delay to allow user to see complete input
|
|
setTimeout(() => {
|
|
this.closest('form').submit();
|
|
}, 300);
|
|
}
|
|
});
|
|
}
|
|
});
|
|
</script>
|
|
{% endblock %} |