Caroouusseelll gemacht und bookmarks

Dashboard_V2/Dockerfile

@@ -0,0 +1,14 @@
+FROM python:3.9-slim
+
+WORKDIR /app
+
+# Abhängigkeiten kopieren und installieren
+COPY requirements.txt requirements.txt
+RUN pip install --no-cache-dir -r requirements.txt
+
+# Anwendungscode kopieren
+COPY . .
+
+EXPOSE 9559
+
+CMD ["python", "app.py"]

Dashboard_V2/app.py

@@ -12,7 +12,7 @@ EMAIL_SENDER = "clickcandit@gmail.com"
 EMAIL_PASSWORD = "iuxexntistlwilhl"
 
 app = Flask(__name__)
-app.secret_key = "SUPER_SECRET_KEY"  # Bitte anpassen
+app.secret_key = "fiudsh9uw4hefjsefnjdsdh"
 
 DATABASE = 'clickcandit.db'
 
@@ -32,7 +32,6 @@ def close_connection(exception):
 def init_db():
     with app.app_context():
         db = get_db()
-        # Users
         db.execute("""
             CREATE TABLE IF NOT EXISTS users (
                 id INTEGER PRIMARY KEY AUTOINCREMENT,
@@ -42,7 +41,6 @@ def init_db():
                 is_admin INTEGER DEFAULT 0
             );
         """)
-        # Bookmarks
         db.execute("""
             CREATE TABLE IF NOT EXISTS bookmarks (
                 id INTEGER PRIMARY KEY AUTOINCREMENT,
@@ -50,14 +48,14 @@ def init_db():
                 title TEXT NOT NULL,
                 url TEXT NOT NULL,
                 icon_class TEXT NOT NULL DEFAULT 'fas fa-bookmark',
+                bg_color TEXT NOT NULL DEFAULT 'fas fa-bookmark',
                 FOREIGN KEY(user_id) REFERENCES users(id) ON DELETE CASCADE
             );
         """)
-        # Notifications
         db.execute("""
             CREATE TABLE IF NOT EXISTS notifications (
                 id INTEGER PRIMARY KEY AUTOINCREMENT,
-                user_id INTEGER,         -- NULL = für alle
+                user_id INTEGER,
                 message TEXT NOT NULL,
                 created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
                 is_read INTEGER DEFAULT 0
@@ -71,7 +69,6 @@ def init_db():
                 FOREIGN KEY(user_id) REFERENCES users(id) ON DELETE CASCADE
             );
         """)
-        # Time Tracking
         db.execute("""
             CREATE TABLE IF NOT EXISTS time_entries (
                 id INTEGER PRIMARY KEY AUTOINCREMENT,
@@ -82,7 +79,6 @@ def init_db():
                 FOREIGN KEY(user_id) REFERENCES users(id) ON DELETE CASCADE
             );
         """)
-        # Settings (OPTIONAL, falls du globale User-Einstellungen abspeichern willst)
         db.execute("""
             CREATE TABLE IF NOT EXISTS user_settings (
                 id INTEGER PRIMARY KEY AUTOINCREMENT,
@@ -94,19 +90,8 @@ def init_db():
                 FOREIGN KEY(user_id) REFERENCES users(id) ON DELETE CASCADE
             );
         """)
-        db.execute("""
-            CREATE TABLE IF NOT EXISTS settings (
-                id INTEGER PRIMARY KEY AUTOINCREMENT,
-                user_id INTEGER NOT NULL,
-                wallpaper TEXT DEFAULT '19.png',
-                city TEXT DEFAULT 'Berlin',
-                show_forecast INTEGER DEFAULT 1,
-                bookmarks TEXT DEFAULT '[]',
-                FOREIGN KEY(user_id) REFERENCES users(id) ON DELETE CASCADE
-            );
-        """)
         db.commit()
-
+        
 # ------------------------------------------------------------
 # HILFSFUNKTIONEN
 # ------------------------------------------------------------
@@ -204,7 +189,7 @@ def login():
             flash("Benutzername oder Passwort falsch!", "red")
     return render_template('login.html')
 
-@app.route('/logout', methods=['POST'])
+@app.route('/logout', methods=['GET', 'POST'])
 def logout():
     session.clear()
     flash("Erfolgreich abgemeldet!", "green")
@@ -397,16 +382,32 @@ def manage_bookmarks(user_id):
     bookmarks = db.execute("SELECT * FROM bookmarks WHERE user_id=?", (user_id,)).fetchall()
     return render_template('admin.html', single_user=user, bookmarks=bookmarks)
 
-@app.route('/admin/delete_bookmark/<int:bookmark_id>/<int:user_id>', methods=['POST'])
+@app.route('/bookmarks/delete/<int:bookmark_id>', methods=['POST'])
-def delete_bookmark(bookmark_id, user_id):
+def delete_bookmark(bookmark_id):
-    if not is_admin():
+    """Löscht ein Lesezeichen, wenn der Benutzer es besitzt oder Admin ist."""
-        flash("Zugriff verweigert!", "red")
+    if 'user_id' not in session:
-        return redirect(url_for('dashboard'))
+        flash("Bitte melde dich an!", "red")
+        return redirect(url_for('login'))
+
+    user_id = session['user_id']
     db = get_db()
+
+    # Prüfen, ob der Benutzer das Lesezeichen besitzt
+    bookmark = db.execute("SELECT user_id FROM bookmarks WHERE id=?", (bookmark_id,)).fetchone()
+    if not bookmark:
+        flash("Lesezeichen nicht gefunden!", "red")
+        return redirect(url_for('dashboard'))
+
+    # Benutzer darf nur eigene Lesezeichen löschen, Admin kann alle löschen
+    if bookmark['user_id'] != user_id and not is_admin():
+        flash("Keine Berechtigung zum Löschen!", "red")
+        return redirect(url_for('dashboard'))
+
     db.execute("DELETE FROM bookmarks WHERE id=?", (bookmark_id,))
     db.commit()
+
     flash("Lesezeichen gelöscht!", "green")
-    return redirect(url_for('manage_bookmarks', user_id=user_id))
+    return redirect(url_for('dashboard'))
 
 # ------------------------------------------------------------
 # ZEITERFASSUNG
@@ -448,6 +449,25 @@ def time_tracking():
 
     return redirect(url_for('dashboard'))
 
+@app.route('/admin/time_tracking', methods=['GET'])
+def admin_time_tracking():
+    if not is_admin():
+        flash("Zugriff verweigert!", "red")
+        return redirect(url_for('dashboard'))
+
+    db = get_db()
+    # Hole alle Zeiteinträge (JOIN mit users, damit wir den username sehen)
+    time_entries = db.execute("""
+        SELECT t.id, t.user_id, t.activity, t.start_time, t.end_time,
+               u.username
+        FROM time_entries t
+        JOIN users u ON t.user_id = u.id
+        ORDER BY t.start_time DESC
+    """).fetchall()
+
+    return render_template('admin_time_entries.html', time_entries=time_entries)
+
+
 # ------------------------------------------------------------
 # DASHBOARD
 # ------------------------------------------------------------
@@ -460,40 +480,54 @@ def dashboard():
     user_id = session['user_id']
     db = get_db()
 
-    # User abfragen
+    # User und Settings ermitteln
     user = db.execute("SELECT * FROM users WHERE id = ?", (user_id,)).fetchone()
     if not user:
         flash("Benutzer nicht gefunden.", "red")
         return redirect(url_for('logout'))
 
-    # Settings aus user_settings
     settings = db.execute("SELECT * FROM user_settings WHERE user_id = ?", (user_id,)).fetchone()
 
-    # Standardwerte
+    # Standardwerte aus settings
     if not settings:
         wallpaper = '19.png'
         city = 'Berlin'
         show_forecast = True
-        bookmarks = []
+        # (Dieses 'bookmarks' ist optional, kannst du weglassen,
+        #  wenn du ausschließlich die DB-Tabelle 'bookmarks' nutzt)
+        bookmarks_setting = []
     else:
         wallpaper = settings['wallpaper']
         city = settings['city']
         show_forecast = bool(settings['show_forecast'])
         if settings['bookmarks']:
-            bookmarks = settings['bookmarks'].split(",")
+            bookmarks_setting = settings['bookmarks'].split(",")  # Nur als Fallback
         else:
-            bookmarks = []
+            bookmarks_setting = []
 
-    # Wetter holen (wenn gewünscht)
+    # DB-Bookmarks für den eingeloggten User
-    current_temp, weather_icon, forecast = get_weather(city)
+    user_bookmarks = db.execute("""
-    if current_temp is None:
+        SELECT id, title, url, icon_class, bg_color 
-        current_temp = "N/A"
+        FROM bookmarks
-        weather_icon = "fa-question"
+        WHERE user_id=?
-        forecast = []
+        ORDER BY id DESC
+    """, (user_id,)).fetchall()
 
