feat: implement user authentication with login/logout functionality

- Add user login screen with German interface
- Add user icon and dropdown menu in header for authenticated users
- Add password change functionality with proper redirects
- Configure authentication URLs and settings
- Ensure all auth functions redirect to main page instead of admin
- Complete openspec change proposal for login feature

VorgabenUI/settings.py

@@ -152,6 +152,11 @@ DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'
 DATA_UPLOAD_MAX_NUMBER_FIELDS=10250
 NESTED_ADMIN_LAZY_INLINES = True
 
+# Authentication settings
+LOGIN_URL = 'login'
+LOGIN_REDIRECT_URL = '/'
+LOGOUT_REDIRECT_URL = 'login'
+
 #LOGGING = {
 #    "version": 1,
 #    "handlers"  :{

VorgabenUI/urls.py

@@ -18,6 +18,7 @@ from django.contrib import admin
 from django.urls import include, path, re_path
 from django.conf import settings
 from django.conf.urls.static import static
+from django.contrib.auth import views as auth_views
 import dokumente.views
 import pages.views
 import referenzen.views
@@ -32,6 +33,11 @@ urlpatterns = [
     path('stichworte/', include("stichworte.urls")),
     path('referenzen/', referenzen.views.tree, name="referenz_tree"),
     path('referenzen/<str:refid>/', referenzen.views.detail, name="referenz_detail"),
+    # Authentication URLs
+    path('login/', auth_views.LoginView.as_view(template_name='registration/login.html'), name='login'),
+    path('logout/', auth_views.LogoutView.as_view(next_page='/'), name='logout'),
+    path('password_change/', auth_views.PasswordChangeView.as_view(template_name='registration/password_change.html', success_url='/'), name='password_change'),
+    path('password_change/done/', auth_views.PasswordChangeDoneView.as_view(template_name='registration/password_change_done.html'), name='password_change_done'),
 ]
 
 # Serve static files

openspec/changes/add-login/tasks.md

@@ -0,0 +1,5 @@
+## 1. Add user login functionality
+- [x] add a login screen for users
+- [x] add an icon for logged in user on the top right corner of all page
+- [x] add a menu to log out and change password on the user icon
+- [x] all functions should go back to the main page, not the django admin page

openspec/project.md

@@ -0,0 +1,63 @@
+# Project Context
+
+## Purpose
+This is a Django-based document management system for regulatory documents (Dokumente) and their provisions (Vorgaben). It manages validity periods, conflicts between overlapping provisions, references, keywords, and roles. The system supports importing documents, checking for compliance, and maintaining changelogs.
+
+## Tech Stack
+- Python 3.x
+- Django 5.2.5
+- SQLite (development), PostgreSQL (production)
+- Django MPTT for tree structures
+- Django Nested Admin for inline editing
+- Kubernetes for deployment
+- ArgoCD for continuous deployment
+- Traefik for ingress
+- Gunicorn for WSGI server
+
+## Project Conventions
+
+### Code Style
+- Language: German for user-facing strings and model names, English for code comments and internal naming
+- Imports: Standard library first, then Django, then third-party, then local apps
+- Model naming: German nouns (Dokument, Vorgabe, Person)
+- Field naming: German for field names, English Django conventions
+- Class naming: PascalCase for models, snake_case for functions/variables
+- All models have __str__ methods returning meaningful German strings
+- Use verbose_name and verbose_name_plural in Meta classes (German)
+
+### Architecture Patterns
+- Django apps: abschnitte, dokumente, referenzen, rollen, stichworte, pages
+- MPTT for hierarchical text sections
+- Foreign keys with on_delete=models.PROTECT for important relationships
+- Many-to-many with descriptive related_name
+- Proxy models for different views (e.g., VorgabenTable)
+- Management commands for data operations
+
+### Testing Strategy
+- Django test framework
+- Test class names in English, methods in English
+- Comprehensive model tests
+- Test both success and error cases
+- Run with `python manage.py test`
+
+### Git Workflow
+- Standard Git workflow
+- Commits in English
+- Use Gitea workflows for CI/CD
+
+## Domain Context
+The system manages regulatory documents with numbered provisions that have validity dates. Provisions can conflict if they have overlapping date ranges for the same document, theme, and number. The system includes sanity checks for conflicts, diagram caching for visualization, and JSON export functionality.
+
+## Important Constraints
+- German language for all user interfaces and data
+- Strict validation of date ranges to prevent overlapping provisions
+- Documents have types, authors, reviewers, and validity periods
+- Provisions linked to themes, references, keywords, and relevant roles
+- Active/inactive status for documents
+
+## External Dependencies
+- Django ecosystem: MPTT, nested-admin, revproxy
+- Kubernetes cluster for deployment
+- ArgoCD for GitOps
+- Traefik for load balancing
+- External diagram services (diagramm_proxy)

pages/templates/base.html

@@ -41,6 +41,30 @@
            alt="Zur Startseite" />
       <h1>Vorgaben Informatiksicherheit BIT</h1>
     </a>
