pans map if popup behind header

removed cancel icon from onboarding popup
fixed popup auto-position with padding
2026-06-12 12:27:16 +02:00 · 2026-06-12 12:03:44 +02:00 · 2026-06-11 17:10:19 +02:00 · 2026-06-11 16:39:52 +02:00 · 2026-06-11 16:38:25 +02:00 · 2026-06-11 15:58:03 +02:00
8 changed files with 448 additions and 1047 deletions
--- a/migrations/001_initial_schema.sql
+++ b/migrations/001_initial_schema.sql
@@ -35,7 +35,7 @@ COMMENT ON TABLE municipalities IS 'Configuration Per Municipality (Tenant) usin

 -- ---------------------------------------------------------------------
 -- Block 3: Table "contributions"
-- Citizen and Administration Contributions as Points, Lines, and
+-- Aitizen and Administration Contributions as Points, Lines, and
 -- Polygons stored together in one mixed-geometry Column.
 -- ---------------------------------------------------------------------
 CREATE TABLE contributions (
--- a/migrations/009_tasks-module.sql
+++ b/migrations/009_tasks-module.sql
@@ -1,183 +0,0 @@
-- =====================================================================
-- Migration 009: Tasks Module — Tasks with Reward System
-- =====================================================================
-
-
-- ---------------------------------------------------------------------
-- Block 1: Tasks Table
-- Stores Tasks with Geometry, Moderation and Completion.
-- Status Flow from pending to rejected or approved to completed to verified
-- ---------------------------------------------------------------------
-CREATE TABLE IF NOT EXISTS tasks (
-    task_id              SERIAL PRIMARY KEY,
-    municipality_id      INTEGER NOT NULL REFERENCES municipalities(municipality_id),
-    geom                 GEOMETRY(Geometry, 4326) NOT NULL,
-    geom_type            VARCHAR(10) NOT NULL CHECK (geom_type IN ('point', 'line', 'polygon')),
-    category             VARCHAR(50) NOT NULL,
-    title                VARCHAR(200) NOT NULL,
-    description          TEXT DEFAULT '',
-    points_reward        INTEGER NOT NULL DEFAULT 25,
-    author_name          VARCHAR(100) NOT NULL,
-    browser_id           VARCHAR(36),
-    photo_path           VARCHAR(255),
-    status               VARCHAR(20) NOT NULL DEFAULT 'pending'
-                         CHECK (status IN ('pending', 'rejected', 'approved', 'completed', 'verified')),
-    address              VARCHAR(255),
-
-    -- Completion Fields empty before completed
-    completed_by_name    VARCHAR(100),
-    completed_by_browser VARCHAR(36),
-    completion_photo     VARCHAR(255),
-    completion_comment   TEXT,
-    completed_at         TIMESTAMP,
-
-    -- Counters updated via Triggers
-    likes_count          INTEGER NOT NULL DEFAULT 0,
-    dislikes_count       INTEGER NOT NULL DEFAULT 0,
-    comment_count        INTEGER NOT NULL DEFAULT 0,
-
-    created_at           TIMESTAMP NOT NULL DEFAULT NOW(),
-    updated_at           TIMESTAMP NOT NULL DEFAULT NOW()
-);
-
-CREATE INDEX idx_tasks_municipality ON tasks(municipality_id);
-CREATE INDEX idx_tasks_status ON tasks(status);
-CREATE INDEX idx_tasks_category ON tasks(category);
-
-
-- ---------------------------------------------------------------------
-- Block 2: Citizen Points Table
-- One Row per Completion. Leaderboard via SUM and GROUP BY.
-- ---------------------------------------------------------------------
-CREATE TABLE IF NOT EXISTS user_points (
-    points_id            SERIAL PRIMARY KEY,
-    municipality_id      INTEGER NOT NULL REFERENCES municipalities(municipality_id),
-    user_name            VARCHAR(100) NOT NULL,
-    points               INTEGER NOT NULL DEFAULT 25,
-    task_id              INTEGER NOT NULL REFERENCES tasks(task_id) ON DELETE CASCADE,
-    created_at           TIMESTAMP NOT NULL DEFAULT NOW()
-);
-
-CREATE INDEX idx_user_points_municipality ON user_points(municipality_id);
-CREATE INDEX idx_user_points_user ON user_points(user_name);
-
-
-- ---------------------------------------------------------------------
-- Block 3: Adapts Votes Table for Tasks
-- Either contribution_id OR task_id
-- ---------------------------------------------------------------------
-ALTER TABLE votes
-    ADD COLUMN task_id INTEGER REFERENCES tasks(task_id) ON DELETE CASCADE;
-
-CREATE INDEX idx_votes_task ON votes(task_id);
-
-- Unique Vote per Browser per Task
-ALTER TABLE votes
-    ADD CONSTRAINT votes_task_browser_unique
-    UNIQUE (task_id, browser_id);
-
-
-- ---------------------------------------------------------------------
-- Block 4: Adapts Comments Table for Tasks
-- Either contribution_id OR task_id
-- ---------------------------------------------------------------------
-ALTER TABLE comments
-    ADD COLUMN task_id INTEGER REFERENCES tasks(task_id) ON DELETE CASCADE;
-
-CREATE INDEX idx_comments_task ON comments(task_id);
-
-
-- ---------------------------------------------------------------------
-- Block 5: Trigger Updated Timestamp for Tasks
-- ---------------------------------------------------------------------
-CREATE TRIGGER set_tasks_updated_at
-    BEFORE UPDATE ON tasks
-    FOR EACH ROW
-    EXECUTE FUNCTION set_updated_at();
-
-
-- ---------------------------------------------------------------------
-- Block 6: Trigger Vote Counts for Tasks
-- Mirrors Pattern from Contributions.
-- ---------------------------------------------------------------------
-CREATE OR REPLACE FUNCTION update_task_vote_counts()
-RETURNS TRIGGER AS $$
-BEGIN
-    IF TG_OP = 'INSERT' OR TG_OP = 'UPDATE' THEN
-        IF NEW.task_id IS NOT NULL THEN
-            UPDATE tasks SET
-                likes_count = (SELECT COUNT(*) FROM votes WHERE task_id = NEW.task_id AND vote_type = 'like'),
-                dislikes_count = (SELECT COUNT(*) FROM votes WHERE task_id = NEW.task_id AND vote_type = 'dislike')
-            WHERE task_id = NEW.task_id;
-        END IF;
-    END IF;
-
-    IF TG_OP = 'DELETE' OR (TG_OP = 'UPDATE' AND OLD.task_id IS NOT NULL) THEN
-        UPDATE tasks SET
-            likes_count = (SELECT COUNT(*) FROM votes WHERE task_id = OLD.task_id AND vote_type = 'like'),
-            dislikes_count = (SELECT COUNT(*) FROM votes WHERE task_id = OLD.task_id AND vote_type = 'dislike')
-        WHERE task_id = OLD.task_id;
-    END IF;
-
-    RETURN NULL;
-END;
-$$ LANGUAGE plpgsql;
-
-DROP TRIGGER IF EXISTS trigger_update_task_vote_counts ON votes;
-
-CREATE TRIGGER trigger_update_task_vote_counts
-    AFTER INSERT OR DELETE OR UPDATE ON votes
-    FOR EACH ROW
-    EXECUTE FUNCTION update_task_vote_counts();
-
-
-- ---------------------------------------------------------------------
-- Block 7: Trigger Comment Count for Tasks
-- Mirrors Pattern from Contributions.
-- ---------------------------------------------------------------------
-CREATE OR REPLACE FUNCTION update_task_comment_count()
-RETURNS TRIGGER AS $$
-BEGIN
-    IF TG_OP = 'INSERT' OR TG_OP = 'UPDATE' THEN
-        IF NEW.task_id IS NOT NULL THEN
-            UPDATE tasks
-            SET comment_count = (
-                SELECT COUNT(*) FROM comments
-                WHERE task_id = NEW.task_id AND status = 'approved'
-            )
-            WHERE task_id = NEW.task_id;
-        END IF;
-    END IF;
-
-    IF TG_OP = 'DELETE' OR (TG_OP = 'UPDATE' AND OLD.task_id IS NOT NULL) THEN
-        UPDATE tasks
-        SET comment_count = (
-            SELECT COUNT(*) FROM comments
-            WHERE task_id = OLD.task_id AND status = 'approved'
-        )
-        WHERE task_id = OLD.task_id;
-    END IF;
-
-    RETURN NULL;
-END;
-$$ LANGUAGE plpgsql;
-
-DROP TRIGGER IF EXISTS trigger_update_task_comment_count ON comments;
-
-CREATE TRIGGER trigger_update_task_comment_count
-    AFTER INSERT OR DELETE OR UPDATE OF status ON comments
-    FOR EACH ROW
-    EXECUTE FUNCTION update_task_comment_count();
-
-
-- ---------------------------------------------------------------------
-- Block 8: Views for QGIS
-- ---------------------------------------------------------------------
-CREATE OR REPLACE VIEW tasks_points AS
-    SELECT * FROM tasks WHERE geom_type = 'point';
-
-CREATE OR REPLACE VIEW tasks_lines AS
-    SELECT * FROM tasks WHERE geom_type = 'line';
-
-CREATE OR REPLACE VIEW tasks_polygons AS
-    SELECT * FROM tasks WHERE geom_type = 'polygon';
--- a/public/api/contributions.php
+++ b/public/api/contributions.php
@@ -17,7 +17,7 @@ require_once __DIR__ . '/db.php';


 // ---------------------------------------------------------------------
-// Reads Action Parameter and Routes to correct Handler
+// Read Action Parameter and Route to correct Handler
 // ---------------------------------------------------------------------
 $input = get_input();
 $action = $input['action'] ?? '';
@@ -59,27 +59,6 @@ switch ($action) {
    case 'update_comment':
        handle_update_comment($input);
        break;
-    case 'read_tasks':
-        handle_read_tasks($input);
-        break;
-    case 'create_task':
-        handle_create_task($input);
-        break;
-    case 'update_task':
-        handle_update_task($input);
-        break;
-    case 'delete_task':
-        handle_delete_task($input);
-        break;
-    case 'complete_task':
-        handle_complete_task($input);
-        break;
-    case 'verify_task':
-        handle_verify_task($input);
-        break;
-    case 'read_leaderboard':
-        handle_read_leaderboard($input);
-        break;
    default:
        error_response('Unknown Action. Supported Actions are read, create, update, delete, vote.');
 }
@@ -356,8 +335,8 @@ function handle_delete($input) {


 // ---------------------------------------------------------------------
-// VOTE: Likes or Dislikes Contributions or Tasks
-// Required: contribution_id or task_id, voter_name, vote_type
+// VOTE: Likes or Dislikes a Contribution
+// Required: contribution_id, voter_name, vote_type
 // Database Trigger automatically updates Likes and Dislikes Count
 // UNIQUE Constraint prevents duplicate Votes per Voter.
 // ---------------------------------------------------------------------
@@ -365,7 +344,7 @@ function handle_vote($input) {
    $pdo = get_db();

    // Validates Input
-    $missing = validate_required($input, ['voter_name', 'vote_type']);
+    $missing = validate_required($input, ['contribution_id', 'voter_name', 'vote_type']);
    if (!empty($missing)) {
        error_response('Missing Fields: ' . implode(', ', $missing));
    }
@@ -376,6 +355,13 @@ function handle_vote($input) {
        error_response('Invalid vote_type. Must be: ' . implode(', ', $valid_vote_types));
    }

+    // Checks if Contribution exists
+    $stmt = $pdo->prepare("SELECT contribution_id FROM contributions WHERE contribution_id = :id");
+    $stmt->execute([':id' => $input['contribution_id']]);
+    if (!$stmt->fetch()) {
+        error_response('Contribution not found.', 404);
+    }
+
    // Prepared SQL Statement
    try {
        // Checks if Voter already voted on this Contribution
@@ -384,39 +370,11 @@ function handle_vote($input) {
            error_response('Browser ID required for Voting.');
        }

-        // Determines Vote Type
-        $is_task = isset($input['task_id']) && $input['task_id'] !== '';
-
-        if ($is_task) {
-            // Checks for Tasks
-            $stmt = $pdo->prepare("SELECT task_id FROM tasks WHERE task_id = :id");
-            $stmt->execute([':id' => $input['task_id']]);
-            if (!$stmt->fetch()) {
-                error_response('Task not found.', 404);
-            }
-
-            // Checks if Browser already voted on Task
-            $stmt = $pdo->prepare("
-                SELECT vote_id, vote_type FROM votes
-                WHERE task_id = :id AND browser_id = :bid
-            ");
-            $stmt->execute([':id' => $input['task_id'], ':bid' => $browser_id]);
-        } else {
-            // Checks for Contributions
-            $stmt = $pdo->prepare("SELECT contribution_id FROM contributions WHERE contribution_id = :id");
-            $stmt->execute([':id' => $input['contribution_id']]);
-            if (!$stmt->fetch()) {
-                error_response('Contribution not found.', 404);
-            }
-
-            // Checks if Browser already voted on Contribution
-            $stmt = $pdo->prepare("
-                SELECT vote_id, vote_type FROM votes
-                WHERE contribution_id = :id AND browser_id = :bid
-            ");
-            $stmt->execute([':id' => $input['contribution_id'], ':bid' => $browser_id]);
-        }
-
+        $stmt = $pdo->prepare("
+            SELECT vote_id, vote_type FROM votes
+            WHERE contribution_id = :cid AND browser_id = :bid
+        ");
+        $stmt->execute([':cid' => $input['contribution_id'], ':bid' => $browser_id]);
        $existing = $stmt->fetch();

        if ($existing) {
@@ -426,47 +384,35 @@ function handle_vote($input) {
                $stmt->execute([':vid' => $existing['vote_id']]);
                json_response(['message' => 'Vote removed.', 'action' => 'removed']);
            } else {
-                // Different Vote Type — Removes old Vote before Inserting new one
+                // Different Vote Type — Switches Vote
                $stmt = $pdo->prepare("DELETE FROM votes WHERE vote_id = :vid");
                $stmt->execute([':vid' => $existing['vote_id']]);
-                $this_insert = true;
+
+                $stmt = $pdo->prepare("
+                    INSERT INTO votes (contribution_id, voter_name, vote_type, browser_id)
+                    VALUES (:cid, :voter, :vtype, :bid)
+                ");
+                $stmt->execute([
+                    ':cid'   => $input['contribution_id'],
+                    ':voter' => $input['voter_name'],
+                    ':vtype' => $input['vote_type'],
+                    ':bid'   => $browser_id
+                ]);
+                json_response(['message' => 'Vote changed.', 'action' => 'changed'], 200);
            }
        } else {
            // No existing Vote — Inserts Vote
-            $this_insert = true;
-        }
-
-        if (!empty($this_insert)) {
-            if ($is_task) {
-                $stmt = $pdo->prepare("
-                    INSERT INTO votes (task_id, voter_name, vote_type, browser_id)
-                    VALUES (:id, :voter, :vtype, :bid)
-                ");
-                $stmt->execute([
-                    ':id'    => $input['task_id'],
-                    ':voter' => $input['voter_name'],
-                    ':vtype' => $input['vote_type'],
-                    ':bid'   => $browser_id
-                ]);
-            } else {
-                $stmt = $pdo->prepare("
+            $stmt = $pdo->prepare("
                    INSERT INTO votes (contribution_id, voter_name, vote_type, browser_id)
-                    VALUES (:id, :voter, :vtype, :bid)
+                    VALUES (:cid, :voter, :vtype, :bid)
                ");
                $stmt->execute([
-                    ':id'    => $input['contribution_id'],
+                    ':cid'   => $input['contribution_id'],
                    ':voter' => $input['voter_name'],
                    ':vtype' => $input['vote_type'],
                    ':bid'   => $browser_id
                ]);
-            }
-
-            // Returns changed or created
-            if ($existing) {
-                json_response(['message' => 'Vote changed.', 'action' => 'changed'], 200);
-            } else {
-                json_response(['message' => 'Vote recorded.', 'action' => 'created'], 201);
-            }
+            json_response(['message' => 'Vote recorded.', 'action' => 'created'], 201);
        }

    } catch (PDOException $e) {
@@ -619,40 +565,26 @@ function handle_photo_upload($file) {
 // =====================================================================

 // ---------------------------------------------------------------------
-// READ COMMENTS: Loads Comments for Contributions or Tasks
-// Returns Comments sorted by Date (oldest first)
-// Required: contribution_id or task_id
+// READ COMMENTS: Loads Comments for a Contribution
+// Returns Comments sorted by Date (newest first)
+// Required: contribution_id
 // ---------------------------------------------------------------------
 function handle_read_comments($input) {
    $pdo = get_db();

-    // Checks for contribution_id or task_id
-    if (empty($input['contribution_id']) && empty($input['task_id'])) {
-        error_response('Either contribution_id or task_id is required.');
+    $missing = validate_required($input, ['contribution_id']);
+    if (!empty($missing)) {
+        error_response('Missing Fields: ' . implode(', ', $missing));
    }

-    // Determines Vote Type
-    $is_task = isset($input['task_id']) && $input['task_id'] !== '';
-
    try {
-        if ($is_task) {
-            $stmt = $pdo->prepare("
-                SELECT comment_id, task_id, author_name, browser_id, content, status, created_at
-                FROM comments
-                WHERE task_id = :id AND status = 'approved'
-                ORDER BY created_at ASC
-            ");
-        } else {
-            $stmt = $pdo->prepare("
-                SELECT comment_id, contribution_id, author_name, browser_id, content, status, created_at
-                FROM comments
-                WHERE contribution_id = :id AND status = 'approved'
-                ORDER BY created_at ASC
-            ");
-        }
-        
-        // Prepared Statement
-        $stmt->execute([':id' => $is_task ? $input['task_id'] : $input['contribution_id']]);
+        $stmt = $pdo->prepare("
+            SELECT comment_id, contribution_id, author_name, browser_id, content, status, created_at
+            FROM comments
+            WHERE contribution_id = :cid AND status = 'approved'
+            ORDER BY created_at ASC
+        ");
+        $stmt->execute([':cid' => $input['contribution_id']]);
        $comments = $stmt->fetchAll();

        json_response(['comments' => $comments, 'count' => count($comments)]);
@@ -664,56 +596,37 @@ function handle_read_comments($input) {


 // ---------------------------------------------------------------------
-// CREATE COMMENT: Adds Comments Contributions or Tasks
-// Required: author_name, content, contribution_id or task_id
+// CREATE COMMENT: Adds Comments to Contributions
+// Required: contribution_id, author_name, content
 // Optional: browser_id
 // ---------------------------------------------------------------------
 function handle_create_comment($input) {
    $pdo = get_db();

-    $missing = validate_required($input, ['author_name', 'content']);
+    $missing = validate_required($input, ['contribution_id', 'author_name', 'content']);
    if (!empty($missing)) {
        error_response('Missing Fields: ' . implode(', ', $missing));
    }

-    // Checks for contribution_id or task_id
-    if (empty($input['contribution_id']) && empty($input['task_id'])) {
-        error_response('Either contribution_id or task_id is required.');
-    }
-
-    // Validates Length
+    // Validates Content Length
    if (strlen($input['content']) > 1000) {
        error_response('Comment too long. Maximum 1000 Characters.');
    }

-    // Determines Comment Type
-    $is_task = isset($input['task_id']) && $input['task_id'] !== '';
-
-    if ($is_task) {
-        // Checks for Tasks
-        $stmt = $pdo->prepare("SELECT task_id FROM tasks WHERE task_id = :id");
-        $stmt->execute([':id' => $input['task_id']]);
-        if (!$stmt->fetch()) {
-            error_response('Task not found.', 404);
-        }
-    } else {
-        // Checks for Contributions
-        $stmt = $pdo->prepare("SELECT contribution_id FROM contributions WHERE contribution_id = :id");
-        $stmt->execute([':id' => $input['contribution_id']]);
-        if (!$stmt->fetch()) {
-            error_response('Contribution not found.', 404);
-        }
+    // Checks if Contribution exists
+    $stmt = $pdo->prepare("SELECT contribution_id FROM contributions WHERE contribution_id = :id");
+    $stmt->execute([':id' => $input['contribution_id']]);
+    if (!$stmt->fetch()) {
+        error_response('Contribution not found.', 404);
    }
-    
-    // Prepared Statement
+
    try {
        $stmt = $pdo->prepare("
-            INSERT INTO comments (contribution_id, task_id, author_name, browser_id, content)
-            VALUES (:cid, :tid, :author, :bid, :content)
+            INSERT INTO comments (contribution_id, author_name, browser_id, content)
+            VALUES (:cid, :author, :bid, :content)
        ");
        $stmt->execute([
-            ':cid'     => $is_task ? null : $input['contribution_id'],
-            ':tid'     => $is_task ? $input['task_id'] : null,
+            ':cid'     => $input['contribution_id'],
            ':author'  => $input['author_name'],
            ':bid'     => $input['browser_id'] ?? null,
            ':content' => $input['content']
@@ -796,387 +709,4 @@ function handle_update_comment($input) {
    } catch (PDOException $e) {
        error_response('Database Error: ' . $e->getMessage(), 500);
    }
-}
-
-
-// =====================================================================
-// Action Handlers for Tasks
-// =====================================================================
-
-
-// ---------------------------------------------------------------------
-// READ TASKS: Loads Tasks as GeoJSON FeatureCollection
-// Required: municipality_id
-// Optional: status, browser_id
-// ---------------------------------------------------------------------
-function handle_read_tasks($input) {
-    $pdo = get_db();
-
-    $missing = validate_required($input, ['municipality_id']);
-    if (!empty($missing)) {
-        error_response('Missing Fields: ' . implode(', ', $missing));
-    }
-
-    $sql = "SELECT *, ST_AsGeoJSON(geom) AS geojson
-            FROM tasks
-            WHERE municipality_id = :mid";
-    $params = [':mid' => $input['municipality_id']];
-
-    // Status Filter
-    $status = $input['status'] ?? 'visible';
-    if ($status === 'visible') {
-        $sql .= " AND status IN ('open', 'completed', 'verified')";
-    } elseif ($status !== 'all') {
-        $sql .= " AND status = :status";
-        $params[':status'] = $status;
-    }
-
-    $sql .= " ORDER BY created_at DESC";
-
-    try {
-        $stmt = $pdo->prepare($sql);
-        $stmt->execute($params);
-        $rows = $stmt->fetchAll();
-    } catch (PDOException $e) {
-        error_response('Database Error: ' . $e->getMessage(), 500);
-    }
-
-    // Builds GeoJSON FeatureCollection
-    $features = [];
-    foreach ($rows as $row) {
-        $geometry = json_decode($row['geojson']);
-        unset($row['geom'], $row['geojson']);
-        $features[] = [
-            'type'       => 'Feature',
-            'geometry'   => $geometry,
-            'properties' => $row
-        ];
-    }
-
-    $result = [
-        'type'     => 'FeatureCollection',
-        'features' => $features
-    ];
-
-    // User Votes for Tasks
-    $browser_id = $input['browser_id'] ?? '';
-    if ($browser_id !== '') {
-        $stmt = $pdo->prepare("
-            SELECT task_id, vote_type FROM votes
-            WHERE browser_id = :bid AND task_id IS NOT NULL
-        ");
-        $stmt->execute([':bid' => $browser_id]);
-        $user_votes = [];
-        foreach ($stmt->fetchAll() as $v) {
-            $user_votes[$v['task_id']] = $v['vote_type'];
-        }
-        $result['user_votes'] = $user_votes;
-    }
-
-    json_response($result);
-}
-
-
-// ---------------------------------------------------------------------
-// CREATE TASK: Inserts new Task with optional Photo
-// Required: municipality_id, geom, geom_type, category, title, author_name
-// Optional: description, browser_id, photo
-// ---------------------------------------------------------------------
-function handle_create_task($input) {
-    $pdo = get_db();
-
-    $missing = validate_required($input, [
-        'municipality_id', 'geom', 'geom_type', 'category', 'title', 'author_name'
-    ]);
-    if (!empty($missing)) {
-        error_response('Missing Fields: ' . implode(', ', $missing));
-    }
-
-    $valid_geom_types = ['point', 'line', 'polygon'];
-    if (!in_array($input['geom_type'], $valid_geom_types)) {
-        error_response('Invalid Geometry Type.');
-    }
-
-    $geojson = json_decode($input['geom']);
-    if (!$geojson || !isset($geojson->type)) {
-        error_response('Invalid GeoJSON.');
-    }
-
-    // Handles optional Photo Upload
-    $photo_path = null;
-    if (isset($_FILES['photo']) && $_FILES['photo']['error'] === UPLOAD_ERR_OK) {
-        $photo_path = handle_photo_upload($_FILES['photo']);
-        if (!$photo_path) {
-            error_response('Photo Upload failed. JPG, PNG, GIF and WebP up to 5 MB.');
-        }
-    }
-
-    try {
-        $stmt = $pdo->prepare("
-            INSERT INTO tasks
-                (municipality_id, geom, geom_type, category, title, description, author_name, browser_id, photo_path)
-            VALUES
-                (:mid, ST_SetSRID(ST_GeomFromGeoJSON(:geom), 4326), :geom_type,
-                 :category, :title, :description, :author_name, :browser_id, :photo_path)
-        ");
-        $stmt->execute([
-            ':mid'         => $input['municipality_id'],
-            ':geom'        => $input['geom'],
-            ':geom_type'   => $input['geom_type'],
-            ':category'    => $input['category'],
-            ':title'       => $input['title'],
-            ':description' => $input['description'] ?? '',
-            ':author_name' => $input['author_name'],
-            ':browser_id'  => $input['browser_id'] ?? null,
-            ':photo_path'  => $photo_path
-        ]);
-
-        json_response([
-            'message' => 'Task created successfully.',
-            'task_id' => (int) $pdo->lastInsertId()
-        ], 201);
-
-    } catch (PDOException $e) {
-        error_response('Database Error: ' . $e->getMessage(), 500);
-    }
-}
-
-
-// ---------------------------------------------------------------------
-// UPDATE TASK: Updates existing Tasks or Status
-// Required: task_id
-// Optional: category, title, description, status, address
-// ---------------------------------------------------------------------
-function handle_update_task($input) {
-    $pdo = get_db();
-
-    $missing = validate_required($input, ['task_id']);
-    if (!empty($missing)) {
-        error_response('Missing Fields: ' . implode(', ', $missing));
-    }
-
-    $updatable = ['category', 'title', 'description', 'status', 'address'];
-    $set = [];
-    $params = [':id' => $input['task_id']];
-
-    foreach ($updatable as $field) {
-        if (isset($input[$field]) && $input[$field] !== '') {
-            $set[] = "$field = :$field";
-            $params[":$field"] = $input[$field];
-        }
-    }
-
-    if (empty($set)) {
-        error_response('No Fields to update.');
-    }
-
-    if (isset($params[':status'])) {
-        $valid = ['pending', 'rejected', 'open', 'completed', 'verified'];
-        if (!in_array($params[':status'], $valid)) {
-            error_response('Invalid Status.');
-        }
-    }
-
-    try {
-        $stmt = $pdo->prepare("UPDATE tasks SET " . implode(', ', $set) . " WHERE task_id = :id");
-        $stmt->execute($params);
-        json_response(['message' => 'Task updated successfully.']);
-    } catch (PDOException $e) {
-        error_response('Database Error: ' . $e->getMessage(), 500);
-    }
-}
-
-
-// ---------------------------------------------------------------------
-// DELETE TASK: Removes existing Tasks
-// Required: task_id
-// ---------------------------------------------------------------------
-function handle_delete_task($input) {
-    $pdo = get_db();
-
-    $missing = validate_required($input, ['task_id']);
-    if (!empty($missing)) {
-        error_response('Missing Fields: ' . implode(', ', $missing));
-    }
-
-    try {
-        $stmt = $pdo->prepare("DELETE FROM tasks WHERE task_id = :id");
-        $stmt->execute([':id' => $input['task_id']]);
-        json_response(['message' => 'Task deleted successfully.']);
-    } catch (PDOException $e) {
-        error_response('Database Error: ' . $e->getMessage(), 500);
-    }
-}
-
-
-// ---------------------------------------------------------------------
-// COMPLETE TASK: Completes existing Tasks with Photo Proof
-// Required: task_id, author_name, browser_id
-// Required File: completion_photo
-// Optional: completion_comment
-// ---------------------------------------------------------------------
-function handle_complete_task($input) {
-    $pdo = get_db();
-
-    $missing = validate_required($input, ['task_id', 'author_name', 'browser_id']);
-    if (!empty($missing)) {
-        error_response('Missing Fields: ' . implode(', ', $missing));
-    }
-
-    // Checks if Task exists and is open
-    $stmt = $pdo->prepare("SELECT task_id, status FROM tasks WHERE task_id = :id");
-    $stmt->execute([':id' => $input['task_id']]);
-    $task = $stmt->fetch();
-
-    if (!$task) {
-        error_response('Task not found.', 404);
-    }
-    if ($task['status'] !== 'open') {
-        error_response('Task is not available for Completion.');
-    }
-
-    // Handles required Completion Photo
-    if (!isset($_FILES['completion_photo']) || $_FILES['completion_photo']['error'] !== UPLOAD_ERR_OK) {
-        error_response('Completion Photo is required.');
-    }
-
-    $photo_path = handle_photo_upload($_FILES['completion_photo']);
-    if (!$photo_path) {
-        error_response('Photo Upload failed. JPG, PNG, GIF and WebP up to 5 MB.');
-    }
-
-    try {
-        $stmt = $pdo->prepare("
-            UPDATE tasks SET
-                status = 'completed',
-                completed_by_name = :name,
-                completed_by_browser = :browser,
-                completion_photo = :photo,
-                completion_comment = :comment,
-                completed_at = NOW()
-            WHERE task_id = :id
-        ");
-        $stmt->execute([
-            ':id'      => $input['task_id'],
-            ':name'    => $input['author_name'],
-            ':browser' => $input['browser_id'],
-            ':photo'   => $photo_path,
-            ':comment' => $input['completion_comment'] ?? ''
-        ]);
-
-        json_response(['message' => 'Task Completion submitted for Review.']);
-
-    } catch (PDOException $e) {
-        error_response('Database Error: ' . $e->getMessage(), 500);
-    }
-}
-
-
-// ---------------------------------------------------------------------
-// VERIFY TASK: Moderator confirms or rejects Completions
-// Required: task_id, action
-// Awards Points and sets Status if verified
-// Clears Completion Fields, resets Status if rejected
-// ---------------------------------------------------------------------
-function handle_verify_task($input) {
-    $pdo = get_db();
-
-    $missing = validate_required($input, ['task_id', 'verify_action']);
-    if (!empty($missing)) {
-        error_response('Missing Fields: ' . implode(', ', $missing));
-    }
-
-    // Loads Task
-    $stmt = $pdo->prepare("SELECT * FROM tasks WHERE task_id = :id");
-    $stmt->execute([':id' => $input['task_id']]);
-    $task = $stmt->fetch();
-
-    if (!$task) {
-        error_response('Task not found.', 404);
-    }
-    if ($task['status'] !== 'completed') {
-        error_response('Task is not in completed State.');
-    }
-
-    try {
-        if ($input['verify_action'] === 'verify') {
-            // Accepts Completion and Awards Points
-            $stmt = $pdo->prepare("UPDATE tasks SET status = 'verified' WHERE task_id = :id");
-            $stmt->execute([':id' => $input['task_id']]);
-
-            // Awards Points to User
-            $stmt = $pdo->prepare("
-                INSERT INTO user_points (municipality_id, user_name, points, task_id)
-                VALUES (:mid, :name, :points, :tid)
-            ");
-            $stmt->execute([
-                ':mid'    => $task['municipality_id'],
-                ':name'   => $task['completed_by_name'],
-                ':points' => $task['points_reward'],
-                ':tid'    => $input['task_id']
-            ]);
-
-            json_response(['message' => 'Task verified. Points awarded.']);
-
-        } elseif ($input['verify_action'] === 'reject') {
-            // Rejects Completion and Clears Fields
-            $stmt = $pdo->prepare("
-                UPDATE tasks SET
-                    status = 'open',
-                    completed_by_name = NULL,
-                    completed_by_browser = NULL,
-                    completion_photo = NULL,
-                    completion_comment = NULL,
-                    completed_at = NULL
-                WHERE task_id = :id
-            ");
-            $stmt->execute([':id' => $input['task_id']]);
-
-            json_response(['message' => 'Completion rejected. Task is open again.']);
-
-        } else {
-            error_response('Invalid Action. Must be: verify or reject.');
-        }
-
-    } catch (PDOException $e) {
-        error_response('Database Error: ' . $e->getMessage(), 500);
-    }
-}
-
-
-// ---------------------------------------------------------------------
-// READ LEADERBOARD: Returns Citizen Leaderboard
-// Required: municipality_id
-// Optional: limit
-// ---------------------------------------------------------------------
-function handle_read_leaderboard($input) {
-    $pdo = get_db();
-
-    $missing = validate_required($input, ['municipality_id']);
-    if (!empty($missing)) {
-        error_response('Missing Fields: ' . implode(', ', $missing));
-    }
-
-    $limit = min((int)($input['limit'] ?? 10), 50);
-
-    try {
-        $stmt = $pdo->prepare("
-            SELECT user_name,
-                   SUM(points) AS total_points,
-                   COUNT(*) AS tasks_completed
-            FROM user_points
-            WHERE municipality_id = :mid
-            GROUP BY user_name
-            ORDER BY total_points DESC
-            LIMIT :lim
-        ");
-        $stmt->bindValue(':mid', $input['municipality_id'], PDO::PARAM_INT);
-        $stmt->bindValue(':lim', $limit, PDO::PARAM_INT);
-        $stmt->execute();
-
-        json_response(['leaderboard' => $stmt->fetchAll()]);
-
-    } catch (PDOException $e) {
-        error_response('Database Error: ' . $e->getMessage(), 500);
-    }
-}
+}
--- a/public/api/db.php
+++ b/public/api/db.php
@@ -110,22 +110,4 @@ function get_categories() {
        'industry'    => ['label' => 'Industrie',   'faIcon' => 'fa-industry',      'color' => '#7030A0'],
        'other'       => ['label' => 'Sonstiges',   'faIcon' => 'fa-thumbtack',     'color' => '#7F7F7F'],
    ];
-}
-
-// ---------------------------------------------------------------------
-// Task Category Definitions
-// Returns associative Array of Task Category Keys to Labels, Icons,
-// and Colors. Shared between Citizen Participation Portal and
-// Moderation Page.
-// ToDo: Move to Database Table. 
-// ---------------------------------------------------------------------
-function get_task_categories() {
-    return [
-        'repair'     => ['label' => 'Reparatur',       'faIcon' => 'fa-wrench',         'color' => '#C00000'],
-        'social'     => ['label' => 'Nachbarschaft',   'faIcon' => 'fa-people-group',   'color' => '#E65100'],
-        'safety'     => ['label' => 'Sicherheit',      'faIcon' => 'fa-shield-halved',  'color' => '#FFC000'],
-        'greenery'   => ['label' => 'Grünpflege',      'faIcon' => 'fa-leaf',           'color' => '#92D050'],
-        'cleanup'    => ['label' => 'Sauberkeit',      'faIcon' => 'fa-broom',          'color' => '#0070C0'],
-        'other_task' => ['label' => 'Sonstiges',       'faIcon' => 'fa-clipboard-check','color' => '#7F7F7F'],
-    ];
 }
--- a/public/index.php
+++ b/public/index.php
@@ -130,71 +130,30 @@ $news_items = $stmt->fetchAll();
            <!-- Sidebar Tab Icons -->
            <div class="leaflet-sidebar-tabs">
                <ul role="tablist">
-                    <li><a href="#tab-contributions" role="tab" title="Hinweise"><i class="fa-solid fa-clipboard-list"></i></a></li>
-                    <li><a href="#tab-tasks" role="tab" title="Aufgaben"><i class="fa-solid fa-clipboard-check"></i></a></li>
-                    <li><a href="#tab-list" role="tab" title="Beiträge"><i class="fa-solid fa-list"></i></a></li>
-                    <li><a href="#tab-news" role="tab" title="Neuigkeiten"><i class="fa-solid fa-newspaper"></i></a></li>
-                    <li><a href="#tab-help" role="tab" title="Hilfe"><i class="fa-solid fa-circle-question"></i></a></li>
+                    <li><a href="#tab-home" role="tab"><i class="fa-solid fa-house"></i></a></li>
+                    <li><a href="#tab-list" role="tab"><i class="fa-solid fa-list"></i></a></li>
+                    <li><a href="#tab-news" role="tab"><i class="fa-solid fa-newspaper"></i></a></li>
+                    <li><a href="#tab-help" role="tab"><i class="fa-solid fa-circle-question"></i></a></li>
                </ul>
            </div>

            <!-- Sidebar Tab Content -->
            <div class="leaflet-sidebar-content">

-                <!-- Contributions Tab -->
-                <div class="leaflet-sidebar-pane" id="tab-contributions">
+                <!-- Home Tab -->
+                <div class="leaflet-sidebar-pane" id="tab-home">
                    <h2 class="leaflet-sidebar-header">
-                        Hinweise
+                        Start
                        <span class="leaflet-sidebar-close"><i class="fa-solid fa-xmark"></i></span>
                    </h2>
                    <div class="sidebar-body">
-                        <p>Verwenden Sie die Karte, um <strong>Hinweise</strong> für die Stadtverwaltung hinzuzufügen oder bestehende Hinweise zu betrachten, bewerten und kommentieren</p>
+                        <p>Willkommen beim Bürgerbeteiligungsportal <strong><?= htmlspecialchars($municipality['name']) ?></strong>.</p>
+                        <p>Verwenden Sie die Karte, um Hinweise für die Stadtverwaltung hinzuzufügen oder bestehende Beiträge zu betrachten, zu bewerten und zu kommentieren.</p>

                        <h3>Kategorien</h3>
                        <div id="category-filter">
-                            <!-- populated by app.js -->
+                            <!-- Category Filter Checkboxes — populated by app.js -->
                        </div>
-                        
-                        <p id="stats-container"></p>
-                        <!-- populated by app.js -->
-                    </div>
-                </div>
-
-                <!-- Tasks Tab -->
-                <div class="leaflet-sidebar-pane" id="tab-tasks">
-                    <h2 class="leaflet-sidebar-header">
-                        Aufgaben
-                        <span class="leaflet-sidebar-close"><i class="fa-solid fa-xmark"></i></span>
-                    </h2>
-                    <div class="sidebar-body">
-                        <p>Verwenden Sie die Karte, um <strong>Aufgaben</strong> für die Gemeinschaft hinzuzufügen oder bestehende Aufgaben zu betrachten, bewerten und kommentieren.</p>                     
-
-                        <h3>Kategorien</h3>
-                        <div id="task-category-filter">
-                            <!-- populated by app.js -->
-                        </div>
-                        <p id="task-stats-container">
-                            <!-- populated by app.js -->
-                        </p>
-
-                        <div class="task-filter-row">
-                            <select id="task-status-filter" class="form-input" onchange="updateTasksList()" style="margin-bottom:8px;">
-                                <option value="open">Offene Aufgaben</option>
-                                <option value="all">Alle Aufgaben</option>
-                                <option value="completed">Wartend auf Prüfung</option>
-                                <option value="verified">Erledigte Aufgaben</option>
-                            </select>
-                        </div>
-
-                        <!-- Leaderboard -->
-                        <div id="leaderboard-container" class="leaderboard-box">
-                            <h3>Rangliste</h3>
-                            <div id="leaderboard-list"></div>
-                            <button class="btn btn-secondary leaderboard-more-btn" onclick="showFullLeaderboard()">
-                                Vollständige Rangliste
-                            </button>
-                        </div>
-
                    </div>
                </div>

@@ -209,10 +168,10 @@ $news_items = $stmt->fetchAll();
                            <input type="text" id="list-search-input" placeholder="Beiträge durchsuchen..." class="form-input">
                        </div>
                        <div id="contributions-list">
-                            <!-- populated by app.js -->
+                            <!-- Contribution Cards — populated by app.js -->
                        </div>
                    </div>
-                </div>
+                </div>            

                <!-- News Tab -->
                <div class="leaflet-sidebar-pane" id="tab-news">
@@ -221,18 +180,21 @@ $news_items = $stmt->fetchAll();
                        <span class="leaflet-sidebar-close"><i class="fa-solid fa-xmark"></i></span>
                    </h2>
                    <div class="sidebar-body">
+                        <!-- News Search -->
                        <div class="list-search">
                            <input type="text" id="news-search-input" placeholder="Neuigkeiten durchsuchen..." class="form-input" oninput="filterNews()">
                        </div>
+
+                        <!-- News Items Container -->
                        <div id="news-list">
                            <?php if (empty($news_items)): ?>
-                                <p style="text-align:center;color:#999;padding:20px;">Noch keine Neuigkeiten veröffentlicht.</p>
+                                <p class="empty-state">Noch keine Neuigkeiten veröffentlicht.</p>
                            <?php else: ?>
                                <?php foreach ($news_items as $news): ?>
                                    <div class="news-item"
-                                        data-title="<?= htmlspecialchars(strtolower($news['title'])) ?>"
-                                        data-content="<?= htmlspecialchars(strtolower($news['content'])) ?>"
-                                        data-author="<?= htmlspecialchars(strtolower($news['author_name'])) ?>">
+                                         data-title="<?= htmlspecialchars(strtolower($news['title'])) ?>"
+                                         data-content="<?= htmlspecialchars(strtolower($news['content'])) ?>"
+                                         data-author="<?= htmlspecialchars(strtolower($news['author_name'])) ?>">
                                        <h3><?= htmlspecialchars($news['title']) ?></h3>
                                        <p><?= nl2br(htmlspecialchars($news['content'])) ?></p>
                                        <span class="news-date">
@@ -246,7 +208,7 @@ $news_items = $stmt->fetchAll();
                    </div>
                </div>

-                <!-- Help Tab -->
+                    <!-- Help Tab -->
                <div class="leaflet-sidebar-pane" id="tab-help">
                    <h2 class="leaflet-sidebar-header">
                        Hilfe
@@ -273,16 +235,12 @@ $news_items = $stmt->fetchAll();
                        <h3><i class="fa-solid fa-comments"></i> Kommentieren</h3>
                        <p>Gerne können Sie Ihre Meinung zu bestehenden Beiträgen auch durch die Kommentarfunktion äußern.</p>

-                        <h3><i class="fa-solid fa-clipboard-check"></i> Aufgaben erledigen</h3>
-                        <p>Klicken Sie auf eine offene Aufgabe und melden Sie die Erledigung mit einem Foto-Nachweis.</p>
-
                        <h3><i class="fa-solid fa-magnifying-glass"></i> Suchen</h3>
-                        <p>Verwenden Sie die Adresssuche rechts, um schnell den richtigen Ort auf der Mitmachkarte zu finden.</p>
+                        <p>Verwenden Sie die Adresssuche rechts, um schnell den richtigen Ort auf der Mitmachkarte zu finden.</p>         
                    </div>
                </div>

            </div>
-
        </div>

        <!-- Leaflet Map -->
@@ -351,7 +309,7 @@ $news_items = $stmt->fetchAll();
    <!-- ============================================================= -->
    <div id="create-modal" class="modal-overlay" style="display:none;">
        <div class="modal-content">
-            <h2><i class="fa-solid fa-plus-circle"></i> Beitrag</h2>
+            <h2><i class="fa-solid fa-pencil"></i> Beitrag hinzufügen</h2>
 
            <div class="form-group">
                <label for="create-category">Kategorie</label>
@@ -439,7 +397,6 @@ $news_items = $stmt->fetchAll();

        // Category Definitions from Database
        const CATEGORIES = <?= json_encode(get_categories(), JSON_UNESCAPED_UNICODE) ?>;
-        const TASK_CATEGORIES = <?= json_encode(get_task_categories(), JSON_UNESCAPED_UNICODE) ?>;

        // Admin Status from PHP Session
        const IS_ADMIN = <?= (function_exists('is_admin') && is_admin()) ? 'true' : 'false' ?>;
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -220,6 +220,21 @@ sidebar = L.control.sidebar({
    position: 'left'
 }).addTo(map);

+// Hides Map Controls on Mobile while Sidebar is open
+sidebar.on('content', function () {
+    if (window.innerWidth < 769) {
+        document.querySelectorAll('.leaflet-top.leaflet-right').forEach(function (el) {
+            el.style.display = 'none';
+        });
+    }
+});
+
+sidebar.on('closing', function () {
+    document.querySelectorAll('.leaflet-top.leaflet-right').forEach(function (el) {
+        el.style.display = '';
+    });
+});
+

 // =====================================================================
 // Block 6: Geoman Drawing Tools and CRUD Trigger
@@ -346,7 +361,7 @@ function loadContributions() {
        layerControl.addOverlay(contributionsLayer, '<i class="fa-solid fa-map-pin" style="color:#C00000;"></i> Beiträge');
        // Update Sidebar List and Statistics
        updateContributionsList();
-        updateStatistics();
+        buildCategoryFilter();
    });
 }

@@ -473,11 +488,25 @@ function buildPopupHtml(feature) {
 function bindFeaturePopup(feature, layer) {
    const cat = CATEGORIES[feature.properties.category] || CATEGORIES.other;

-    // Dynamic Popup — rebuilt every Time the Popup opens
-    layer.bindPopup(function () { return buildPopupHtml(feature); }, { maxWidth: 320, minWidth: 240 });
+    // Popup Options — Mobile narrower with Header/Footer Padding
+    var mobile = window.innerWidth < 769;
+    var opts = {
+        maxWidth: mobile ? 280 : 320,
+        minWidth: mobile ? 200 : 240,
+        maxHeight: mobile ? 280 : 400,
+        autoPanPaddingTopLeft:     L.point(mobile ? 50 : 75, mobile ? 75 : 75),
+        autoPanPaddingBottomRight: L.point(mobile ? 60 : 85, mobile ? 50 : 75),
+        className: 'contribution-popup'
+    };

-    // Loads Comments when Popup opens
+    // Dynamic Popup — rebuilt every Time the Popup opens
+    layer.bindPopup(function () { return buildPopupHtml(feature); }, opts);
+
+    // Closes Sidebar on Mobile and loads Comments when Popup opens
    layer.on('popupopen', function () {
+        if (window.innerWidth < 769) {
+            sidebar.close();
+        }
        loadComments(feature.properties.contribution_id);
    });

@@ -766,7 +795,7 @@ function updateContributionsList() {

    // Builds HTML
    if (filtered.length === 0) {
-        container.innerHTML = '<p style="text-align:center;color:#999;padding:20px;">Keine Beiträge gefunden.</p>';
+        container.innerHTML = '<p class="empty-state">Keine Beiträge gefunden.</p>';
        return;
    }

@@ -830,22 +859,33 @@ document.getElementById('list-search-input').addEventListener('input', function
 // Block 12: Sidebar Category Filter and Statistics
 // =====================================================================

-// Builds Category Filter Checkboxes
+// Builds Category Filter Checkboxes with Counts
 function buildCategoryFilter() {
    const container = document.getElementById('category-filter');
+
+    const counts = {};
+    contributionsData.forEach(function (f) {
+        const cat = f.properties.category;
+        counts[cat] = (counts[cat] || 0) + 1;
+    });
+
+    const total = contributionsData.length;
    let html = '';

    for (const key in CATEGORIES) {
        const cat = CATEGORIES[key];
        const checked = activeFilters.indexOf(key) !== -1 ? 'checked' : '';
+        const count = counts[key] || 0;

-        html += '' +
-            '<label style="display:flex;align-items:center;gap:8px;margin-bottom:6px;cursor:pointer;">' +
-                '<input type="checkbox" value="' + key + '" ' + checked + ' onchange="toggleCategoryFilter(this)">' +
-                '<span>' + categoryIcon(cat) + ' ' + cat.label + '</span>' +
-            '</label>';
+        html += '<label style="display:flex;align-items:center;gap:8px;margin-bottom:6px;cursor:pointer;font-size:0.85rem;color:var(--color-text-secondary)">' +
+                    '<input type="checkbox" value="' + key + '" ' + checked + ' onchange="toggleCategoryFilter(this)">' +
+                    categoryIcon(cat) +
+                    '<span>' + cat.label + ' (' + count + ')</span>' +
+                '</label>';
    }

+    html += '<p style="margin-top:10px;font-size:0.85rem;color:var(--color-text-secondary)"><strong>' + total + '</strong> Beiträge insgesamt</p>';
+
    container.innerHTML = html;
 }

@@ -892,34 +932,6 @@ function toggleCategoryFilter(checkbox) {
    updateContributionsList();
 }

-// Updates Statistics in Home Tab
-function updateStatistics() {
-    const container = document.getElementById('stats-container');
-    const total = contributionsData.length;
-
-    // Counts per Category
-    // const counts = {};
-    // contributionsData.forEach(function (f) {
-    //     const cat = f.properties.category;
-    //     counts[cat] = (counts[cat] || 0) + 1;
-    // });
-
-    let html = '<p style="font-size:0.8rem;"><strong>' + total + '</strong> Hinweise insgesamt</p>';
-
-    // for (const key in CATEGORIES) {
-    //     const cat = CATEGORIES[key];
-    //     const count = counts[key] || 0;
-    //     if (count > 0) {
-    //         html += '<div style="display:flex;align-items:center;gap:8px;margin:4px 0;font-size:0.8rem;">' +
-    //             categoryIcon(cat) + ' ' +
-    //             cat.label + ': ' + count +
-    //         '</div>';
-    //     }
-    // }
-
-    container.innerHTML = html;
-}
-

 // =====================================================================
 // Block 13: Modals — Welcome, Login, Info, Privacy, Imprint
@@ -957,6 +969,11 @@ function submitLogin() {
    document.cookie = 'webgis_user=' + encodeURIComponent(name) + ';path=/;max-age=31536000;SameSite=Lax';
    document.getElementById('login-modal').style.display = 'none';

+    // Starts Onboarding Tour on first Login
+    if (!localStorage.getItem('webgis_onboarding_done')) {
+        setTimeout(function () { startTour(); }, 500);
+    }
+
    // Open Create Modal if Geometry is pending 
    if (drawnGeometry) {
        document.getElementById('create-geom').value = JSON.stringify(drawnGeometry);
@@ -967,6 +984,11 @@ function submitLogin() {

 function skipLogin() {
    document.getElementById('login-modal').style.display = 'none';
+
+    // Starts Onboarding Tour on first Login
+    if (!localStorage.getItem('webgis_onboarding_done')) {
+        setTimeout(function () { startTour(); }, 500);
+    }
 }

 // Info Modal
@@ -1034,7 +1056,7 @@ function escapeHtml(text) {

 // Returns a colored Font Awesome Icon HTML String for a Category
 function categoryIcon(cat) {
-    return '<i class="fa-solid ' + cat.faIcon + '" style="color:' + cat.color + ';"></i>';
+    return '<i class="fa-solid ' + cat.faIcon + ' fa-fw" style="color:' + cat.color + ';"></i>';
 }

 // Reverse Geocodes Coordinates and saves Address to Contribution via API
@@ -1160,7 +1182,24 @@ function deleteComment(commentId, contributionId) {
    });
 }

-// Toggles Photo Visibility in Popup
+// Pans Map if Popup behind Header
+function recenterPopup() {
+    map.eachLayer(function (layer) {
+        if (layer.getPopup && layer.getPopup() && layer.isPopupOpen()) {
+            var popupEl = layer.getPopup().getElement();
+            if (!popupEl) return;
+            var padding = window.innerWidth < 769 ? 75 : 75;
+            var popupTop = popupEl.getBoundingClientRect().top;
+            var mapTop = document.getElementById('map').getBoundingClientRect().top;
+            var diff = popupTop - mapTop - padding;
+            if (diff < 0) {
+                map.panBy([0, diff], { animate: true, duration: 0.3 });
+            }
+        }
+    });
+}
+
+// Toggles Photo Visibility in Popup and updates Popup Position
 function togglePhoto(contributionId) {
    const container = document.getElementById('photo-container-' + contributionId);
    const label = document.getElementById('photo-label-' + contributionId);
@@ -1173,9 +1212,11 @@ function togglePhoto(contributionId) {
        container.style.display = 'none';
        label.textContent = 'Foto anzeigen';
    }
+
+    setTimeout(recenterPopup, 150);
 }

-// Toggles Comments Section Visibility in Popup
+// Toggles Comments Section Visibility in Popup and updates Popup Position
 function toggleComments(contributionId) {
    const section = document.getElementById('comments-section-' + contributionId);
    const toggle = document.getElementById('comments-toggle-' + contributionId);
@@ -1192,6 +1233,8 @@ function toggleComments(contributionId) {
        toggle.classList.remove('fa-chevron-up');
        toggle.classList.add('fa-chevron-down');
    }
+
+    setTimeout(recenterPopup, 150);
 }


--- a/public/js/onboarding.js
+++ b/public/js/onboarding.js
@@ -1,6 +1,7 @@
 // =====================================================================
 // WebGIS Citizen Participation Portal — Onboarding Tour
-// Guides Users through the Participation Portal
+// Guides Users through the Participation Portal.
+// On Mobile centered Overlays. On Desktop attached to User Interface.
 // =====================================================================


@@ -8,76 +9,30 @@
 // Block 1: Onboarding Configuration
 // =================================================================

-// ONBOARDING_MODE — Controls when the Tutorial is shown:
-const ONBOARDING_MODE = 'once';
-//     'once'    — Shown on first Visit, stored in localStorage
-//     'session' — Shown per Browser Session, stored in sessionStorage
-//     'always'  — Shows always, nothing stored
-
 // Prevents double Initialization
 let onboardingStarted = false;

-
-// =================================================================
-// Block 2: Tour Initialization
-// =================================================================
-
-function initOnboardingTour() {
-
-    // Checks if Tutorial should be shown based on Onboarding Mode
-    if (ONBOARDING_MODE === 'once' && localStorage.getItem('webgis_onboarding_done')) {
-        return;
-    }
-    if (ONBOARDING_MODE === 'session' && sessionStorage.getItem('webgis_onboarding_done')) {
-        return;
-    }
-
-    // Waits for Welcome and Login Modals to be closed
-    waitForModalsToClose(function () {
-        setTimeout(startTour, 600);
-    });
+// Detects Mobile Viewport
+function isMobile() {
+    return window.innerWidth < 769;
 }


 // =================================================================
-// Block 3: Modal Watcher — Starts Tour other Welcome and Login Modals closed
+// Block 2: Tour Definition
 // =================================================================

-function waitForModalsToClose(callback) {
-    const welcomeModal = document.getElementById('welcome-modal');
-    const loginModal = document.getElementById('login-modal');
-
-    const checkInterval = setInterval(function () {
-        const welcomeHidden = !welcomeModal || welcomeModal.style.display === 'none' || welcomeModal.style.display === '';
-        const loginHidden = !loginModal || loginModal.style.display === 'none' || loginModal.style.display === '';
-
-        if (welcomeHidden && loginHidden) {
-            clearInterval(checkInterval);
-            callback();
-        }
-    }, 300);
-
-    // Safety Timeout
-    setTimeout(function () {
-        clearInterval(checkInterval);
-        callback();
-    }, 30000);
-}
-
-
-// =================================================================
-// Block 4: Tour Definition
-// =================================================================
-
-function startTour() {
+function startTour(manual) {
    // Prevents double Start
    if (onboardingStarted) return;
    onboardingStarted = true;

+    const mobile = isMobile();
+
    const tour = new Shepherd.Tour({
-        useModalOverlay: true,
+        useModalOverlay: !mobile,
        defaultStepOptions: {
-            cancelIcon: { enabled: true },
+            cancelIcon: { enabled: false },
            scrollTo: false,
            classes: 'onboarding-step',
            popperOptions: {
@@ -89,46 +44,54 @@ function startTour() {
    });


+// -----------------------------------------------------------------
+    // Step 1: Welcome — Skip Timer at automatic Start
    // -----------------------------------------------------------------
-    // Step 1: Welcome
-    // -----------------------------------------------------------------
+    var welcomeButtons = [
+        {
+            text: 'Überspringen',
+            action: tour.cancel,
+            classes: 'shepherd-button-secondary' + (manual ? '' : ' skip-btn-locked')
+        },
+        {
+            text: 'Los geht\'s <i class="fa-solid fa-arrow-right"></i>',
+            action: tour.next,
+            classes: 'shepherd-button-primary'
+        }
+    ];
+
    tour.addStep({
        id: 'welcome',
-        title: '<i class="fa-solid fa-hand-wave"></i> Wilkommen bei der Mitmachkarte!',
-        text: 'Dieses interaktive Tutorial zeigt Ihnen die Kernfunktionen der Mitmachkarte.' +
-              '<br><br><span style="font-size:0.8rem;color:var(--color-text-secondary);">Sie können das Tutorial jederzeit durch den Hilfe-Tab der Seitenleiste wiederholen.</span>',
-        buttons: [
-            {
-                text: 'Überspringen',
-                action: tour.cancel,
-                classes: 'shepherd-button-secondary'
-            },
-            {
-                text: 'Los geht\'s <i class="fa-solid fa-arrow-right"></i>',
-                action: tour.next,
-                classes: 'shepherd-button-primary'
+        title: '<i class="fa-solid fa-hand-wave"></i> Willkommen bei der Mitmachkarte!',
+        text: 'Dieses <strong>interaktive Tutorial</strong> zeigt Ihnen die Kernfunktionen der Mitmachkarte.' +
+              '<br><br><span style="color:var(--color-text-secondary);">Sie können das Tutorial jederzeit über den Hilfe-Tab der Seitenleiste wiederholen.</span>',
+        buttons: welcomeButtons,
+        when: {
+            show: function () {
+                if (manual) return;
+
+                // Locks Skip Button with Progress Bar for 5 Seconds
+                var skipBtn = document.querySelector('.skip-btn-locked');
+                if (!skipBtn) return;
+                skipBtn.disabled = true;
+                skipBtn.style.pointerEvents = 'none';
+
+                setTimeout(function () {
+                    skipBtn.disabled = false;
+                    skipBtn.style.pointerEvents = '';
+                    skipBtn.classList.remove('skip-btn-locked');
+                }, 5000);
            }
-        ]
+        }
    });


    // -----------------------------------------------------------------
    // Step 2: Drawing Tools
    // -----------------------------------------------------------------
-    tour.addStep({
+    var drawingStep = {
        id: 'drawing-tools',
        title: '<i class="fa-solid fa-pencil"></i> Beitrag hinzufügen',
-        text: 'Verwenden Sie die <strong>Zeichenwerkzeuge</strong>, um Hinweise, Anregungen und Vorschläge auf der Mitmachkarte als Punkte, Linien oder Flächen hinzuzufügen.',
-        attachTo: {
-            element: '.leaflet-pm-toolbar',
-            on: 'left'
-        },
-        beforeShowPromise: function () {
-            return new Promise(function (resolve) {
-                sidebar.close();
-                setTimeout(resolve, 300);
-            });
-        },
        buttons: [
            {
                text: '<i class="fa-solid fa-arrow-left"></i> Zurück',
@@ -141,20 +104,32 @@ function startTour() {
                classes: 'shepherd-button-primary'
            }
        ]
-    });
+    };
+
+    if (mobile) {
+        drawingStep.text = 'Verwenden Sie die <strong>Zeichenwerkzeuge</strong> ' +
+            '<i class="fa-solid fa-location-dot"></i> ' +
+            'rechts, um Hinweise als Punkte, Linien oder Flächen hinzuzufügen.';
+    } else {
+        drawingStep.text = 'Verwenden Sie die <strong>Zeichenwerkzeuge</strong>, um Hinweise, Anregungen und Vorschläge auf der Mitmachkarte als Punkte, Linien oder Flächen hinzuzufügen.';
+        drawingStep.attachTo = { element: '.leaflet-pm-toolbar', on: 'left' };
+        drawingStep.beforeShowPromise = function () {
+            return new Promise(function (resolve) {
+                sidebar.close();
+                setTimeout(resolve, 300);
+            });
+        };
+    }
+
+    tour.addStep(drawingStep);


    // -----------------------------------------------------------------
    // Step 3: Address Search
    // -----------------------------------------------------------------
-    tour.addStep({
+    var searchStep = {
        id: 'address-search',
        title: '<i class="fa-solid fa-magnifying-glass"></i> Adresssuche',
-        text: 'Verwenden Sie die <strong>Adresssuche</strong>, um schnell den richtigen Ort auf der Mitmachkarte zu finden.',
-        attachTo: {
-            element: '.leaflet-control-geocoder',
-            on: 'left'
-        },
        buttons: [
            {
                text: '<i class="fa-solid fa-arrow-left"></i> Zurück',
@@ -167,20 +142,25 @@ function startTour() {
                classes: 'shepherd-button-primary'
            }
        ]
-    });
+    };
+
+    if (mobile) {
+        searchStep.text = 'Verwenden Sie die <strong>Adresssuche</strong> ' +
+            '<i class="fa-solid fa-magnifying-glass"></i> rechts, um schnell den richtigen Ort auf der Mitmachkarte zu finden.';
+    } else {
+        searchStep.text = 'Verwenden Sie die <strong>Adresssuche</strong>, um schnell den richtigen Ort auf der Mitmachkarte zu finden.';
+        searchStep.attachTo = { element: '.leaflet-control-geocoder', on: 'left' };
+    }
+
+    tour.addStep(searchStep);


    // -----------------------------------------------------------------
    // Step 4: Layer Control
    // -----------------------------------------------------------------
-    tour.addStep({
+    var layerStep = {
        id: 'layer-control',
        title: '<i class="fa-solid fa-layer-group"></i> Kartenansicht',
-        text: 'Wechseln Sie zwischen verschiedenen <strong>Hintergrundkarten</strong> und <strong>Satellitenbildern</strong>.',
-        attachTo: {
-            element: '.leaflet-control-layers',
-            on: 'left'
-        },
        buttons: [
            {
                text: '<i class="fa-solid fa-arrow-left"></i> Zurück',
@@ -193,26 +173,25 @@ function startTour() {
                classes: 'shepherd-button-primary'
            }
        ]
-    });
+    };
+
+    if (mobile) {
+        layerStep.text = 'Wechseln Sie über das <strong>Layer-Symbol</strong> ' +
+            '<i class="fa-solid fa-layer-group"></i> oben rechts zwischen verschiedenen Hintergrundkarten und Satellitenbildern.';
+    } else {
+        layerStep.text = 'Wechseln Sie zwischen verschiedenen <strong>Hintergrundkarten</strong> und <strong>Satellitenbildern</strong>.';
+        layerStep.attachTo = { element: '.leaflet-control-layers', on: 'left' };
+    }
+
+    tour.addStep(layerStep);


    // -----------------------------------------------------------------
    // Step 5: Sidebar
    // -----------------------------------------------------------------
-    tour.addStep({
+    var sidebarStep = {
        id: 'sidebar',
        title: '<i class="fa-solid fa-bars"></i> Seitenleiste',
-        text: 'In der Seitenleiste finden Sie <strong>Hilfestellungen</strong>, <strong>Listenansichten</strong> und <strong>Neuigkeiten</strong>.',
-        attachTo: {
-            element: '#sidebar',
-            on: 'right'
-        },
-        beforeShowPromise: function () {
-            return new Promise(function (resolve) {
-                sidebar.open('tab-help');
-                setTimeout(resolve, 400);
-            });
-        },
        buttons: [
            {
                text: '<i class="fa-solid fa-arrow-left"></i> Zurück',
@@ -220,58 +199,106 @@ function startTour() {
                classes: 'shepherd-button-secondary'
            },
            {
-                text: 'Tutorial abschließen <i class="fa-solid fa-check"></i>',
+                text: 'Abschließen <i class="fa-solid fa-check"></i>',
                action: tour.next,
                classes: 'shepherd-button-primary'
            }
        ]
-    });
+    };
+
+    if (mobile) {
+        sidebarStep.text = 'In der <strong>Seitenleiste</strong> ' +
+            '<i class="fa-solid fa-house"></i> ' +
+            'links finden Sie Hilfestellungen, Listenansichten und Neuigkeiten.';
+    } else {
+        sidebarStep.text = 'In der <strong>Seitenleiste</strong> finden Sie Hilfestellungen, Listenansichten und Neuigkeiten.';
+        sidebarStep.attachTo = { element: '#sidebar', on: 'right' };
+        sidebarStep.beforeShowPromise = function () {
+            return new Promise(function (resolve) {
+                sidebar.open('tab-help');
+                setTimeout(resolve, 400);
+            });
+        };
+    }
+
+    tour.addStep(sidebarStep);


    // -----------------------------------------------------------------
-    // Completion and Cancellation
+    // Completion and Cancellation — shows Drawing Arrow
    // -----------------------------------------------------------------
-    tour.on('complete', function () {
-        markOnboardingDone();
+    function onTourEnd() {
        onboardingStarted = false;
-    });
+        if (mobile) sidebar.close();

-    tour.on('cancel', function () {
-        markOnboardingDone();
-        onboardingStarted = false;
-    });
+        // Shows Arrow Hint
+        if (!localStorage.getItem('webgis_onboarding_done')) {
+            localStorage.setItem('webgis_onboarding_done', 'true');
+            showDrawingArrow();
+        }
+    }
+
+    tour.on('complete', onTourEnd);
+    tour.on('cancel', onTourEnd);

    tour.start();
 }


 // =================================================================
-// Marks Onboarding as completed
+// Drawing Arrow — Points to Geoman Toolbar after Tour
 // =================================================================

-function markOnboardingDone() {
-    if (ONBOARDING_MODE === 'once') {
-        localStorage.setItem('webgis_onboarding_done', 'true');
-    } else if (ONBOARDING_MODE === 'session') {
-        sessionStorage.setItem('webgis_onboarding_done', 'true');
+function showDrawingArrow() {
+    var hint = document.createElement('div');
+    hint.id = 'drawing-hint-arrow';
+    hint.innerHTML = '<span class="drawing-hint-label">' +
+                         '<i class="fa-solid fa-pencil"></i> Beitrag hinzufügen' +
+                     '</span>' +
+                     '<span class="drawing-hint-chevrons">' +
+                         '<i class="fa-solid fa-chevron-right"></i>' +
+                         '<i class="fa-solid fa-chevron-right"></i>' +
+                     '</span>';
+    document.body.appendChild(hint);
+
+    // Positions Hint centered on Geoman Toolbar
+    function positionHint() {
+        var toolbar = document.querySelector('.leaflet-pm-toolbar');
+        if (!toolbar) { removeDrawingArrow(); return; }
+
+        var rect = toolbar.getBoundingClientRect();
+        var hintHeight = hint.offsetHeight || 32;
+        hint.style.top = (rect.top + (rect.height / 2) - (hintHeight / 2)) + 'px';
+        hint.style.right = (window.innerWidth - rect.left + 10) + 'px';
+    }
+
+    positionHint();
+    window.addEventListener('resize', positionHint);
+
+    var timeout = setTimeout(removeDrawingArrow, 60000);
+
+    map.on('pm:globaldrawmodetoggled', function onDraw() {
+        clearTimeout(timeout);
+        removeDrawingArrow();
+        map.off('pm:globaldrawmodetoggled', onDraw);
+        window.removeEventListener('resize', positionHint);
+    });
+}
+
+function removeDrawingArrow() {
+    var arrow = document.getElementById('drawing-hint-arrow');
+    if (arrow) {
+        arrow.classList.add('fade-out');
+        setTimeout(function () { arrow.remove(); }, 300);
    }
 }


 // =================================================================
-// Manual Tour Restart
+// Manual Tour Restart (from Info Modal or Help Tab)
 // =================================================================

 function restartOnboarding() {
-    localStorage.removeItem('webgis_onboarding_done');
-    sessionStorage.removeItem('webgis_onboarding_done');
    onboardingStarted = false;
-    startTour();
-}
-
-
-// =================================================================
-// Auto-Start on Page Load
-// =================================================================
-
-initOnboardingTour();
+    startTour(true);
+}
--- a/public/styles.css
+++ b/public/styles.css
@@ -464,6 +464,7 @@ select.form-input { cursor: pointer; }
    margin-bottom: var(--space-sm);
    line-height: 1.5;
    color: var(--color-text-secondary);
+    font-size: 0.85rem;
 }


@@ -694,8 +695,6 @@ select.form-input { cursor: pointer; }
 }

 .popup-comments-list {
-    max-height: 150px;
-    overflow-y: auto;
    margin-top: var(--space-sm);
 }

@@ -874,6 +873,97 @@ select.form-input { cursor: pointer; }
    transform: translate(-50%, -50%) !important;
 }

+
+/* -----------------------------------------------------------------
+   4.10 Skip Button Progress Bar (Onboarding)
+   ----------------------------------------------------------------- */
+.skip-btn-locked {
+    position: relative;
+    overflow: hidden;
+    opacity: 0.6;
+}
+
+.skip-btn-locked::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 0%;
+    background: rgba(0, 0, 0, 0.12);
+    border-radius: 6px;
+    animation: skip-fill 5s linear forwards;
+    pointer-events: none;
+}
+
+@keyframes skip-fill {
+    from { width: 0%; }
+    to   { width: 100%; opacity: 0; }
+}
+
+
+/* -----------------------------------------------------------------
+   4.11 Drawing Hint Arrow after Onboarding
+   ----------------------------------------------------------------- */
+#drawing-hint-arrow {
+    position: fixed;
+    z-index: 1500;
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    pointer-events: none;
+    animation: hint-fade-in 400ms ease;
+    transition: opacity 300ms ease;
+}
+
+#drawing-hint-arrow.fade-out {
+    opacity: 0;
+}
+
+.drawing-hint-label {
+    background: var(--color-primary);
+    color: white;
+    font-family: var(--font-body);
+    font-size: 0.78rem;
+    font-weight: 600;
+    padding: 6px 14px;
+    border-radius: 20px;
+    white-space: nowrap;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+    display: flex;
+    align-items: center;
+    gap: 6px;
+}
+
+.drawing-hint-chevrons {
+    display: flex;
+    gap: 0;
+    color: var(--color-primary);
+    font-size: 1.2rem;
+    font-weight: 900;
+    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.2));
+}
+
+.drawing-hint-chevrons i:nth-child(1) {
+    animation: chevron-pulse 1.2s ease-in-out infinite;
+    opacity: 0.4;
+}
+
+.drawing-hint-chevrons i:nth-child(2) {
+    animation: chevron-pulse 1.2s ease-in-out 0.3s infinite;
+    opacity: 0.7;
+}
+
+@keyframes chevron-pulse {
+    0%, 100% { transform: translateX(0); opacity: 0.3; }
+    50% { transform: translateX(3px); opacity: 1; }
+}
+
+@keyframes hint-fade-in {
+    from { opacity: 0; transform: translateX(-10px); }
+    to   { opacity: 1; transform: translateX(0); }
+}
+
 /* Mobile */
@media (max-width: 768px) {
    .shepherd-element { max-width: 300px !important; }
@@ -881,72 +971,6 @@ select.form-input { cursor: pointer; }
 }


-/* -----------------------------------------------------------------
-   4.10 Create Type Toggle (Contribution or Task)
-   ----------------------------------------------------------------- */
-.create-type-toggle {
-    display: flex;
-    gap: 8px;
-}
-
-.create-type-btn {
-    flex: 1;
-    padding: 10px;
-    border: 2px solid var(--color-border);
-    border-radius: 8px;
-    background: var(--color-surface);
-    cursor: pointer;
-    font-family: var(--font-body);
-    font-size: 0.85rem;
-    font-weight: 600;
-    color: var(--color-text-secondary);
-    transition: all var(--transition-fast);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    gap: 6px;
-}
-
-.create-type-btn:hover { border-color: var(--color-primary); color: var(--color-primary); }
-.create-type-btn.active { border-color: var(--color-primary); background: var(--color-primary-light); color: var(--color-primary); }
-
-
-/* -----------------------------------------------------------------
-   4.11 Leaderboard (Sidebar Tasks Tab)
-   ----------------------------------------------------------------- */
-.leaderboard-box {
-    background: var(--color-surface);
-    border: 1px solid var(--color-border);
-    border-radius: 8px;
-    padding: var(--space-md);
-    margin-bottom: var(--space-md);
-}
-
-.leaderboard-box h3 { margin-top: 0 !important; }
-
-.leaderboard-entry {
-    display: flex;
-    align-items: center;
-    gap: var(--space-sm);
-    padding: 6px 0;
-    font-size: 0.85rem;
-    border-bottom: 1px solid #f0f0f0;
-}
-
-.leaderboard-entry:last-child { border-bottom: none; }
-.leaderboard-rank { font-size: 1rem; width: 28px; text-align: center; }
-.leaderboard-name { flex: 1; font-weight: 600; }
-.leaderboard-points { color: var(--color-primary); font-weight: 600; }
-
-.leaderboard-more-btn {
-    width: 100%;
-    margin-top: var(--space-sm);
-    font-size: 0.8rem !important;
-    min-height: 32px !important;
-    padding: 4px 12px !important;
-}
-
-
 /* =================================================================
   SECTION 5: Admin-specific Styles (admin.php)
   ================================================================= */
@@ -1314,8 +1338,29 @@ select.form-input { cursor: pointer; }
    /* Legal */
    .page-content-box { padding: 20px; }
    .page-container { padding: 0 8px; }
+
+
+/* ---------------------------------------------------------
+       6.1 Prevents iOS Auto-Zoom on Inputs
+   --------------------------------------------------------- */
+    input, textarea, select {
+        font-size: 16px !important;
+    }
+
 }

@media (min-width: 769px) {
    :root { --map-side-padding: 8px; }
-}
+}
+
+/* ---------------------------------------------------------
+       6.3 Popup Content Height Limit on Mobile
+       Prevents Popup from growing beyond Screen when
+       Comments or Photos are toggled.
+       --------------------------------------------------------- */
+    .leaflet-popup-content {
+        max-height: 50vh;
+        max-width: 33vh;
+        overflow-y: auto;
+    }
+
Author	SHA1	Message	Date
patrickzerhusen	9b84ff1367	pans map if popup behind header	2026-06-12 12:27:16 +02:00
patrickzerhusen	7be37bd30f	removed cancel icon from onboarding popup	2026-06-12 12:03:44 +02:00
patrickzerhusen	2039f5d03d	fixed popup auto-position with padding	2026-06-11 17:10:19 +02:00
patrickzerhusen	38c48861a9	changed fa-icon in create modal	2026-06-11 16:39:52 +02:00
patrickzerhusen	30044e00e9	progress bar skip button, labeled arrow hint	2026-06-11 16:38:25 +02:00
patrickzerhusen	23027d54d7	optimized onboarding tutorial for mobile screens	2026-06-11 15:58:03 +02:00
patrickzerhusen	5e10d19bbd	hides map controls on mobile screens if sidebar open	2026-06-11 15:36:04 +02:00
patrickzerhusen	1953df262c	prevents auto-zoom on mobile screens	2026-06-11 15:15:50 +02:00
patrickzerhusen	ac40c7d949	updatet sidebar styling and texts, included statistics in category-filter	2026-05-13 14:21:05 +02:00