-    # Domain, Logo usw.
+    # Notifications für diesen User (user_id) oder globale (user_id IS NULL)
-    domain = "example.com"
+    notifications = db.execute("""
-    logo_path = url_for('static', filename='clickcandit.png')
+        SELECT id, user_id, message, created_at
+        FROM notifications
+        WHERE user_id=? OR user_id IS NULL
+        ORDER BY created_at DESC
+    """, (user_id,)).fetchall()
+
+    # Ggf. Time-Entries (falls du sie zeigen willst)
+    time_entries = db.execute("""
+        SELECT *
+        FROM time_entries
+        WHERE user_id=?
+        ORDER BY start_time DESC
+    """, (user_id,)).fetchall()
 
     # Beispiel-Apps
     user_app_chunks = [
@@ -515,25 +549,83 @@ def dashboard():
         ]
     ]
 
+    # Wetter (Dummy oder API)
+    current_temp, weather_icon, forecast = get_weather(city)
+    if current_temp is None:
+        current_temp = "N/A"
+        weather_icon = "fa-question"
+        forecast = []
+
+    domain = "clickcandit.com/login"
+    logo_path = url_for('static', filename='clickcandit.png')
+
     return render_template(
         'dashboard.html',
         user=user['username'],
         wallpaper=wallpaper,
         city=city,
         show_forecast=show_forecast,
-        bookmarks=bookmarks,
+        bookmarks=bookmarks_setting,  # falls noch gebraucht, sonst weglassen
         current_temp=current_temp,
         weather_icon=weather_icon,
         forecast=forecast,
         domain=domain,
         logo_path=logo_path,
-        user_app_chunks=user_app_chunks
+        user_app_chunks=user_app_chunks,
+        # Hier die neuen Variablen:
+        user_bookmarks=user_bookmarks,
+        notifications=notifications,
+        time_entries=time_entries
     )
 
 # ------------------------------------------------------------
 # SUPPORT & SETTINGS ROUTEN (Aus V1)
 # ------------------------------------------------------------
 
+@app.route('/delete_notification/<int:notif_id>', methods=['POST'])
+def delete_notification(notif_id):
+    if 'user_id' not in session:
+        flash("Bitte melde dich an!", "red")
+        return redirect(url_for('login'))
+
+    user_id = session['user_id']
+    db = get_db()
+
+    # Prüfen, ob die Notification existiert
+    row = db.execute("""
+        SELECT user_id
+        FROM notifications
+        WHERE id=?
+    """, (notif_id,)).fetchone()
+
+    if not row:
+        flash("Benachrichtigung existiert nicht.", "red")
+        return redirect(url_for('dashboard'))
+
+    # Wenn user_id = NULL => globale Notification
+    # Du kannst selbst definieren, ob jeder sie löschen darf oder nur Admin
+    # Hier: Jeder kann globale Notification löschen, wenn er sie sieht.
+    # Oder du sagst: Nur Admin kann globale Notis löschen -> if row['user_id'] is None and not is_admin(): ...
+    if row['user_id'] is None:
+        # Optional: Nur Admin löschen
+        if not is_admin():
+            flash('Nicht erlaubt', 'red')
+            return redirect(url_for('dashboard'))
+        pass
+    else:
+        # Wenn es eine user-spezifische Notification ist: user_id muss übereinstimmen
+        if row['user_id'] != user_id:
+            flash("Keine Berechtigung, diese Benachrichtigung zu löschen.", "red")
+            return redirect(url_for('dashboard'))
+
+    # Benachrichtigung löschen
+    db.execute("DELETE FROM notifications WHERE id=?", (notif_id,))
+    db.commit()
+
+    flash("Benachrichtigung gelöscht!", "green")
+    return redirect(url_for('dashboard'))
+
+
 @app.route('/send_support_message', methods=['POST'])
 def send_support_message():
     """
@@ -580,12 +672,124 @@ def get_settings():
     else:
         # Falls noch kein Datensatz existiert
         return jsonify({
-            "wallpaper": "1.png",
+            "wallpaper": "24.png",
             "city": "",
             "show_forecast": False,
             "bookmarks": []
         })
 
+@app.context_processor
+def inject_wallpaper():
+    """
+    Dieser Context Processor wird bei jedem Template-Aufruf ausgeführt.
+    Ermittelt das Wallpaper des eingeloggten Benutzers (falls eingeloggt)
+    und stellt es allen Templates als Variable 'WALLPAPER_URL' bereit.
+    """
+    if 'user_id' in session:
+        db = get_db()
+        row = db.execute("SELECT wallpaper FROM user_settings WHERE user_id=?", (session['user_id'],)).fetchone()
+        if row and row['wallpaper']:
+            # Bsp: row['wallpaper'] könnte '19.png' o. ä. sein
+            return {
+                "WALLPAPER_URL": url_for('static', filename=row['wallpaper'])
+            }
+    # Fallback: Wenn User nicht eingeloggt oder kein Wallpaper gesetzt
+    return {
+        "WALLPAPER_URL": url_for('static', filename='24.png')
+    }
+
+@app.route('/admin/notifications/multi', methods=['POST'])
+def add_notification_multi():
+    if not is_admin():
+        flash("Zugriff verweigert!", "red")
+        return redirect(url_for('dashboard'))
+
+    message = request.form.get('message')
+    target_list = request.form.getlist('target_users')  # ['all'] oder ['1','2'] etc.
+
+    if not message:
+        flash("Bitte eine Nachricht eingeben.", "red")
+        return redirect(url_for('admin_panel'))
+
+    db = get_db()
+
+    # Wenn 'all' in der Liste, Notification für alle
+    if 'all' in target_list:
+        db.execute("INSERT INTO notifications (user_id, message) VALUES (NULL, ?)", (message,))
+    else:
+        # Sonst für jede ausgewählte ID
+        for uid in target_list:
+            db.execute("INSERT INTO notifications (user_id, message) VALUES (?, ?)", (uid, message))
+
+    db.commit()
+    flash("Benachrichtigungen erstellt!", "green")
+    return redirect(url_for('admin_panel'))
+
+# ------------------------------------------------------------
+# BENUTZER-LESEZEICHEN (nur für sich selbst)
+# ------------------------------------------------------------
+
+@app.route('/bookmarks/add', methods=['POST'])
+def add_bookmark():
+    if 'user_id' not in session:
+        flash("Bitte melde dich an!", "red")
+        return redirect(url_for('login'))
+
+    user_id = session['user_id']
+    title = request.form.get('title')
+    url_ = request.form.get('url')
+    icon_class = request.form.get('icon_class', 'fas fa-bookmark')
+    bg_color = request.form.get('bg_color', 'bg-blue-500')  # Standardfarbe
+
+    if not title or not url_:
+        flash("Bitte Titel und URL angeben!", "red")
+        return redirect(url_for('dashboard'))
+
+    db = get_db()
+    db.execute(
+        "INSERT INTO bookmarks (user_id, title, url, icon_class, bg_color) VALUES (?, ?, ?, ?, ?)",
+        (user_id, title, url_, icon_class, bg_color)
+    )
+    db.commit()
+
+    flash("Lesezeichen erfolgreich hinzugefügt!", "green")
+    return redirect(url_for('dashboard'))
+
+
+
+@app.route('/admin/bookmarks/multi', methods=['POST'])
+def add_bookmarks_multi():
+    if not is_admin():
+        flash("Zugriff verweigert!", "red")
+        return redirect(url_for('dashboard'))
+
+    # Checkboxen im Template: name='target_users'
+    target_list = request.form.getlist('target_users')  # Liste der IDs (Strings)
+    title = request.form.get('title')
+    url_ = request.form.get('url')
+    icon = request.form.get('icon_class', 'fas fa-bookmark')
+
+    # Ggf. Validierung
+    if not title or not url_:
+        flash("Bitte Titel und URL angeben!", "red")
+        return redirect(url_for('admin_panel'))
+    if not target_list:
+        flash("Bitte mindestens einen Benutzer auswählen!", "red")
+        return redirect(url_for('admin_panel'))
+    icon = request.form.get('icon_class')
+
+    db = get_db()
+    for uid in target_list:
+        db.execute(
+            "INSERT INTO bookmarks (user_id, title, url, icon_class) VALUES (?, ?, ?, ?)",
+            (uid, title, url_, icon)
+        )
+    db.commit()
+
+    flash("Neues Lesezeichen für mehrere Benutzer hinzugefügt!", "green")
+    return redirect(url_for('admin_panel'))
+
+
 @app.route('/save_settings', methods=['POST'])
 def save_settings():
     """