+    
+    <!-- User Menu -->
+    {% if user.is_authenticated %}
+    <div class="user-menu" style="position: absolute; top: 20px; right: 20px; z-index: 1000;">
+      <div class="dropdown">
+        <a href="#" class="dropdown-toggle" data-toggle="dropdown" style="text-decoration: none; color: #000; display: flex; align-items: center;">
+          <span style="font-size: 24px; margin-right: 8px;">👤</span>
+          <span class="hidden-xs" style="margin-left: 0;">{{ user.username }}</span>
+          <span class="caret" style="margin-left: 8px;"></span>
+        </a>
+        <ul class="dropdown-menu dropdown-menu-right" role="menu">
+          <li><a href="{% url 'password_change' %}">Passwort ändern</a></li>
+          <li class="divider"></li>
+          <li><a href="{% url 'logout' %}">Abmelden</a></li>
+        </ul>
+      </div>
+    </div>
+    {% else %}
+    <div class="user-menu" style="position: absolute; top: 20px; right: 20px; z-index: 1000;">
+      <a href="{% url 'login' %}" class="btn btn-sm btn-primary" style="text-decoration: none;">
+        Anmelden
+      </a>
+    </div>
+    {% endif %}
   </header>
 
   <!-- Main Navigation -->

pages/templates/registration/login.html

@@ -0,0 +1,43 @@
+{% extends "base.html" %}
+{% load static %}
+
+{% block title %}Anmelden{% endblock %}
+
+{% block content %}
+<div class="row">
+  <div class="col-md-4 col-md-offset-4">
+    <div class="panel panel-default">
+      <div class="panel-heading">
+        <h3 class="panel-title">Anmelden</h3>
+      </div>
+      <div class="panel-body">
+        <form method="post">
+          {% csrf_token %}
+          
+          {% if form.errors %}
+            <div class="alert alert-danger">
+              <p>Ihr Benutzername und Passwort stimmen nicht überein. Bitte versuchen Sie es erneut.</p>
+            </div>
+          {% endif %}
+          
+          <div class="form-group">
+            <label for="id_username">Benutzername:</label>
+            <input type="text" name="username" class="form-control" id="id_username" required autofocus>
+          </div>
+          
+          <div class="form-group">
+            <label for="id_password">Passwort:</label>
+            <input type="password" name="password" class="form-control" id="id_password" required>
+          </div>
+          
+          <div class="form-group">
+            <button type="submit" class="btn btn-primary">Anmelden</button>
+          </div>
+          
+          <input type="hidden" name="next" value="{{ next }}">
+        </form>
+      </div>
+    </div>
+  </div>
+</div>
+{% endblock %}

pages/templates/registration/password_change.html

@@ -0,0 +1,56 @@
+{% extends "base.html" %}
+{% load static %}
+
+{% block title %}Passwort ändern{% endblock %}
+
+{% block content %}
+<div class="row">
+  <div class="col-md-6 col-md-offset-3">
+    <div class="panel panel-default">
+      <div class="panel-heading">
+        <h3 class="panel-title">Passwort ändern</h3>
+      </div>
+      <div class="panel-body">
+        <form method="post">
+          {% csrf_token %}
+          
+          {% if form.errors %}
+            <div class="alert alert-danger">
+              <p>Bitte korrigieren Sie die Fehler unten.</p>
+            </div>
+          {% endif %}
+          
+          <div class="form-group">
+            <label for="id_old_password">Aktuelles Passwort:</label>
+            <input type="password" name="old_password" class="form-control" id="id_old_password" required>
+            {% if form.old_password.errors %}
+              <div class="text-danger">{{ form.old_password.errors }}</div>
+            {% endif %}
+          </div>
+          
+          <div class="form-group">
+            <label for="id_new_password1">Neues Passwort:</label>
+            <input type="password" name="new_password1" class="form-control" id="id_new_password1" required>
+            {% if form.new_password1.errors %}
+              <div class="text-danger">{{ form.new_password1.errors }}</div>
+            {% endif %}
+          </div>
+          
+          <div class="form-group">
+            <label for="id_new_password2">Neues Passwort bestätigen:</label>
+            <input type="password" name="new_password2" class="form-control" id="id_new_password2" required>
+            {% if form.new_password2.errors %}
+              <div class="text-danger">{{ form.new_password2.errors }}</div>
+            {% endif %}
+          </div>
+          
+          <div class="form-group">
+            <button type="submit" class="btn btn-primary">Passwort ändern</button>
+            <a href="/" class="btn btn-default">Abbrechen</a>
+          </div>
+        </form>
+      </div>
+    </div>
+  </div>
+</div>
+{% endblock %}

pages/templates/registration/password_change_done.html

@@ -0,0 +1,24 @@
+{% extends "base.html" %}
+{% load static %}
+
+{% block title %}Passwort geändert{% endblock %}
+
+{% block content %}
+<div class="row">
+  <div class="col-md-6 col-md-offset-3">
+    <div class="panel panel-default">
+      <div class="panel-heading">
+        <h3 class="panel-title">Passwort erfolgreich geändert</h3>
+      </div>
+      <div class="panel-body">
+        <div class="alert alert-success">
+          <p>Ihr Passwort wurde erfolgreich geändert.</p>
+        </div>
+        <p>
+          <a href="/" class="btn btn-primary">Zurück zur Startseite</a>
+        </p>
+      </div>
+    </div>
+  </div>
+</div>
+{% endblock %}