@@ -596,7 +800,7 @@ def save_settings():
         return jsonify({"success": False, "error": "not logged in"}), 403
 
     data = request.get_json()
-    wallpaper = data.get('wallpaper', '1.png')
+    wallpaper = data.get('wallpaper', '24.png')
     city = data.get('city', '')
     show_forecast = data.get('show_forecast', False)
     bookmarks_list = data.get('bookmarks', [])
@@ -637,4 +841,4 @@ def get_weather(city):
 # ------------------------------------------------------------
 if __name__ == '__main__':
     init_db()
-    app.run(debug=True)
+    app.run(debug=True, port=9559, host="0.0.0.0")

Dashboard_V2/docker-compose.yml

@@ -0,0 +1,17 @@
+version: "3.7"
+services:
+  web:
+    build: .
+    ports:
+      - "9559:9559"
+    volumes:
+      - ./clickcandit.db:/app/clickcandit.db
+      - ./:/app
+    environment:
+      - FLASK_ENV=production
+      - SMTP_SERVER=smtp.gmail.com
+      - SMTP_PORT=465
+      - EMAIL_SENDER=clickcandit@gmail.com
+      - EMAIL_PASSWORD=iuxexntistlwilhl
+      - APP_SECRET_KEY=fiudsh9uw4hefjsefnjdsdh
+    restart: always

Dashboard_V2/requirements.txt

@@ -1,2 +1,3 @@
-Flask
+Werkzeug
-Werkzeug
+Flask>=2.2
+gunicorn

Dashboard_V2/templates/admin.html

@@ -1,149 +1,181 @@
-<!-- templates/admin.html -->
 {% extends "base.html" %}
-{% block title %}Admin-Bereich{% endblock %}
+{% block title %}
+Admin-Bereich
+{% endblock title %}
 
 {% block content %}
-<div class="container mx-auto p-4 sm:p-6 lg:p-8">
+<div class="container mx-auto px-4 sm:px-6 lg:px-8 py-10">
-    <h1 class="text-3xl font-bold mb-6">Admin-Bereich</h1>
+  <h1 class="text-3xl font-bold text-center mb-8">Admin-Bereich</h1>
 
-    {% with messages = get_flashed_messages(with_categories=true) %}
+  <!-- Flash-Messages -->
-      {% if messages %}
+  {% with messages = get_flashed_messages(with_categories=true) %}
-        {% for category, message in messages %}
+    {% if messages %}
-          <div class="bg-{{category}}-500 text-white p-2 rounded mb-2">
+      {% for category, message in messages %}
-            {{ message }}
+        <div class="bg-{{ category }}-500 text-white p-3 rounded mb-4">
-          </div>
+          {{ message }}
-        {% endfor %}
+        </div>
-      {% endif %}
+      {% endfor %}
-    {% endwith %}
+    {% endif %}
+  {% endwith %}
 
-    <!-- Benutzer anlegen -->
+  <!-- Grid Layout für Boxen -->
-    <div class="glassmorphism p-4 rounded shadow-lg mb-8">
+  <div class="grid gap-8 sm:grid-cols-1 md:grid-cols-2 xl:grid-cols-4">
-      <h2 class="text-xl font-semibold mb-2">Neuen Benutzer anlegen</h2>
+    <!-- NEUEN BENUTZER ANLEGEN -->
+    <div class="glassmorphism p-6 rounded shadow flex flex-col">
+      <h2 class="text-xl font-semibold mb-4">Neuen Benutzer anlegen</h2>
       <form method="POST" action="{{ url_for('admin_panel') }}" class="space-y-4">
-          <div>
+        <div>
-              <label class="block mb-1">Benutzername</label>
+          <label class="block mb-1 font-medium">Benutzername:</label>
-              <input type="text" name="new_username" class="p-2 border rounded w-full" required>
+          <input type="text" name="new_username" required class="w-full p-3 rounded border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-400" />
-          </div>
+        </div>
-          <div>
+        <div>
-              <label class="block mb-1">Passwort</label>
+          <label class="block mb-1 font-medium">Passwort:</label>
-              <input type="password" name="new_password" class="p-2 border rounded w-full" required>
+          <input type="password" name="new_password" required class="w-full p-3 rounded border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-400" />
-          </div>
+        </div>
-          <div>
+        <div class="flex items-center space-x-2">
-              <label class="inline-flex items-center">
+          <input type="checkbox" name="new_is_admin" class="h-5 w-5 rounded border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-400" />
-                  <input type="checkbox" name="new_is_admin" class="form-checkbox h-5 w-5 text-blue-600" />
+          <span class="font-medium">Als Admin markieren</span>
-                  <span class="ml-2">Als Admin markieren</span>
+        </div>
-              </label>
+        <button type="submit" class="bg-green-600 hover:bg-green-700 text-white py-3 px-6 rounded shadow transition duration-200">
-          </div>
+          Erstellen
-          <button type="submit" class="bg-green-500 text-white py-2 px-4 rounded hover:bg-green-600">
+        </button>
-              Erstellen
-          </button>
       </form>
     </div>
-
+    
-    <!-- Benutzerübersicht -->
+    <!-- BENUTZERVERWALTUNG -->
-    <div class="glassmorphism p-4 rounded shadow-lg mb-8">
+    <div style="background-color: transparent !important;" class="glassmorphism p-6 rounded shadow flex flex-col">
-      <h2 class="text-xl font-semibold mb-2">Benutzerverwaltung</h2>
+      <h2 class="text-xl font-semibold mb-4">Benutzerverwaltung</h2>
-      <table class="w-full table-auto">
+      <div class="overflow-x-auto">
-        <thead>
+        <table class="w-full table-auto">
-          <tr class="border-b">
+          <thead>
-            <th class="px-2 py-1">ID</th>
+            <tr class="border-b">
-            <th class="px-2 py-1">Username</th>
+              <th class="p-3 text-left">ID</th>
-            <th class="px-2 py-1">Admin?</th>
+              <th class="p-3 text-left">Username</th>
-            <th class="px-2 py-1"></th>
+              <th class="p-3 text-left">Admin?</th>
-          </tr>
+              <th class="p-3 text-left">Aktion</th>
-        </thead>
+            </tr>
-        <tbody>
+          </thead>
-          {% for u in users %}
+          <tbody>
-          <tr class="border-b">
+            {% for u in users %}
-            <td class="px-2 py-1">{{ u.id }}</td>
+            <tr class="border-b">
-            <td class="px-2 py-1">{{ u.username }}</td>
+              <td class="p-3">{{ u.id }}</td>
-            <td class="px-2 py-1">{{ 'Ja' if u.is_admin else 'Nein' }}</td>
+              <td class="p-3">{{ u.username }}</td>
-            <td class="px-2 py-1 text-right">
+              <td class="p-3">{{ 'Ja' if u.is_admin else 'Nein' }}</td>
-              {% if u.id != session.user_id %}
+              <td class="p-3 space-x-2">
-              <form method="POST" action="{{ url_for('delete_user', user_id=u.id) }}" onsubmit="return confirm('Benutzer wirklich löschen?')">
+                <a href="{{ url_for('manage_bookmarks', user_id=u.id) }}"
-                  <button class="bg-red-500 text-white px-2 py-1 rounded hover:bg-red-600 text-sm">
+                style="margin: 10px !important;" class="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded text-sm transition duration-200">
-                      Löschen
+                   Lesezeichen
+                </a>
+                <form method="POST" action="{{ url_for('delete_user', user_id=u.id) }}" class="inline"
+                      onsubmit="return confirm('Benutzer wirklich löschen?')">
+                  <button style="margin: 10px !important;" class="bg-red-500 text-white px-4 py-2 rounded text-sm transition duration-200">
+                    Löschen
                   </button>
-              </form>
+                </form>
-              {% else %}
+              </td>
-                <span class="text-xs text-gray-400">[Eigener Account]</span>
+            </tr>
-              {% endif %}
+            {% endfor %}
-              <a href="{{ url_for('manage_bookmarks', user_id=u.id) }}" class="ml-3 bg-blue-500 text-white px-2 py-1 rounded hover:bg-blue-600 text-sm">
+          </tbody>
-                Lesezeichen
+        </table>
-              </a>
+      </div>
-            </td>
+    </div>
-          </tr>
+
+    <!-- BENACHRICHTIGUNG ERSTELLEN (MULTI-USER) -->
+    <div class="glassmorphism p-6 rounded shadow flex flex-col">
+      <h2 class="text-xl font-semibold mb-4">Benachrichtigung erstellen</h2>
+      <form method="POST" action="{{ url_for('add_notification_multi') }}" class="space-y-4">
+        <div>
+          <label class="block mb-1 font-medium">Nachricht:</label>
+          <textarea name="message" rows="3" required class="w-full p-3 rounded border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-400"></textarea>
+        </div>
+        <div>
+          <p class="mb-2 font-medium">Für welche Benutzer?</p>
+          <div class="flex flex-wrap gap-2">
+            <label class="inline-flex items-center gap-1 bg-gray-200 dark:bg-gray-800 p-2 rounded cursor-pointer"
+                   for="notify_all">
+              <input type="checkbox" id="notify_all" name="target_users" value="all" class="h-5 w-5 rounded border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-400" />
+              Alle
+            </label>
+            {% for u in users %}
+            <label class="inline-flex items-center gap-1 bg-gray-200 dark:bg-gray-800 p-2 rounded cursor-pointer">
+              <input type="checkbox" name="target_users" value="{{ u.id }}" class="h-5 w-5 rounded border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-400" />
+              {{ u.username }}
+            </label>
+            {% endfor %}
+          </div>
+        </div>
+        <button type="submit" class="bg-purple-500 hover:bg-purple-600 text-white px-6 py-3 rounded shadow transition duration-200">
+          Senden
+        </button>
+      </form>
+    </div>
+    
+    <!-- LESEZEICHEN-VERWALTUNG (MULTI-USER) -->
+    <div class="glassmorphism p-6 rounded shadow flex flex-col">
+      <h2 class="text-xl font-semibold mb-4">Lesezeichen-Verwaltung</h2>
+      <form method="POST" action="{{ url_for('add_bookmarks_multi') }}" class="space-y-4">
+        <p class="font-medium">Für welche Benutzer soll das Lesezeichen gelten?</p>
+        <div class="flex flex-wrap gap-2">
+          {% for u in users %}
+          <label class="inline-flex items-center gap-1 bg-gray-200 dark:bg-gray-800 p-2 rounded cursor-pointer">
+            <input type="checkbox" name="target_users" value="{{ u.id }}" class="h-5 w-5 rounded border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-400" />
+            {{ u.username }}
+          </label>
           {% endfor %}
-        </tbody>
+        </div>
-      </table>
+        <div>
-    </div>
+          <label class="block mb-1 font-medium">Titel:</label>
-
+          <input type="text" name="title" required class="w-full p-3 rounded border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-400" />
-    <!-- Benachrichtigung erstellen -->
+        </div>
-    <div class="glassmorphism p-4 rounded shadow-lg mb-8">
+        <div>
-      <h2 class="text-xl font-semibold mb-2">Benachrichtigung erstellen</h2>
+          <label class="block mb-1 font-medium">URL:</label>
-      <form method="POST" action="{{ url_for('add_notification') }}" class="space-y-4">
+          <input type="text" name="url" required class="w-full p-3 rounded border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-400" />
-          <div>
+        </div>
-              <label class="block mb-1">Nachricht</label>
+        <div>
-              <textarea name="message" class="p-2 border rounded w-full" rows="2" required></textarea>
+          <label class="block mb-1 font-medium">Icon (FontAwesome CSS-Klasse):</label>
-          </div>
+          <input type="text" name="icon_class" placeholder="z.B. fas fa-user" class="w-full p-3 rounded border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-400" />
-          <div>
+        </div>
-              <label class="block mb-1">Für Benutzer</label>
+        <button type="submit" class="bg-green-600 hover:bg-green-700 text-white px-6 py-3 rounded shadow transition duration-200">
-              <select name="user_id" class="p-2 border rounded w-full">
+          Hinzufügen
-                  <option value="all">Alle</option>
+        </button>
-                  {% for u in users %}
-                    <option value="{{ u.id }}">{{ u.username }}</option>
-                  {% endfor %}
-              </select>
-          </div>
-          <button type="submit" class="bg-purple-500 text-white py-2 px-4 rounded hover:bg-purple-600">
-              Senden
-          </button>
-      </form>
-    </div>
-
-    <!-- Falls man Lesezeichen für EINEN User verwaltet -->
-    {% if single_user is defined and single_user %}
-    <div class="glassmorphism p-4 rounded shadow-lg mb-8">
-      <h2 class="text-xl font-semibold mb-2">
-        Lesezeichen für {{ single_user.username }}
-      </h2>
-      <form method="POST" class="space-y-4">
-          <div>
-              <label class="block mb-1">Titel</label>
-              <input type="text" name="title" class="p-2 border rounded w-full" required>
-          </div>
-          <div>
-              <label class="block mb-1">URL</label>
-              <input type="text" name="url" class="p-2 border rounded w-full" required>
-          </div>
-          <div>
-              <label class="block mb-1">Icon (FontAwesome CSS-Klasse)</label>
-              <input type="text" name="icon_class" class="p-2 border rounded w-full" placeholder="z.B. fas fa-user">
-          </div>
-          <button type="submit" class="bg-green-500 text-white py-2 px-4 rounded hover:bg-green-600">
-              Hinzufügen
-          </button>
       </form>
 
-      <!-- Tabelle der vorhandenen Bookmarks -->
+      {% if single_user and bookmarks %}
-      <ul class="mt-4 space-y-2">
+      <p class="mt-6 mb-4 font-semibold">Lesezeichen für {{ single_user.username }}:</p>
+      <ul class="space-y-3">
         {% for bm in bookmarks %}
-        <li class="bg-gray-100 dark:bg-gray-700 p-2 rounded flex justify-between items-center">
+        <li class="bg-gray-200 dark:bg-gray-800 p-3 rounded flex justify-between items-center">
           <div>
             <i class="{{ bm.icon_class }} mr-2"></i>
-            <a href="{{ bm.url }}" target="_blank" class="text-blue-600 hover:underline">{{ bm.title }}</a>
+            <a href="{{ bm.url }}" target="_blank" class="text-blue-500 hover:underline">
+              {{ bm.title }}
+            </a>
           </div>
-          <form method="POST" action="{{ url_for('delete_bookmark', bookmark_id=bm.id, user_id=single_user.id) }}" onsubmit="return confirm('Lesezeichen wirklich löschen?')">
+          <form method="POST"
-            <button class="text-red-500 hover:text-red-700"><i class="fas fa-trash-alt"></i></button>
+                action="{{ url_for('delete_bookmark', bookmark_id=bm.id, user_id=single_user.id) }}"
+                onsubmit="return confirm('Lesezeichen wirklich löschen?')">
+            <button class="text-red-500 hover:text-red-700 transition duration-200">
+              <i class="fas fa-trash-alt"></i>
+            </button>
           </form>
         </li>
         {% endfor %}
       </ul>
+      {% else %}
+      <p class="text-sm text-gray-400 mt-6">Wähle oben in der Benutzerverwaltung „Lesezeichen“ für einen Nutzer aus, um konkrete Einträge zu sehen.</p>
+      {% endif %}
     </div>
-    {% endif %}
+    <a href="{{ url_for('admin_time_tracking') }}"
-
+      class="bg-blue-500 hover:bg-blue-600 text-white px-3 py-1 rounded text-sm">
-    <a href="{{ url_for('dashboard') }}" class="inline-block bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">
+      Zeiterfassung einsehen
-      Zurück zum Dashboard
     </a>
+
+    
+  </div> <!-- Grid Ende -->
+
+  <a href="{{ url_for('dashboard') }}"
+     class="inline-block bg-blue-500 hover:bg-blue-600 text-white px-6 py-3 rounded shadow transition duration-200 mt-8">
+    Zurück zum Dashboard
+  </a>
 </div>
 {% endblock content %}

Dashboard_V2/templates/admin_time_entries.html

@@ -0,0 +1,64 @@
+{% extends "base.html" %}
+{% block title %}Zeiterfassung aller Benutzer{% endblock title %}
+
+{% block content %}
+<div class="container mx-auto py-8 px-4">
+    <h1 class="text-2xl font-bold mb-4">Zeiterfassung (alle Benutzer)</h1>
+
+    {% with messages = get_flashed_messages(with_categories=true) %}
+      {% if messages %}
+        {% for category, message in messages %}
+          <div class="bg-{{category}}-500 text-white p-2 mb-2 rounded">
+            {{ message }}
+          </div>
+        {% endfor %}
+      {% endif %}
+    {% endwith %}
+
+    <div class="overflow-x-auto">
+      <table class="table-auto w-full text-left">
+        <thead>
+          <tr class="border-b">
+            <th class="px-2 py-1">ID</th>
+            <th class="px-2 py-1">Benutzer</th>
+            <th class="px-2 py-1">Aktivität</th>
+            <th class="px-2 py-1">Start</th>
+            <th class="px-2 py-1">Ende</th>
+            <th class="px-2 py-1">Dauer</th>
+          </tr>
+        </thead>
+        <tbody>
+          {% for entry in time_entries %}
+          <tr class="border-b">
+            <td class="px-2 py-1">{{ entry.id }}</td>
+            <td class="px-2 py-1">{{ entry.username }}</td>
+            <td class="px-2 py-1">{{ entry.activity }}</td>
+            <td class="px-2 py-1">{{ entry.start_time }}</td>
+            <td class="px-2 py-1">
+              {% if entry.end_time %}
+                  {{ entry.end_time }}
+              {% else %}
+                  <span class="text-sm text-gray-600">läuft …</span>
+              {% endif %}
+            </td>
+            <td class="px-2 py-1">
+              {% if entry.end_time %}
+                  <!-- Beispielhafter Zeitunterschied in Minuten -->
+                  {% set duration = (entry.end_time|datetime - entry.start_time|datetime).total_seconds() / 60 %}
+                  {{ duration|round(2) }} Minuten
+              {% else %}
+                  ...
+              {% endif %}
+            </td>
+          </tr>
+          {% endfor %}
+        </tbody>
+      </table>
+    </div>
+
+    <a href="{{ url_for('admin_panel') }}"
+       class="inline-block bg-blue-500 text-white px-4 py-2 rounded mt-4 hover:bg-blue-600">
+      Zurück zum Admin-Menü
+    </a>
+</div>
+{% endblock content %}

Dashboard_V2/templates/base.html

@@ -5,12 +5,12 @@
   <meta charset="UTF-8">
   <title>{% block title %}Meine App{% endblock %}</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  
+
   <!-- Tailwind + FontAwesome + GSAP -->
   <script src="https://cdn.tailwindcss.com"></script>
   <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet">
   <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.9.1/gsap.min.js"></script>
-  
+
   <!-- Dark-Mode-Einstellung -->
   <script>
       tailwind.config = {
@@ -37,7 +37,7 @@
       background: rgba(255, 255, 255, 0.1);
       backdrop-filter: blur(10px);
       border: 1px solid rgba(255, 255, 255, 0.2);
-      border-radius: 10px;
+      border-radius: 15px !important;
     }
     .dark .glassmorphism {
       background: rgba(0, 0, 0, 0.2);
@@ -66,9 +66,9 @@
   </style>
 </head>
 <body class="min-h-screen bg-gray-100 dark:bg-gray-900 text-gray-800 dark:text-gray-100 transition-colors duration-300"
-      style="background-image: url('{{ url_for('static', filename='1.png') }}');">
+      style="background-image: url('{{ WALLPAPER_URL }}');">
 
-  {% block content %}{% endblock %}
+  {% block content %}{% endblock content %}
 
   <script>
     // Dark Mode init
@@ -79,4 +79,4 @@
   </script>
 
 </body>
-</html>
+</html>

Dashboard_V2/templates/dashboard.html

@@ -24,15 +24,14 @@
 
   <!-- Websuche: ohne Input-BG/Border -->
   <div class="glassmorphism p-4 shadow-lg mb-6 w-full max-w-lg">
-    <form id="searchForm" style="background-color: transparent !important;" class="flex flex-col sm:flex-row items-center justify-center">
+    <form id="searchForm" style="background-color: transparent !important; padding-bottom: 2px;" class="flex flex-col sm:flex-row items-center justify-center">
-      <input type="text"  style="background-color: transparent !important;" id="searchInput" placeholder="Suche..."
+      <input type="text" style="background-color: transparent !important; padding-bottom: 2px !important;" id="searchInput" placeholder="Suche..."
-             class="flex-grow bg-transparent border-0 outline-none placeholder-gray-500 text-gray-800
+             class="flex-grow bg-transparent border-0 outline-none placeholder-gray-500 text-gray-800 dark:placeholder-gray-300" />
-                    dark:placeholder-gray-300" />
+      <select id="searchEngine" style="background-color: transparent !important; padding-bottom: 2px !important;" class="bg-transparent border-0 outline-none text-gray-800 dark:text-white ml-2">
-      <select id="searchEngine" style="background-color: transparent !important;" class="bg-transparent border-0 outline-none text-gray-800 dark:text-white ml-2">
           <option value="qwant">Qwant</option>
           <option value="google">Google</option>
       </select>
-      <button type="submit" class="bg-green-500 text-white px-4 py-2 rounded hover:bg-green-600 ml-2">
+      <button type="submit" class="bg-green-500 text-white px-2 py-2 rounded hover:bg-green-600 ml-2">
         Los
       </button>
     </form>
@@ -43,7 +42,7 @@
       {% if messages %}
           <div class="mb-4 w-full max-w-lg">
               {% for category, message in messages %}
-              <div class="alert flex items-center bg-{{ category }}-500 text-white text-sm font-bold px-4 py-3 mb-2"
+              <div style="border-radius: 15px !important;" class="alert flex items-center bg-{{ category }}-500 text-white text-sm font-bold px-4 py-3 mb-2"
                    role="alert">
                   <p>{{ message }}</p>
                   <svg class="fill-current h-6 w-6 text-white ml-auto close-flash" role="button"
@@ -68,12 +67,21 @@
           <h2 class="text-lg font-semibold mb-2">Benachrichtigungen</h2>
           {% if notifications %}
               <ul class="space-y-2 max-h-56 overflow-auto">
-                  {% for note in notifications %}
+                {% for note in notifications %}
-                      <li class="bg-gray-100 dark:bg-gray-700 p-2 rounded">
+                    <li class="bg-gray-100 dark:bg-gray-700 p-2 rounded flex justify-between items-center">
-                          {{ note.message }}<br>
+                        <div>
-                          <span class="text-xs text-gray-500">{{ note.created_at }}</span>
+                            {{ note.message }}<br>
-                      </li>
+                            <span class="text-xs text-gray-500">{{ note.created_at }}</span>
-                  {% endfor %}
+                        </div>
+                        <form method="POST" action="{{ url_for('delete_notification', notif_id=note.id) }}"
+                            onsubmit="return confirm('Benachrichtigung wirklich löschen?')"
+                            class="inline">
+                            <button class="text-red-500 hover:text-red-700 text-sm ml-2" title="Benachrichtigung löschen">
+                                <i class="fas fa-times"></i>
+                            </button>
+                        </form>
+                    </li>
+                {% endfor %}              
               </ul>
           {% else %}
               <p class="text-sm">Keine neuen Benachrichtigungen</p>
@@ -85,7 +93,7 @@
           <h2 class="text-lg font-semibold mb-2">Zeiterfassung</h2>
           <form action="{{ url_for('time_tracking') }}" method="POST"
                 class="mb-4 flex flex-col sm:flex-row items-center">
-              <input type="text" name="activity" placeholder="Aktivität"
+              <input type="text" name="activity" style="border-bottom: solid rgb(240, 222, 222) !important; border-top: none !important; border-left: none !important; border-right: none !important; background-color: transparent !important;" placeholder="Aktivität"
                      class="p-2 border rounded mb-2 sm:mb-0 sm:mr-2 flex-1 text-gray-800" />
               <button type="submit" name="action" value="start"
                       class="bg-green-500 text-white px-4 py-2 rounded hover:bg-green-600 mr-2">
@@ -108,153 +116,225 @@
       </div>
   </div>
 
-  <!-- App Carousel (für Lesezeichen) -->
+  <!-- Bookmark Carousel -->
   <div class="glassmorphism p-4 mb-12 relative w-full max-w-3xl rounded">
-      <div id="appCarousel" class="overflow-hidden">
+    <div id="carouselContainer" class="overflow-hidden relative">
-          <div class="flex transition-transform duration-300 ease-in-out">
+        <div id="carouselTrack" class="flex transition-transform duration-500 ease-in-out">
-              <div class="w-full flex-shrink-0">
+            {% for chunk in user_bookmarks | batch(5) %}
-                  <div class="grid grid-cols-3 sm:grid-cols-5 gap-4">
+            <div class="carousel-slide w-full flex-shrink-0 grid grid-cols-3 sm:grid-cols-5 gap-4">
-                      {% for bm in user_bookmarks %}
+                {% for bm in chunk %}
-                      <a href="{{ bm.url }}" class="flex flex-col items-center" title="{{ bm.title }}" target="_blank">
+                <div class="relative group">
-                          <div class="w-12 h-12 flex items-center justify-center bg-blue-500 rounded-xl mb-1
+                    <a href="{{ bm.url }}" class="flex flex-col items-center" title="{{ bm.title }}" target="_blank">
-                                      transition-transform hover:scale-110">
+                        <!-- Hier wurde "fas" vorangestellt, um sicherzustellen, dass FontAwesome-Icons korrekt angezeigt werden -->
-                              <i class="{{ bm.icon_class }} text-white text-xl"></i>
+                        <div class="w-12 h-12 flex items-center justify-center {{ bm.bg_color }} rounded-xl mb-1 transition-transform hover:scale-110">
-                          </div>
+                            <i class="fas {{ bm.icon_class }} text-white text-xl"></i>
-                          <p class="text-center text-xs font-medium">{{ bm.title }}</p>
+                        </div>                        
-                      </a>
+                        <p class="text-center text-xs font-medium">{{ bm.title }}</p>
-                      {% endfor %}
+                    </a>
-                  </div>
+                    <!-- Löschen-Button -->
-              </div>
+                    <form method="POST" action="{{ url_for('delete_bookmark', bookmark_id=bm.id) }}"
-          </div>
+                          onsubmit="return confirm('Lesezeichen wirklich löschen?')"
-      </div>
+                          class="absolute top-0 right-0 p-1 hidden group-hover:block">
-  </div>
+                        <button class="text-red-500 hover:text-red-700 text-sm" title="Lesezeichen löschen">
-</div>
+                            <i class="fas fa-times"></i>
-
+                        </button>
-<!-- Dock -->
+                    </form>
-<div class="fixed bottom-4 left-1/2 transform -translate-x-1/2 glassmorphism p-2 flex space-x-4 rounded">
+                </div>
-  <!-- Home Modal -->
+                {% endfor %}
-  <button class="dock-icon w-12 h-12 flex items-center justify-center bg-blue-500 hover:bg-blue-600 rounded-xl
+            </div>
-                 transition-colors duration-200" data-modal="homeModal">
-      <i class="fas fa-home text-white text-xl"></i>
-  </button>
-
-  <!-- Support-Button (öffnet Support-Modal V1) -->
-  <button class="dock-icon w-12 h-12 flex items-center justify-center bg-purple-500 hover:bg-purple-600 rounded-xl
-                 transition-colors duration-200" data-modal="supportModal">
-      <i class="fas fa-question-circle text-white text-xl"></i>
-  </button>
-
-  <!-- Admin-Button nur zeigen, wenn is_admin == 1 -->
-  {% if session.is_admin == 1 %}
-  <a href="{{ url_for('admin_panel') }}"
-     class="dock-icon w-12 h-12 flex items-center justify-center bg-yellow-500 hover:bg-yellow-600 rounded-xl
-            transition-colors duration-200">
-      <i class="fas fa-user-shield text-white text-xl"></i>
-  </a>
-  {% endif %}
-  
-  <!-- Einstellungen (öffnet Settings-Modal V1) -->
-  <button class="dock-icon w-12 h-12 flex items-center justify-center bg-yellow-700 hover:bg-yellow-800 rounded-xl
-                 transition-colors duration-200" data-modal="settingsModal">
-      <i class="fas fa-cog text-white text-xl"></i>
-  </button>
-</div>
-
-<!-- =========================== MODALS =========================== -->
-
-<!-- Home Modal -->
-<div id="homeModal" class="fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center z-50">
-    <div class="glassmorphism bg-white dark:bg-gray-800 p-6 rounded max-w-md w-full mx-auto">
-        <h2 class="text-2xl font-bold mb-4">Willkommen Zuhause!</h2>
-        <p class="mb-4">Schneller Zugriff auf wichtige Einstellungen.</p>
-        <!-- z.B. Logout oder Konto löschen -->
-        <form action="{{ url_for('logout') }}" method="POST" class="mb-3 mt-2">
-            <button type="submit" class="w-full bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
-                Abmelden
-            </button>
-        </form>
-        <button class="mt-4 bg-gray-300 dark:bg-gray-700 hover:bg-gray-400 dark:hover:bg-gray-800 text-gray-800 dark:text-white
-                       font-bold py-2 px-4 rounded close-modal">
-            Schließen
-        </button>
-    </div>
-</div>
-
-<!-- Support Modal (aus V1, mit ProblemType/E-Mail/Nachricht + sendSupportMessage) -->
-<div id="supportModal" class="fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center z-50">
-    <div class="glassmorphism bg-white dark:bg-gray-800 p-8 rounded-lg max-w-md w-full mx-auto shadow-lg">
-        <h2 class="text-2xl font-bold mb-4">Support kontaktieren</h2>
-        
-        <!-- Dropdown zur Kategorisierung des Problems -->
-        <label for="problemType" class="block mb-2 text-lg font-semibold">Art des Problems</label>
-        <select id="problemType" class="w-full p-2 border rounded mb-4 text-gray-800 dark:bg-gray-700 dark:text-white">
-            <option value="Technisches Problem">Technisches Problem</option>
-            <option value="Account Problem">Account Problem</option>
-            <option value="Sonstiges">Sonstiges</option>
-        </select>
-
-        <!-- Eingabefeld für E-Mail -->
-        <label for="emailInput" class="block mb-2 text-lg font-semibold">Ihre E-Mail</label>
-        <input type="email" id="emailInput" class="w-full p-2 border rounded mb-4 text-gray-800 dark:bg-gray-700 dark:text-white"
-               placeholder="Ihre E-Mail-Adresse" />
-
-        <!-- Eingabefeld für Nachricht -->
-        <label for="messageInput" class="block mb-2 text-lg font-semibold">Nachricht</label>
-        <textarea id="messageInput" class="w-full p-2 border rounded mb-4 text-gray-800 dark:bg-gray-700 dark:text-white" rows="4"
-                  placeholder="Beschreiben Sie Ihr Problem"></textarea>
-
-        <!-- Button zum Senden der Nachricht -->
-        <button id="sendSupportMessage" class="bg-purple-500 text-white px-4 py-2 rounded hover:bg-purple-600 transition-colors duration-200">
-            Nachricht senden
-        </button>
-
-        <!-- Schließen-Button -->
-        <button class="mt-4 bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600 transition-colors duration-200 close-modal">
-            Schließen
-        </button>
-    </div>
-</div>
-
-<!-- Settings Modal (aus V1, mit Wallpaper-Auswahl, Stadt, etc.) -->
-<div id="settingsModal" class="fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center overflow-auto z-50">
-    <div class="glassmorphism bg-white dark:bg-gray-800 p-6 rounded-lg w-full max-w-md max-h-screen overflow-y-auto mx-4 shadow-lg">
-        <h2 class="text-2xl font-bold mb-4">Einstellungen</h2>
-        <p>Hier können Sie Ihre Einstellungen anpassen und das System nach Ihren Wünschen konfigurieren.</p>
-
-        <!-- Hintergrundbild auswählen -->
-        <h3 class="text-lg font-semibold mb-2 mt-4">Hintergrundbild auswählen</h3>
-        <div id="wallpaperSelection" class="grid grid-cols-2 sm:grid-cols-3 gap-2 mb-4">
-            {% for i in range(1, 27) %}
-                <img src="{{ url_for('static', filename=i ~ '.png') }}" alt="Wallpaper {{ i }}"
-                     class="w-full h-auto wallpaper-thumb cursor-pointer border-2
-                            {% if wallpaper == i ~ '.png' %}border-blue-500{% else %}border-transparent{% endif %}
-                            rounded"
-                     data-wallpaper="{{ i }}.png">
             {% endfor %}
         </div>
+    </div>
 
-        <!-- Stadt ändern -->
+    <!-- Navigation Buttons -->
-        <h3 class="text-lg font-semibold mb-2">Stadt ändern</h3>
+    <button id="carouselPrev" class="absolute left-0 top-1/2 transform -translate-y-1/2 p-2 bg-gray-800 text-white rounded-full shadow-md hover:bg-gray-600">
-        <input type="text" id="cityInput" class="w-full p-2 border rounded mb-4 text-gray-800 dark:bg-gray-700 dark:text-white"
+        <i class="fas fa-chevron-left"></i>
-               placeholder="Ihre Stadt" value="{{ city }}" />
+    </button>
+    <button id="carouselNext" class="absolute right-0 top-1/2 transform -translate-y-1/2 p-2 bg-gray-800 text-white rounded-full shadow-md hover:bg-gray-600">
+        <i class="fas fa-chevron-right"></i>
+    </button>
+  </div>
 
-        <!-- Unsichtbarer Wetter-Toggle (V1-Fallback) -->
+  <!-- Bookmark-Modal -->
-        <div style="display: none;">
+  <div id="bookmarkModal" class="fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center z-50">
-            <h3 class="text-lg font-semibold mb-2">Wochenvorhersage anzeigen</h3>
+    <div class="glassmorphism bg-white dark:bg-gray-800 p-6 rounded-lg max-w-md w-full mx-auto">
-            <label class="inline-flex items-center mt-2">
+        <h2 class="text-2xl font-bold mb-4">Neues Lesezeichen hinzufügen</h2>
-                <input type="checkbox" id="weatherForecastToggle" class="form-checkbox h-5 w-5 text-blue-600"
-                    {% if show_forecast %}checked{% endif %} />
-                <span class="ml-2 text-gray-700 dark:text-gray-300">Wochenvorhersage anzeigen</span>
-            </label>
-        </div>
 
-        <button id="saveSettings" class="mt-4 bg-yellow-500 text-white px-4 py-2 rounded hover:bg-yellow-600 transition-colors duration-200">
+        <form id="bookmarkForm" action="{{ url_for('add_bookmark') }}" method="POST">
-            Speichern
+            <!-- Titel -->
-        </button>
+            <label class="block text-lg font-semibold mb-1">Titel</label>
-        <button class="mt-4 ml-2 bg-gray-500 text-white px-4 py-2 rounded hover:bg-gray-600 transition-colors duration-200 close-modal">
+            <input type="text" name="title" id="bookmarkTitle"
+                   class="w-full p-2 border rounded mb-4 text-gray-800 dark:bg-gray-700 dark:text-white"
+                   placeholder="Titel eingeben" required>
+
+            <!-- URL -->
+            <label class="block text-lg font-semibold mb-1">URL</label>
+            <input type="url" name="url" id="bookmarkUrl"
+                   class="w-full p-2 border rounded mb-4 text-gray-800 dark:bg-gray-700 dark:text-white"
+                   placeholder="https://example.com" required>
+
+            <!-- Icon Auswahl -->
+            <label class="block text-lg font-semibold mb-2">Icon wählen</label>
+            <div class="grid grid-cols-5 gap-3 mb-4">
+                {% for icon in ['fa-bookmark', 'fa-star', 'fa-link', 'fa-heart', 'fa-cog', 'fa-chart-bar', 'fa-play', 'fa-music', 'fa-film', 'fa-envelope'] %}
+                <button type="button" class="icon-option p-3 rounded bg-gray-200 dark:bg-gray-700"
+                        data-icon="{{ icon }}">
+                    <i class="fas {{ icon }} text-xl"></i>
+                </button>
+                {% endfor %}
+            </div>
+            <input type="hidden" name="icon_class" id="selectedIcon" value="fa-bookmark">
+
+            <!-- Farbe Auswahl -->
+            <label class="block text-lg font-semibold mb-2">Hintergrundfarbe wählen</label>
+            <div class="flex space-x-2 mb-4">
+                {% for color in ['bg-blue-500', 'bg-green-500', 'bg-red-500', 'bg-yellow-500', 'bg-purple-500', 'bg-gray-500'] %}
+                <button type="button" class="color-option w-10 h-10 rounded-full {{ color }}" data-color="{{ color }}"></button>
+                {% endfor %}
+            </div>
+            <input type="hidden" name="bg_color" id="selectedColor" value="bg-blue-500">
+
+            <!-- Vorschau -->
+            <div class="flex items-center justify-center mb-4">
+                <div id="bookmarkPreview" class="w-12 h-12 flex items-center justify-center bg-blue-500 rounded-xl">
+                    <i id="previewIcon" class="fas fa-bookmark text-white text-xl"></i>
+                </div>
+            </div>
+
+            <!-- Speichern Button -->
+            <button type="submit" class="w-full bg-green-500 text-white px-4 py-2 rounded hover:bg-green-600">
+                Speichern
+            </button>
+        </form>
+
+        <!-- Schließen Button -->
+        <button id="closeBookmarkModal" class="mt-4 w-full bg-gray-500 text-white px-4 py-2 rounded hover:bg-gray-600">
             Schließen
         </button>
     </div>
+  </div>
+
+  <!-- Dock -->
+  <div class="fixed bottom-4 left-1/2 transform -translate-x-1/2 glassmorphism p-2 flex space-x-4 rounded">
+    <!-- Home Modal -->
+    <button class="dock-icon w-12 h-12 flex items-center justify-center bg-blue-500 hover:bg-blue-600 rounded-xl transition-colors duration-200" data-modal="homeModal">
+        <i class="fas fa-home text-white text-xl"></i>
+    </button>
+    <!-- Support-Button (öffnet Support-Modal) -->
+    <button class="dock-icon w-12 h-12 flex items-center justify-center bg-purple-500 hover:bg-purple-600 rounded-xl transition-colors duration-200" data-modal="supportModal">
+        <i class="fas fa-question-circle text-white text-xl"></i>
+    </button>
+    <!-- Admin-Button nur zeigen, wenn is_admin == 1 -->
+    {% if session.is_admin == 1 %}
+    <a href="{{ url_for('admin_panel') }}"
+       class="dock-icon w-12 h-12 flex items-center justify-center bg-yellow-500 hover:bg-yellow-600 rounded-xl transition-colors duration-200">
+        <i class="fas fa-user-shield text-white text-xl"></i>
+    </a>
+    {% endif %}
+    <!-- Dock-Icon für Lesezeichen hinzufügen -->
+    <button class="dock-icon w-12 h-12 flex items-center justify-center bg-blue-500 hover:bg-blue-600 rounded-xl transition-colors duration-200" id="openBookmarkModal" data-modal="bookmarkModal">
+        <i class="fas fa-bookmark text-white text-xl"></i>
+    </button>
+    <!-- Einstellungen (öffnet Settings-Modal) -->
+    <button class="dock-icon w-12 h-12 flex items-center justify-center bg-yellow-700 hover:bg-yellow-800 rounded-xl transition-colors duration-200" data-modal="settingsModal">
+        <i class="fas fa-cog text-white text-xl"></i>
+    </button>
+  </div>
+
+  <!-- =========================== MODALS =========================== -->
+
+  <!-- Home Modal -->
+  <div id="homeModal" class="fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center z-50">
+      <div class="glassmorphism bg-white dark:bg-gray-800 p-6 rounded max-w-md w-full mx-auto">
+          <h2 class="text-2xl font-bold mb-4">Willkommen Zuhause!</h2>
+          <p class="mb-4">Schneller Zugriff auf wichtige Einstellungen.</p>
+          <!-- z.B. Logout oder Konto löschen -->
+          <form action="{{ url_for('logout') }}" method="POST" class="mb-3 mt-2">
+              <button type="submit" class="w-full bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
+                  Abmelden
+              </button>
+          </form>
+          <button class="mt-4 bg-gray-300 dark:bg-gray-700 hover:bg-gray-400 dark:hover:bg-gray-800 text-gray-800 dark:text-white font-bold py-2 px-4 rounded close-modal">
+              Schließen
+          </button>
+      </div>
+  </div>
+
+  <!-- Support Modal -->
+  <div id="supportModal" class="fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center z-50">
+      <div class="glassmorphism bg-white dark:bg-gray-800 p-8 rounded-lg max-w-md w-full mx-auto shadow-lg">
+          <h2 class="text-2xl font-bold mb-4">Support kontaktieren</h2>
+          
+          <!-- Dropdown zur Kategorisierung des Problems -->
+          <label for="problemType" class="block mb-2 text-lg font-semibold">Art des Problems</label>
+          <select id="problemType" class="w-full p-2 border rounded mb-4 text-gray-800 dark:bg-gray-700 dark:text-white">
+              <option value="Technisches Problem">Technisches Problem</option>
+              <option value="Account Problem">Account Problem</option>
+              <option value="Sonstiges">Sonstiges</option>
+          </select>
+
+          <!-- Eingabefeld für E-Mail -->
+          <label for="emailInput" class="block mb-2 text-lg font-semibold">Ihre E-Mail</label>
+          <input type="email" id="emailInput" class="w-full p-2 border rounded mb-4 text-gray-800 dark:bg-gray-700 dark:text-white"
+                 placeholder="Ihre E-Mail-Adresse" />
+
+          <!-- Eingabefeld für Nachricht -->
+          <label for="messageInput" class="block mb-2 text-lg font-semibold">Nachricht</label>
+          <textarea id="messageInput" class="w-full p-2 border rounded mb-4 text-gray-800 dark:bg-gray-700 dark:text-white" rows="4"
+                    placeholder="Beschreiben Sie Ihr Problem"></textarea>
+
+          <!-- Button zum Senden der Nachricht -->
+          <button id="sendSupportMessage" class="bg-purple-500 text-white px-4 py-2 rounded hover:bg-purple-600 transition-colors duration-200">
+              Nachricht senden
+          </button>
+
+          <!-- Schließen-Button -->
+          <button class="mt-4 bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600 transition-colors duration-200 close-modal">
+              Schließen
+          </button>
+      </div>
+  </div>
+
+  <!-- Settings Modal -->
+  <div id="settingsModal" class="fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center overflow-auto z-50">
+      <div class="glassmorphism bg-white dark:bg-gray-800 p-6 rounded-lg w-full max-w-md max-h-screen overflow-y-auto mx-4 shadow-lg">
+          <h2 class="text-2xl font-bold mb-4">Einstellungen</h2>
+          <p>Hier können Sie Ihre Einstellungen anpassen und das System nach Ihren Wünschen konfigurieren.</p>
+
+          <!-- Hintergrundbild auswählen -->
+          <h3 class="text-lg font-semibold mb-2 mt-4">Hintergrundbild auswählen</h3>
+          <div id="wallpaperSelection" class="grid grid-cols-2 sm:grid-cols-3 gap-2 mb-4">
+              {% for i in range(1, 27) %}
+                  <img src="{{ url_for('static', filename=i ~ '.png') }}" alt="Wallpaper {{ i }}"
+                       class="w-full h-auto wallpaper-thumb cursor-pointer border-2 {% if wallpaper == i ~ '.png' %}border-blue-500{% else %}border-transparent{% endif %} rounded"
+                       data-wallpaper="{{ i }}.png">
+              {% endfor %}
+          </div>
+
+          <!-- Stadt ändern -->
+          <h3 class="text-lg font-semibold mb-2">Stadt ändern</h3>
+          <input type="text" id="cityInput" class="w-full p-2 border rounded mb-4 text-gray-800 dark:bg-gray-700 dark:text-white"
+                 placeholder="Ihre Stadt" value="{{ city }}" />
+
+          <!-- Unsichtbarer Wetter-Toggle (V1-Fallback) -->
+          <div style="display: none;">
+              <h3 class="text-lg font-semibold mb-2">Wochenvorhersage anzeigen</h3>
+              <label class="inline-flex items-center mt-2">
+                  <input type="checkbox" id="weatherForecastToggle" class="form-checkbox h-5 w-5 text-blue-600"
+                      {% if show_forecast %}checked{% endif %} />
+                  <span class="ml-2 text-gray-700 dark:text-gray-300">Wochenvorhersage anzeigen</span>
+              </label>
+          </div>
+
+          <button id="saveSettings" class="mt-4 bg-yellow-500 text-white px-4 py-2 rounded hover:bg-yellow-600 transition-colors duration-200">
+              Speichern
+          </button>
+          <button class="mt-4 ml-2 bg-gray-500 text-white px-4 py-2 rounded hover:bg-gray-600 transition-colors duration-200 close-modal">
+              Schließen
+          </button>
+      </div>
+  </div>
+
 </div>
 
 <!-- JavaScript fürs Dashboard -->
@@ -279,7 +359,7 @@
   setInterval(updateClock, 1000);
   updateClock();
 
-  // GSAP-Effekte
+  // GSAP-Effekte (vorausgesetzt, GSAP ist in base.html eingebunden)
   gsap.from(".glassmorphism", {
       duration: 1, opacity: 0, y: 50, stagger: 0.2, ease: "power3.out"
   });
@@ -329,7 +409,7 @@
       });
   });
 
-  // Websuche (inline)
+  // Websuche
   const searchForm = document.getElementById('searchForm');
   const searchInput = document.getElementById('searchInput');
   const searchEngine = document.getElementById('searchEngine');
@@ -346,7 +426,7 @@
       window.open(url, '_blank');
   });
 
-  // Support Modal: Nachricht senden (aus V1)
+  // Support Modal: Nachricht senden
   const sendSupportMessage = document.getElementById('sendSupportMessage');
   if (sendSupportMessage) {
       sendSupportMessage.addEventListener('click', () => {
@@ -374,16 +454,15 @@
       });
   }
 
-  // Settings Modal (Wallpaper, Stadt, etc.) aus V1
+  // Settings Modal: Wallpaper und Stadt
-  // Lese/Schreibe Settings per '/get_settings' und '/save_settings'
   let selectedWallpaper = '{{ wallpaper }}';
-
-  // Markiere ausgewähltes Wallpaper
   const wallpaperThumbs = document.querySelectorAll('.wallpaper-thumb');
   wallpaperThumbs.forEach(thumb => {
       thumb.addEventListener('click', function() {
-          wallpaperThumbs.forEach(t => t.classList.remove('border-blue-500'));
+          wallpaperThumbs.forEach(t => {
-          wallpaperThumbs.forEach(t => t.classList.add('border-transparent'));
+              t.classList.remove('border-blue-500');
+              t.classList.add('border-transparent');
+          });
           this.classList.remove('border-transparent');
           this.classList.add('border-blue-500');
           selectedWallpaper = this.getAttribute('data-wallpaper');
@@ -422,5 +501,93 @@
               });
       });
   }
+
+  // Icon Auswahl
+  const iconButtons = document.querySelectorAll('.icon-option');
+  const selectedIconInput = document.getElementById('selectedIcon');
+  const previewIcon = document.getElementById('previewIcon');
+  iconButtons.forEach(button => {
+      button.addEventListener("click", function () {
+          // Alle Buttons zurücksetzen
+          iconButtons.forEach(btn => btn.classList.remove("bg-blue-500"));
+          // Aktuelles Icon markieren
+          this.classList.add("bg-blue-500");
+          // Icon-Name setzen
+          const iconClass = this.getAttribute("data-icon");
+          selectedIconInput.value = iconClass;
+          previewIcon.className = `fas ${iconClass} text-white text-xl`;
+      });
+  });
+
+  // Farb-Auswahl: Live Vorschau für die Hintergrundfarbe
+  const colorButtons = document.querySelectorAll('.color-option');
+  const selectedColorInput = document.getElementById('selectedColor');
+  const bookmarkPreview = document.getElementById('bookmarkPreview');
+  colorButtons.forEach(button => {
+      button.addEventListener('click', function() {
+          // Optional: optisch markieren (hier per ring)
+          colorButtons.forEach(btn => btn.classList.remove('ring-2', 'ring-white'));
+          this.classList.add('ring-2', 'ring-white');
+          const colorClass = this.getAttribute('data-color');
+          selectedColorInput.value = colorClass;
+          // Hintergrund der Vorschau aktualisieren
+          bookmarkPreview.className = `w-12 h-12 flex items-center justify-center rounded-xl ${colorClass}`;
+      });
+  });
+
+  // Öffnen des Bookmark-Modals über Dock-Icon
+  const openBookmarkModal = document.getElementById('openBookmarkModal');
+  if (openBookmarkModal) {
+      openBookmarkModal.addEventListener('click', () => {
+          const modal = document.getElementById('bookmarkModal');
+          modal.classList.remove('hidden');
+          modal.classList.add('flex');
+      });
+  }
+  // Schließen des Bookmark-Modals über Schließen-Button
+  const closeBookmarkModal = document.getElementById('closeBookmarkModal');
+  if (closeBookmarkModal) {
+      closeBookmarkModal.addEventListener('click', () => {
+          const modal = document.getElementById('bookmarkModal');
+          modal.classList.remove('flex');
+          modal.classList.add('hidden');
+      });
+  }
+
+    // <!-- JavaScript für das Carousel -->
+    document.addEventListener("DOMContentLoaded", function () {
+        const track = document.getElementById("carouselTrack");
+        const slides = document.querySelectorAll(".carousel-slide");
+        const prevButton = document.getElementById("carouselPrev");
+        const nextButton = document.getElementById("carouselNext");
+
+        let currentIndex = 0;
+        const totalSlides = slides.length;
+
+        function updateCarousel() {
+            const newTransformValue = `translateX(-${currentIndex * 100}%)`;
+            track.style.transform = newTransformValue;
+        }
+
+        nextButton.addEventListener("click", function () {
+            if (currentIndex < totalSlides - 1) {
+                currentIndex++;
+                updateCarousel();
+            }
+        });
+
+        prevButton.addEventListener("click", function () {
+            if (currentIndex > 0) {
+                currentIndex--;
+                updateCarousel();
+            }
+        });
+
+        // Falls nur eine Seite vorhanden ist, Navigation ausblenden
+        if (totalSlides <= 1) {
+            prevButton.style.display = "none";
+            nextButton.style.display = "none";
+        }
+    });
 </script>
 {% endblock content %}