feat: Add gallery management to admin panel + system documentation

Features: - Gallery upload, delete, reorder (drag & drop) - Preview images in admin panel - Same upload flow as events (WebP conversion via sharp) - Complete system documentation explaining: - Architecture (Frontend/Backend/Volume) - Upload flow (Multipart → Sharp → WebP → Storage) - Why SQLite works on Fly.io (persistent volumes) - Troubleshooting guide Admin now has full CRUD for both Events and Gallery!
2025-12-09 17:08:36 +01:00
92 changed files with 957 additions and 4498 deletions
@@ -1,100 +1,4 @@
 steps:
-  audit_dependencies:
-    image: node:20
-    commands:
-      - npm install --package-lock-only
-      - npm audit --audit-level=moderate --json > audit-result.json 2>&1 || echo "Audit completed"
-      - npm audit --audit-level=moderate > audit-output.txt 2>&1 || echo "Audit completed"
-    when:
-      - branch: main
-        event: push
-
-  discord_notify_audit:
-    image: alpine:latest
-    environment:
-      DISCORD_WEBHOOK:
-        from_secret: discord_webhook
-    commands:
-      - apk add --no-cache curl jq
-      - |
-        if [ -f audit-result.json ]; then
-          TOTAL=$(jq -r '.metadata.vulnerabilities.total // 0' audit-result.json 2>/dev/null || echo "0")
-          CRITICAL=$(jq -r '.metadata.vulnerabilities.critical // 0' audit-result.json 2>/dev/null || echo "0")
-          HIGH=$(jq -r '.metadata.vulnerabilities.high // 0' audit-result.json 2>/dev/null || echo "0")
-          MODERATE=$(jq -r '.metadata.vulnerabilities.moderate // 0' audit-result.json 2>/dev/null || echo "0")
-          LOW=$(jq -r '.metadata.vulnerabilities.low // 0' audit-result.json 2>/dev/null || echo "0")
-
-          if [ "$CRITICAL" -gt 0 ] || [ "$HIGH" -gt 0 ] || [ "$MODERATE" -gt 0 ]; then
-            COLOR=16744448
-            STATUS="⚠️ Vulnerabilities Found"
-          else
-            COLOR=3066993
-            STATUS="✅ No Vulnerabilities"
-          fi
-
-          if [ -f audit-output.txt ]; then
-            VULNS=$(head -50 audit-output.txt | tail -40 || echo "No details")
-          else
-            VULNS="No audit output available"
-          fi
-
-          printf '%s' "$VULNS" > /tmp/vulns.txt
-
-          PAYLOAD=$(jq -n \
-            --arg title "🔒 Security Audit - Build #${CI_BUILD_NUMBER}" \
-            --arg status "$STATUS" \
-            --arg total "$TOTAL" \
-            --arg critical "$CRITICAL" \
-            --arg high "$HIGH" \
-            --arg moderate "$MODERATE" \
-            --arg low "$LOW" \
-            --arg commit "${CI_COMMIT_SHA:0:7}" \
-            --rawfile details /tmp/vulns.txt \
-            --arg timestamp "$(date -u +%Y-%m-%dT%H:%M:%S.000Z)" \
-            --argjson color "$COLOR" \
-            '{
-              embeds: [{
-                title: $title,
-                description: $status,
-                color: $color,
-                fields: [
-                  { name: "Total", value: $total, inline: true },
-                  { name: "Critical", value: $critical, inline: true },
-                  { name: "High", value: $high, inline: true },
-                  { name: "Moderate", value: $moderate, inline: true },
-                  { name: "Low", value: $low, inline: true },
-                  { name: "Commit", value: ("`" + $commit + "`"), inline: true },
-                  { name: "Details", value: ("```\n" + ($details[:800]) + (if ($details | length) > 800 then "\n... (truncated)" else "" end) + "\n```"), inline: false }
-                ],
-                timestamp: $timestamp
-              }]
-            }')
-
-          curl -H "Content-Type: application/json" -X POST \
-            -d "$PAYLOAD" "$DISCORD_WEBHOOK"
-        else
-          echo "No audit results found - listing workspace files:"
-          ls -la
-        fi
-    when:
-      - branch: main
-        event: push
-
-  # Backend zuerst - die Admin-Seite braucht die API
-  deploy_backend:
-    image: node:20
-    environment:
-      FLY_API_TOKEN:
-        from_secret: FLY_API_TOKEN
-    commands:
-      - curl -L https://fly.io/install.sh | sh
-      - export PATH="$HOME/.fly/bin:$PATH"
-      # aus backend/ heraus, damit Build-Kontext und Dockerfile stimmen
-      - cd backend && flyctl deploy --app gallus-cms-backend --remote-only
-    when:
-      - branch: main
-        event: push
-
  deploy_frontend:
    image: node:20
    environment:
@@ -105,87 +9,5 @@ steps:
      - export PATH="$HOME/.fly/bin:$PATH"
      - flyctl deploy --config fly.toml --app gallus-pub --remote-only
    when:
-      - branch: main
+      branch: main
      event: push
-
-  notify_success:
-    image: alpine:latest
-    environment:
-      DISCORD_WEBHOOK:
-        from_secret: discord_webhook
-    commands:
-      - apk add --no-cache curl jq
-      - |
-        # Schreibe Commit-Message in Datei (sicher gegen Shell-Sonderzeichen)
-        printf '%s\n' "$CI_COMMIT_MESSAGE" > /tmp/commit_msg.txt
-
-        PAYLOAD=$(cat /tmp/commit_msg.txt | jq -Rs \
-          --arg title "✅ Build #${CI_BUILD_NUMBER} - Success" \
-          --arg repo "${CI_REPO}" \
-          --arg branch "${CI_COMMIT_BRANCH}" \
-          --arg commit "${CI_COMMIT_SHA:0:7}" \
-          --arg author "${CI_COMMIT_AUTHOR}" \
-          --arg timestamp "$(date -u +%Y-%m-%dT%H:%M:%S.000Z)" \
-          '. as $message | {
-            embeds: [{
-              title: $title,
-              description: "Build und Deployment erfolgreich abgeschlossen!",
-              color: 3066993,
-              fields: [
-                { name: "Repository", value: $repo, inline: true },
-                { name: "Branch", value: $branch, inline: true },
-                { name: "Commit", value: ("`" + $commit + "`"), inline: true },
-                { name: "Author", value: $author, inline: true },
-                { name: "Commit Message", value: $message, inline: false }
-              ],
-              timestamp: $timestamp
-            }]
-          }')
-
-        curl -H "Content-Type: application/json" -X POST \
-          -d "$PAYLOAD" "$DISCORD_WEBHOOK"
-    when:
-      - branch: main
-        event: push
-        status: success
-
-  notify_failure:
-    image: alpine:latest
-    environment:
-      DISCORD_WEBHOOK:
-        from_secret: discord_webhook
-    commands:
-      - apk add --no-cache curl jq
-      - |
-        # Schreibe Commit-Message in Datei (sicher gegen Shell-Sonderzeichen)
-        printf '%s\n' "$CI_COMMIT_MESSAGE" > /tmp/commit_msg.txt
-
-        PAYLOAD=$(cat /tmp/commit_msg.txt | jq -Rs \
-          --arg title "❌ Build #${CI_BUILD_NUMBER} - Failure" \
-          --arg repo "${CI_REPO}" \
-          --arg branch "${CI_COMMIT_BRANCH}" \
-          --arg commit "${CI_COMMIT_SHA:0:7}" \
-          --arg author "${CI_COMMIT_AUTHOR}" \
-          --arg timestamp "$(date -u +%Y-%m-%dT%H:%M:%S.000Z)" \
-          '. as $message | {
-            embeds: [{
-              title: $title,
-              description: "Build oder Deployment ist fehlgeschlagen!",
-              color: 15158332,
-              fields: [
-                { name: "Repository", value: $repo, inline: true },
-                { name: "Branch", value: $branch, inline: true },
-                { name: "Commit", value: ("`" + $commit + "`"), inline: true },
-                { name: "Author", value: $author, inline: true },
-                { name: "Commit Message", value: $message, inline: false }
-              ],
-              timestamp: $timestamp
-            }]
-          }')
-
-        curl -H "Content-Type: application/json" -X POST \
-          -d "$PAYLOAD" "$DISCORD_WEBHOOK"
-    when:
-      - branch: main
-        event: push
-        status: failure
@@ -0,0 +1,220 @@
+# 🎯 Gallus Pub CMS - System-Erklärung
+
+## 📐 Architektur-Überblick
+
+```
+┌─────────────────┐         ┌──────────────────┐         ┌─────────────────┐
+│   Frontend      │         │   Backend CMS    │         │  Fly.io Volume  │
+│  (Astro SSG)    │◄────────┤   (Fastify API)  │◄────────┤   /app/data/    │
+│ gallus-pub.ch   │  fetch  │ cms.gallus-pub.ch│  mount  │  - SQLite DB    │
+│                 │         │                  │         │  - images/      │
+└─────────────────┘         └──────────────────┘         └─────────────────┘
+```
+
+## 🔄 Wie funktioniert der Upload-Flow?
+
+### 1. **Admin lädt Bild hoch** (admin.astro)
+```
+User wählt Bild → uploadImage() → POST /api/gallery/upload
+```
+
+### 2. **Backend verarbeitet Upload** (backend/src/routes/gallery.ts)
+```javascript
+// Line 60-134 in gallery.ts
+1. Empfange Multipart-File
+2. Validiere Mimetype (nur images/*)
+3. Lese Stream in Buffer
+4. sharp() konvertiert zu WebP:
+   - Auto-rotate (EXIF)
+   - Resize auf max 1600px
+   - WebP quality 82%
+5. Speichere in /app/data/images/gallery/
+6. Erstelle DB-Eintrag mit imageUrl
+7. Return imageUrl an Frontend
+```
+
+### 3. **Bilder werden serviert** (backend/src/index.ts)
+```javascript
+// Line 63-69
+fastifyStatic → /static/ → /app/data/
+```
+
+Beispiel:
+- Bild liegt in: `/app/data/images/gallery/miyma9zc-8he1di.webp`
+- URL ist: `/images/gallery/miyma9zc-8he1di.webp`
+- Wird serviert als: `https://cms.gallus-pub.ch/static/images/gallery/miyma9zc-8he1di.webp`
+
+### 4. **Frontend zeigt Bilder** (src/pages/index.astro)
+```javascript
+// Line 30-43
+1. Fetch von /api/gallery/public
+2. Map imageUrl: `${API_BASE}${img.imageUrl}`
+3. Result: https://cms.gallus-pub.ch/static/images/gallery/xyz.webp
+```
+
+## 💾 Warum funktioniert SQLite mit Fly.io?
+
+**Fly.io Volumes** sind persistente Speicher:
+- Gemountet als: `/app/data/`
+- Konfiguration in: `backend/fly.toml` (Line 40-42)
+- Bleibt bei Restarts/Deploys erhalten
+
+```toml
+[mounts]
+  source = "gallus_data"
+  destination = "/app/data"
+```
+
+### Was liegt wo?
+
+```
+/app/data/
+├── gallus_cms.db          # SQLite Datenbank
+├── gallus_cms.db-wal      # Write-Ahead Log
+├── gallus_cms.db-shm      # Shared Memory
+└── images/
+    ├── events/
+    │   ├── event_karaoke.webp
+    │   └── ...
+    └── gallery/
+        ├── Gallery1.webp
+        └── ...
+```
+
+## 🔒 Datenfluss im Detail
+
+### Event erstellen:
+```
+1. Admin: Bild auswählen + Formular ausfüllen
+2. uploadImage(file) → /api/gallery/upload
+   ↓
+3. Backend:
+   - Sharp konvertiert → WebP
+   - Speichert in /app/data/images/gallery/
+   - Returnt: { image: { imageUrl: "/images/gallery/xyz.webp" } }
+   ↓
+4. Admin: POST /api/events
+   Body: { title, date, description, imageUrl: "/images/gallery/xyz.webp" }
+   ↓
+5. Backend:
+   - INSERT INTO events (imageUrl = "/images/gallery/xyz.webp")
+   ↓
+6. Frontend: GET /api/events/public
+   - Fetcht Events aus DB
+   - Mapped imageUrl zu voller URL
+   - Zeigt an: <img src="https://cms.gallus-pub.ch/static/images/gallery/xyz.webp">
+```
+
+### Warum separate Uploads für Gallery?
+
+Events nutzen den Gallery-Upload, weil:
+- Beide brauchen WebP-Konvertierung
+- Beide nutzen gleichen Storage
+- Vermeidet Code-Duplikation
+- Gallery kann eigenständige Bildergalerie haben
+
+## 🎨 Admin-Panel Features
+
+### Events-Verwaltung:
+- ✅ Event erstellen (mit Bild-Upload)
+- ✅ Events auflisten
+- ✅ Events löschen
+- ✅ Reihenfolge ändern (Drag & Drop)
+- ✅ Events veröffentlichen/verstecken (isPublished)
+
+### Gallery-Verwaltung: (NEU!)
+- ✅ Bild hochladen
+- ✅ Gallery auflisten
+- ✅ Bilder löschen
+- ✅ Reihenfolge ändern (Drag & Drop)
+- ✅ Bilder veröffentlichen/verstecken (isPublished)
+
+### Publish:
+- Git-Integration (für statische Seiten-Updates)
+- Commit & Push zu Repository
+
+## 🚀 Deployment-Prozess
+
+### Was passiert beim Deploy?
+
+1. **Woodpecker CI** triggered bei Push zu `main`
+2. **Frontend Deploy** (gallus-pub):
+   - Build Astro SSG
+   - Deploy zu Fly.io
+
+3. **Backend Deploy** (gallus-cms-backend):
+   - Docker Build:
+     ```dockerfile
+     # Backend-Code kompilieren
+     npm run build → dist/
+
+     # Migrierte Bilder einpacken
+     COPY backend/data/images → /app/migration-images
+
+     # Migration-Script kopieren
+     COPY migrate-production.js → /app/
+     ```
+   - Deploy zu Fly.io
+   - **Volume bleibt erhalten** (SQLite DB + hochgeladene Bilder)
+
+4. **Nach erstem Deploy**: Migration ausführen
+   ```bash
+   fly ssh console -a gallus-cms-backend
+   node migrate-production.js
+   ```
+   - Kopiert Bilder: `/app/migration-images/` → `/app/data/images/`
+   - Befüllt DB mit Event/Gallery-Einträgen
+
+## 🔍 Troubleshooting
+
+### "Bilder werden nicht angezeigt"
+
+**Prüfe:**
+1. Backend logs: `fly logs -a gallus-cms-backend`
+2. Bild existiert: `fly ssh console -a gallus-cms-backend`
+   ```bash
+   ls -la /app/data/images/gallery/
+   ```
+3. DB-Eintrag korrekt:
+   ```bash
+   sqlite3 /app/data/gallus_cms.db
+   SELECT * FROM gallery_images;
+   ```
+4. Static-Route funktioniert:
+   ```bash
+   curl https://cms.gallus-pub.ch/static/images/gallery/xyz.webp
+   ```
+
+### "SQLite locked" Fehler
+
+- Nur ein Writer zur Zeit erlaubt
+- Bei hohem Traffic: Wechsel zu PostgreSQL empfohlen
+- Für Gallus Pub: ausreichend (wenig Writes)
+
+### "Volume voll"
+
+```bash
+fly volumes list -a gallus-cms-backend
+fly volumes extend <volume-id> -s <new-size>
+```
+
+## 📁 Wichtige Dateien
+
+| Datei | Zweck |
+|-------|-------|
+| `backend/src/routes/gallery.ts` | Gallery-Upload & CRUD |
+| `backend/src/routes/events.ts` | Events CRUD + Public API |
+| `backend/src/index.ts` | Static File Serving |
+| `backend/migrate-production.js` | Initiale Daten-Migration |
+| `src/pages/admin.astro` | Admin-Interface |
+| `src/pages/index.astro` | Frontend (fetched von API) |
+| `backend/fly.toml` | Backend Fly.io Config |
+| `fly.toml` | Frontend Fly.io Config |
+
+## 🎯 Nächste Schritte
+
+1. ✅ Gallery-Verwaltung implementiert
+2. ⏳ Migration ausführen (nach Deploy)
+3. ⏳ Testen: Bild hochladen → Frontend anzeigen
+4. 📋 Optional: Image-Editing Features
+5. 📋 Optional: Bulk-Upload für Gallery
@@ -5,8 +5,8 @@ FROM node:20-alpine AS builder

 WORKDIR /app

-# Install build dependencies for native modules (better-sqlite3, sharp)
-RUN apk add --no-cache python3 make g++ vips-dev
+# Install build dependencies for native modules (better-sqlite3)
+RUN apk add --no-cache python3 make g++

 # Install dependencies
 COPY package*.json ./
@@ -24,28 +24,15 @@ FROM node:20-alpine

 WORKDIR /app

-# Install runtime dependencies (git for simple-git, sqlite3 CLI tool, vips for sharp)
-# Note: python3, make, g++ are needed for native module compilation
-RUN apk add --no-cache git sqlite vips vips-dev python3 make g++
+# Install runtime dependencies (git for simple-git, sqlite3 CLI tool)
+RUN apk add --no-cache git sqlite

-# Copy package files first
-COPY --from=builder /app/package*.json ./
-
-# Install all production dependencies and rebuild sharp for linuxmusl-x64
-RUN npm ci --omit=dev || npm install --production && \
-    npm rebuild sharp
-
-# Clean up build dependencies after installation to reduce image size
-RUN apk del python3 make g++ vips-dev
+# Copy production dependencies from builder (already compiled native modules)
+COPY --from=builder /app/node_modules ./node_modules

 # Copy built files from builder
-# Hinweis: Drizzle-Migrationen werden nicht kopiert - das Schema wird zur
-# Laufzeit von initDatabase() angelegt, src/db/migrations existiert nicht.
 COPY --from=builder /app/dist ./dist
-
-# Copy migration script and migrated images
-COPY --from=builder /app/migrate-production.js ./migrate-production.js
-COPY --from=builder /app/data/images ./data/images
+COPY --from=builder /app/src/db/migrations ./dist/db/migrations

 # Create directories
 RUN mkdir -p /app/workspace /app/data
@@ -69,4 +56,4 @@ HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \
  CMD node -e "require('http').get('http://localhost:8080/health', (r) => {process.exit(r.statusCode === 200 ? 0 : 1)})"

 # Run DB migrations if present, then start application
-CMD ["/bin/sh", "-lc", "mkdir -p /app/data/images/events /app/data/images/gallery && [ -f dist/migrate.js ] && node dist/migrate.js || true; node dist/index.js"]
+CMD ["/bin/sh", "-lc", "[ -f dist/migrate.js ] && node dist/migrate.js || true; node dist/index.js"]
@@ -14,7 +14,7 @@ primary_region = "ams"
  GIT_WORKSPACE_DIR = "/app/data/workspace"
  # Cross-site frontend and OAuth
  FRONTEND_URL = "https://gallus-pub.ch"
-  CORS_ORIGIN = "https://gallus-pub.ch,https://www.gallus-pub.ch"
+  CORS_ORIGIN = "https://gallus-pub.ch"
  GITEA_REDIRECT_URI = "https://cms.gallus-pub.ch/api/auth/callback"

 [http_service]
@@ -1,183 +0,0 @@
-// Production migration script - can be run directly with node
-import Database from 'better-sqlite3';
-import { drizzle } from 'drizzle-orm/better-sqlite3';
-import { sqliteTable, text, integer } from 'drizzle-orm/sqlite-core';
-import { sql } from 'drizzle-orm';
-import fs from 'fs';
-import path from 'path';
-import sharp from 'sharp';
-
-// Database schema
-const events = sqliteTable('events', {
-  id: text('id').primaryKey().$defaultFn(() => crypto.randomUUID()),
-  title: text('title').notNull(),
-  date: text('date').notNull(),
-  description: text('description').notNull(),
-  imageUrl: text('image_url').notNull(),
-  displayOrder: integer('display_order').notNull(),
-  isPublished: integer('is_published', { mode: 'boolean' }).default(true),
-  createdAt: integer('created_at', { mode: 'timestamp' }).default(sql`(unixepoch())`),
-  updatedAt: integer('updated_at', { mode: 'timestamp' }).default(sql`(unixepoch())`),
-});
-
-const galleryImages = sqliteTable('gallery_images', {
-  id: text('id').primaryKey().$defaultFn(() => crypto.randomUUID()),
-  imageUrl: text('image_url').notNull(),
-  altText: text('alt_text').notNull(),
-  displayOrder: integer('display_order').notNull(),
-  isPublished: integer('is_published', { mode: 'boolean' }).default(true),
-  createdAt: integer('created_at', { mode: 'timestamp' }).default(sql`(unixepoch())`),
-});
-
-// Old events data
-const oldEvents = [
-  {
-    title: "Karaoke",
-    date: "2025-12-31",
-    description: `Bei uns gibt es Karaoke Mi-Sa!! <br>Seid ihr eine Gruppe und lieber unter euch? ..unseren 2.Stock kannst du auch mieten ;) <br>Reserviere am besten gleich per Whatsapp <a href="tel:+41772322770">077 232 27 70</a>`,
-    imageUrl: "/images/events/event_karaoke.webp",
-    displayOrder: 0,
-  },
-  {
-    title: "Pub Quiz",
-    date: "2025-12-31",
-    description: `Jeden Freitag findet unser <b>Pub Quiz</b> statt. Gespielt wird tischweise in 3-4 Runden. <br>Jede Woche gibt es ein anderes Thema. Es geht um Ruhm und Ehre und zusätzlich werden die Sieger der Herzen durch das Publikum gekürt! <3 <br>Auch Einzelpersonen sind herzlich willkommen! <br>*zum mitmachen minimum 1 Getränk konsumieren oder 5CHF`,
-    displayOrder: 1,
-  },
-  {
-    title: "Schlager Hüttenzauber Karaoke",
-    date: "2025-11-27",
-    description: `Ab 19:00 Uhr Eintritt ist Frei! Reservieren unter <a href="tel:+41772322770">077 232 27 70</a>`,
-    imageUrl: "/images/events/event_schlager-karaoke.webp",
-    displayOrder: 2,
-  },
-  {
-    title: "Adventskalender",
-    date: "2025-12-20",
-    description: `Jeden Tag neue Überraschungen! Check unsere Social Media Stories!`,
-    imageUrl: "/images/events/event_advents-kalender.webp",
-    displayOrder: 3,
-  },
-  {
-    title: "Santa Karaoke-Party",
-    date: "2025-12-06",
-    description: `🤶🏻🎅🏻Komme als Weihnachts-Mann/-Frau und bekomme einen Shot auf's Haus!🤶🏻🎅🏻`,
-    imageUrl: "/images/events/event_santa_karaoke.webp",
-    displayOrder: 4,
-  },
-  {
-    title: "Weihnachtsferien",
-    date: "2025-12-21",
-    description: `Wir sind ab 02.01.2026 wieder wie gewohnt für euch da! 🍀. <br> Für Anfragen WA <a href="tel:+41772322770">077 232 27 70</a> Antwort innerhalb 48h`,
-    imageUrl: "/images/events/event_ferien.webp",
-    displayOrder: 5,
-  },
-  {
-    title: "Neujahrs-Apero",
-    date: "2026-01-02",
-    description: `18:00-20:00 Uhr`,
-    imageUrl: "/images/events/event_neujahrs-apero.webp",
-    displayOrder: 6,
-  },
-];
-
-// Old gallery images
-const oldGalleryImages = [
-  { imageUrl: "/images/gallery/Gallery7.webp", alt: "Gallery 7", order: 0 },
-  { imageUrl: "/images/gallery/Gallery8.webp", alt: "Gallery 8", order: 1 },
-  { imageUrl: "/images/gallery/Gallery9.webp", alt: "Gallery 9", order: 2 },
-  { imageUrl: "/images/gallery/Gallery6.webp", alt: "Gallery 6", order: 3 },
-  { imageUrl: "/images/gallery/Gallery1.webp", alt: "Gallery 1", order: 4 },
-  { imageUrl: "/images/gallery/Gallery2.webp", alt: "Gallery 2", order: 5 },
-  { imageUrl: "/images/gallery/Gallery3.webp", alt: "Gallery 3", order: 6 },
-  { imageUrl: "/images/gallery/Gallery4.webp", alt: "Gallery 4", order: 7 },
-  { imageUrl: "/images/gallery/Gallery5.webp", alt: "Gallery 5", order: 8 },
-];
-
-async function main() {
-  console.log('=== Production Migration Script ===\n');
-
-  const dbPath = process.env.DATABASE_PATH || '/app/data/gallus_cms.db';
-  console.log('Database path:', dbPath);
-
-  // Check if database exists
-  if (!fs.existsSync(dbPath)) {
-    console.error('ERROR: Database not found at:', dbPath);
-    console.error('Please ensure the backend has been started at least once to create the database.');
-    process.exit(1);
-  }
-
-  // Check if images exist
-  const dataDir = process.env.GIT_WORKSPACE_DIR || '/app/data';
-  const eventsDir = path.join(dataDir, 'images', 'events');
-  const galleryDir = path.join(dataDir, 'images', 'gallery');
-
-  console.log('Events images directory:', eventsDir);
-  console.log('Gallery images directory:', galleryDir);
-
-  if (!fs.existsSync(eventsDir)) {
-    console.error('ERROR: Events images directory not found:', eventsDir);
-    process.exit(1);
-  }
-
-  if (!fs.existsSync(galleryDir)) {
-    console.error('ERROR: Gallery images directory not found:', galleryDir);
-    process.exit(1);
-  }
-
-  // List available images
-  console.log('\nAvailable event images:', fs.readdirSync(eventsDir));
-  console.log('Available gallery images:', fs.readdirSync(galleryDir));
-
-  // Connect to database
-  const sqlite = new Database(dbPath);
-  const db = drizzle(sqlite);
-
-  console.log('\n=== Migrating Events ===\n');
-
-  for (const event of oldEvents) {
-    try {
-      const [newEvent] = await db.insert(events).values({
-        title: event.title,
-        date: event.date,
-        description: event.description,
-        imageUrl: event.imageUrl,
-        displayOrder: event.displayOrder,
-        isPublished: true,
-      }).returning();
-
-      console.log(`✓ Migrated event: ${newEvent.title}`);
-    } catch (error) {
-      console.error(`✗ Failed to migrate event "${event.title}":`, error.message);
-    }
-  }
-
-  console.log('\n=== Migrating Gallery Images ===\n');
-
-  for (const img of oldGalleryImages) {
-    try {
-      const [newImage] = await db.insert(galleryImages).values({
-        imageUrl: img.imageUrl,
-        altText: img.alt,
-        displayOrder: img.order,
-        isPublished: true,
-      }).returning();
-
-      console.log(`✓ Migrated gallery image: ${newImage.altText}`);
-    } catch (error) {
-      console.error(`✗ Failed to migrate gallery image "${img.alt}":`, error.message);
-    }
-  }
-
-  sqlite.close();
-
-  console.log('\n✓ Migration completed successfully!');
-  console.log('\nYou can verify the migration by visiting:');
-  console.log('- Frontend: https://gallus-pub.ch/');
-  console.log('- Admin: https://gallus-pub.ch/admin');
-}
-
-main().catch(error => {
-  console.error('\n✗ Migration failed:', error);
-  process.exit(1);
-});
@@ -1,6 +1,7 @@
 import { sqliteTable, text, integer } from 'drizzle-orm/sqlite-core';
 import { sql } from 'drizzle-orm';

+// Users table - stores Gitea user info for audit and access control
 export const users = sqliteTable('users', {
  id: text('id').primaryKey().$defaultFn(() => crypto.randomUUID()),
  giteaId: text('gitea_id').notNull().unique(),
@@ -59,14 +60,3 @@ export const publishHistory = sqliteTable('publish_history', {
  commitMessage: text('commit_message'),
  publishedAt: integer('published_at', { mode: 'timestamp' }).default(sql`(unixepoch())`),
 });
-
-// Banner table (for announcements like holidays, special info)
-export const banners = sqliteTable('banners', {
-  id: text('id').primaryKey().$defaultFn(() => crypto.randomUUID()),
-  text: text('text').notNull(),
-  startDate: text('start_date').notNull(), // ISO date string
-  endDate: text('end_date').notNull(), // ISO date string
-  isActive: integer('is_active', { mode: 'boolean' }).default(true),
-  createdAt: integer('created_at', { mode: 'timestamp' }).default(sql`(unixepoch())`),
-  updatedAt: integer('updated_at', { mode: 'timestamp' }).default(sql`(unixepoch())`),
-});
@@ -8,7 +8,6 @@ import { env, validateEnv } from './config/env.js';
 import { db, initDatabase } from './config/database.js';
 import fastifyStatic from '@fastify/static';
 import path from 'path';
-import fs from 'fs';

 // Import routes
 import authRoute from './routes/auth.js';
@@ -17,7 +16,6 @@ import galleryRoute from './routes/gallery.js';
 import contentRoute from './routes/content.js';
 import settingsRoute from './routes/settings.js';
 import publishRoute from './routes/publish.js';
-import bannersRoute from './routes/banners.js';

 // Validate environment variables
 try {
@@ -41,24 +39,8 @@ const fastify = Fastify({
 });

 // Register plugins
-// Support multiple origins for CORS
-const allowedOrigins = env.CORS_ORIGIN.split(',').map(o => o.trim());
 fastify.register(cors, {
-  origin: (origin, cb) => {
-    // Allow requests with no origin (like mobile apps or curl)
-    if (!origin) {
-      return cb(null, true);
-    }
-
-    // Check if origin is in allowed list
-    const isAllowed = allowedOrigins.includes(origin);
-
-    if (isAllowed) {
-      return cb(null, true);
-    } else {
-      return cb(null, false);
-    }
-  },
+  origin: env.CORS_ORIGIN,
  credentials: true,
 });

@@ -80,25 +62,12 @@ fastify.register(multipart, {

 // Serve static files (uploaded images, etc.) from persistent volume
 const dataDir = env.GIT_WORKSPACE_DIR || path.join(process.cwd(), 'data');
-// Muss existieren, sonst verweigert @fastify/static die Registrierung
-fs.mkdirSync(dataDir, { recursive: true });
 fastify.register(fastifyStatic, {
  root: dataDir,
  prefix: '/static/',
  decorateReply: false
 });

-// Uploads liegen unter <workspace>/public/images. In der DB stehen sie als
-// /images/... - das ist die URL auf der publizierten Astro-Seite. Damit die
-// Admin-Oberflaeche dieselben Pfade verwenden kann, hier ebenso ausliefern.
-const imagesDir = path.join(dataDir, 'public', 'images');
-fs.mkdirSync(imagesDir, { recursive: true });
-fastify.register(fastifyStatic, {
-  root: imagesDir,
-  prefix: '/images/',
-  decorateReply: false
-});
-
 // Decorate fastify with authenticate method
 fastify.decorate('authenticate', authenticate);

@@ -109,7 +78,6 @@ fastify.register(galleryRoute, { prefix: '/api' });
 fastify.register(contentRoute, { prefix: '/api' });
 fastify.register(settingsRoute, { prefix: '/api' });
 fastify.register(publishRoute, { prefix: '/api' });
-fastify.register(bannersRoute, { prefix: '/api' });

 // Health check
 fastify.get('/health', async () => {
@@ -6,6 +6,7 @@ import { eq } from 'drizzle-orm';
 import { GiteaService } from '../services/gitea.service.js';
 import { env } from '../config/env.js';

+// Use explicit JSON schema for Fastify route validation to avoid provider issues
 const callbackQueryJsonSchema = {
  type: 'object',
  required: ['code', 'state'],
@@ -1,152 +0,0 @@
-import { FastifyPluginAsync } from 'fastify';
-import { db } from '../config/database.js';
-import { banners } from '../db/schema.js';
-import { eq, and, lte, gte, desc } from 'drizzle-orm';
-
-const bannerBodyJsonSchema = {
-  type: 'object',
-  required: ['text', 'startDate', 'endDate'],
-  properties: {
-    text: { type: 'string' },
-    startDate: { type: 'string' },
-    endDate: { type: 'string' },
-    isActive: { type: 'boolean' },
-  },
-} as const;
-
-const bannersRoute: FastifyPluginAsync = async (fastify) => {
-
-  // Get active banner (public endpoint)
-  fastify.get('/banners/active', async (request, reply) => {
-    // Use local date to avoid timezone issues
-    const now = new Date();
-    const today = new Date(now.getTime() - (now.getTimezoneOffset() * 60000))
-      .toISOString()
-      .split('T')[0]; // YYYY-MM-DD
-
-    const [activeBanner] = await db
-      .select()
-      .from(banners)
-      .where(
-        and(
-          eq(banners.isActive, true),
-          lte(banners.startDate, today),
-          gte(banners.endDate, today)
-        )
-      )
-      .orderBy(desc(banners.createdAt))
-      .limit(1);
-
-    if (!activeBanner) {
-      return { banner: null };
-    }
-
-    return {
-      banner: {
-        id: activeBanner.id,
-        text: activeBanner.text,
-        startDate: activeBanner.startDate,
-        endDate: activeBanner.endDate,
-      },
-    };
-  });
-
-  // Get all banners (admin only)
-  fastify.get('/banners', {
-    preHandler: [fastify.authenticate],
-  }, async (request, reply) => {
-    const allBanners = await db.select().from(banners);
-
-    return {
-      banners: allBanners.map((b: any) => ({
-        id: b.id,
-        text: b.text,
-        startDate: b.startDate,
-        endDate: b.endDate,
-        isActive: b.isActive,
-        createdAt: b.createdAt,
-        updatedAt: b.updatedAt,
-      })),
-    };
-  });
-
-  // Create banner (admin only)
-  fastify.post('/banners', {
-    schema: {
-      body: bannerBodyJsonSchema,
-    },
-    preHandler: [fastify.authenticate],
-  }, async (request, reply) => {
-    const { text, startDate, endDate, isActive = true } = request.body as any;
-
-    const [newBanner] = await db
-      .insert(banners)
-      .values({
-        text,
-        startDate,
-        endDate,
-        isActive,
-      })
-      .returning();
-
-    return {
-      banner: {
-        id: newBanner.id,
-        text: newBanner.text,
-        startDate: newBanner.startDate,
-        endDate: newBanner.endDate,
-        isActive: newBanner.isActive,
-      },
-    };
-  });
-
-  // Update banner (admin only)
-  fastify.put('/banners/:id', {
-    schema: {
-      body: bannerBodyJsonSchema,
-    },
-    preHandler: [fastify.authenticate],
-  }, async (request, reply) => {
-    const { id } = request.params as { id: string };
-    const { text, startDate, endDate, isActive } = request.body as any;
-
-    const [updated] = await db
-      .update(banners)
-      .set({
-        text,
-        startDate,
-        endDate,
-        isActive,
-        updatedAt: new Date(),
-      })
-      .where(eq(banners.id, id))
-      .returning();
-
-    if (!updated) {
-      return reply.code(404).send({ error: 'Banner not found' });
-    }
-
-    return {
-      banner: {
-        id: updated.id,
-        text: updated.text,
-        startDate: updated.startDate,
-        endDate: updated.endDate,
-        isActive: updated.isActive,
-      },
-    };
-  });
-
-  // Delete banner (admin only)
-  fastify.delete('/banners/:id', {
-    preHandler: [fastify.authenticate],
-  }, async (request, reply) => {
-    const { id } = request.params as { id: string };
-
-    await db.delete(banners).where(eq(banners.id, id));
-
-    return { success: true };
-  });
-};
-
-export default bannersRoute;
@@ -2,8 +2,6 @@ import { FastifyPluginAsync } from 'fastify';
 import { db } from '../config/database.js';
 import { events } from '../db/schema.js';
 import { eq } from 'drizzle-orm';
-import fs from 'fs';
-import path from 'path';

 // Fastify JSON schema for event body
 const eventBodyJsonSchema = {
@@ -76,73 +74,6 @@ const eventsRoute: FastifyPluginAsync = async (fastify) => {
    return { event: row };
  });

-  // Upload event image file (multipart)
-  fastify.post('/events/upload', {
-    preHandler: [fastify.authenticate],
-  }, async (request, reply) => {
-    try {
-      // Expect a single file field named "file"
-      const file = await (request as any).file();
-      if (!file) {
-        return reply.code(400).send({ error: 'No file uploaded' });
-      }
-
-      const mime = file.mimetype as string | undefined;
-      if (!mime || !mime.startsWith('image/')) {
-        return reply.code(400).send({ error: 'Only image uploads are allowed' });
-      }
-
-      // Prepare directories - use persistent volume for Fly.io
-      const dataDir = process.env.GIT_WORKSPACE_DIR || path.join(process.cwd(), 'data');
-      const uploadDir = path.join(dataDir, 'public', 'images', 'events');
-      if (!fs.existsSync(uploadDir)) fs.mkdirSync(uploadDir, { recursive: true });
-
-      // Read uploaded stream into buffer
-      const chunks: Buffer[] = [];
-      for await (const chunk of file.file) {
-        chunks.push(Buffer.isBuffer(chunk) ? chunk : Buffer.from(chunk));
-      }
-      const inputBuffer = Buffer.concat(chunks);
-
-      // Generate filename
-      const stamp = Date.now().toString(36);
-      const rand = Math.random().toString(36).slice(2, 8);
-      const baseName = `${stamp}-${rand}`;
-
-      // Try to convert to webp and limit size; fallback to original
-      let outBuffer: Buffer | null = null;
-      let outExt = '.webp';
-      try {
-        // Lazy load sharp only when needed
-        const sharp = (await import('sharp')).default;
-        outBuffer = await sharp(inputBuffer)
-          .rotate()
-          .resize({ width: 1600, withoutEnlargement: true })
-          .webp({ quality: 82 })
-          .toBuffer();
-      } catch (err) {
-        fastify.log.warn({ err }, 'Sharp processing failed, using original image');
-        outBuffer = inputBuffer;
-        // naive extension from mimetype
-        const extFromMime = mime.split('/')[1] || 'bin';
-        outExt = '.' + extFromMime.replace(/[^a-z0-9]/gi, '').toLowerCase();
-      }
-
-      const filename = baseName + outExt;
-      const destPath = path.join(uploadDir, filename);
-      fs.writeFileSync(destPath, outBuffer);
-
-      // Public URL (served via /static)
-      const publicUrl = `/images/events/${filename}`;
-
-      return reply.code(201).send({ imageUrl: publicUrl });
-
-    } catch (err) {
-      fastify.log.error({ err }, 'Upload failed');
-      return reply.code(500).send({ error: 'Failed to upload image' });
-    }
-  });
-
  // Delete event
  fastify.delete('/events/:id', { preHandler: [fastify.authenticate] }, async (request, reply) => {
    const { id } = request.params as { id: string };
@@ -5,6 +5,7 @@ import { galleryImages } from '../db/schema.js';
 import { eq } from 'drizzle-orm';
 import fs from 'fs';
 import path from 'path';
+import sharp from 'sharp';

 // Fastify JSON schema for gallery image body
 const galleryBodyJsonSchema = {
@@ -86,7 +87,7 @@ const galleryRoute: FastifyPluginAsync = async (fastify) => {

      // Prepare directories - use persistent volume for Fly.io
      const dataDir = process.env.GIT_WORKSPACE_DIR || path.join(process.cwd(), 'data');
-      const uploadDir = path.join(dataDir, 'public', 'images', 'gallery');
+      const uploadDir = path.join(dataDir, 'images', 'gallery');
      if (!fs.existsSync(uploadDir)) fs.mkdirSync(uploadDir, { recursive: true });

      // Read uploaded stream into buffer
@@ -105,15 +106,12 @@ const galleryRoute: FastifyPluginAsync = async (fastify) => {
      let outBuffer: Buffer | null = null;
      let outExt = '.webp';
      try {
-        // Lazy load sharp only when needed
-        const sharp = (await import('sharp')).default;
        outBuffer = await sharp(inputBuffer)
          .rotate()
          .resize({ width: 1600, withoutEnlargement: true })
          .webp({ quality: 82 })
          .toBuffer();
-      } catch (err) {
-        fastify.log.warn({ err }, 'Sharp processing failed, using original image');
+      } catch {
        outBuffer = inputBuffer;
        // naive extension from mimetype
        const extFromMime = mime.split('/')[1] || 'bin';
@@ -125,7 +123,7 @@ const galleryRoute: FastifyPluginAsync = async (fastify) => {
      fs.writeFileSync(destPath, outBuffer);

      // Public URL (served via /static)
-      const publicUrl = `/images/gallery/${filename}`;
+      const publicUrl = `/static/images/gallery/${filename}`;

      // Store in DB (optional but useful)
      const [row] = await db.insert(galleryImages).values({
@@ -43,7 +43,6 @@ export class FileGeneratorService {

    return `---
 import Layout from "../components/Layout.astro";
-import Banner from "../components/Banner.astro";
 import Hero from "../components/Hero.astro";
 import Welcome from "../components/Welcome.astro";
 import EventsGrid from "../components/EventsGrid.astro";
@@ -63,7 +62,6 @@ ${imagesCode}

 <Layout>
 \t<Hero id="hero" />
-\t<Banner />
 \t<Welcome id="welcome" />
 \t<EventsGrid id="events" events={events} />
 \t<ImageCarousel id="gallery" images={images} />
@@ -1,84 +1,43 @@
 import simpleGit, { SimpleGit } from 'simple-git';
-import { mkdir, rm, cp } from 'fs/promises';
-import { existsSync } from 'fs';
+import { mkdir, rm } from 'fs/promises';
 import path from 'path';
 import { env } from '../config/env.js';

 export class GitService {
  private git: SimpleGit;
  private workspaceDir: string;
-  private parentDir: string;
  private repoUrl: string;
  private token: string;

  constructor() {
    this.workspaceDir = env.GIT_WORKSPACE_DIR;
-    this.parentDir = path.dirname(this.workspaceDir);
    this.repoUrl = env.GIT_REPO_URL;
    this.token = env.GIT_TOKEN;
    this.git = simpleGit();
  }

  async initialize() {
-    // Elternverzeichnis muss existieren - simple-git startet git von dort aus
-    await mkdir(this.parentDir, { recursive: true });
+    // Ensure workspace directory exists
+    await mkdir(this.workspaceDir, { recursive: true });

    // Add token to repo URL for authentication
    const authenticatedUrl = this.repoUrl.replace(
      'https://',
-      `https://oauth2:${encodeURIComponent(this.token)}@`
+      `https://oauth2:${this.token}@`
    );

-    let usable = false;
-
-    if (existsSync(path.join(this.workspaceDir, '.git'))) {
    try {
-        this.git = simpleGit(this.workspaceDir);
+      // Check if repo already exists
+      await this.git.cwd(this.workspaceDir);
      await this.git.status();
      console.log('Repository already exists, pulling latest...');
      await this.git.pull();
-        usable = true;
-      } catch (error) {
-        // Token aus der Meldung entfernen - git gibt die Remote-URL mit aus
-        const msg = error instanceof Error ? error.message : String(error);
-        console.warn(
-          'Existing workspace unusable, re-cloning:',
-          msg.replace(/\/\/[^@\s/]*@/g, '//***@')
-        );
-      }
-    }
-
-    if (!usable) {
+    } catch {
+      // Clone if doesn't exist
      console.log('Cloning repository...');
-
-      // Hochgeladene Bilder liegen im Workspace und wuerden beim Loeschen
-      // verschwinden - vorher wegsichern, nach dem Clone zurueckspielen
-      const imagesDir = path.join(this.workspaceDir, 'public', 'images');
-      const backupDir = path.join(this.parentDir, '.workspace-images-backup');
-      const hasImages = existsSync(imagesDir);
-
-      await rm(backupDir, { recursive: true, force: true });
-      if (hasImages) {
-        await cp(imagesDir, backupDir, { recursive: true });
-      }
-
      await rm(this.workspaceDir, { recursive: true, force: true });
-
-      // Aus dem existierenden Elternverzeichnis klonen, nicht aus dem
-      // soeben geloeschten Zielverzeichnis (sonst: spawn git ENOENT)
-      this.git = simpleGit(this.parentDir);
      await this.git.clone(authenticatedUrl, this.workspaceDir);
-      this.git = simpleGit(this.workspaceDir);
-
-      if (hasImages) {
-        // force: false -> was schon im Repo liegt, bleibt unangetastet
-        await cp(backupDir, imagesDir, {
-          recursive: true,
-          force: false,
-          errorOnExist: false,
-        });
-        await rm(backupDir, { recursive: true, force: true });
-      }
+      await this.git.cwd(this.workspaceDir);
    }

    // Configure git user
@@ -88,14 +47,6 @@ export class GitService {

  async commitAndPush(message: string): Promise<string> {
    await this.git.add('.');
-
-    const status = await this.git.status();
-    if (status.isClean()) {
-      // Nichts zu committen - aktuellen Stand zurueckgeben statt zu scheitern
-      const current = await this.git.log({ maxCount: 1 });
-      return current.latest?.hash || '';
-    }
-
    await this.git.commit(message);
    await this.git.push('origin', 'main');

@@ -108,15 +59,7 @@ export class GitService {
  }

  async reset() {
-    // Nur zuruecksetzen wenn wirklich ein Repo da ist - sonst laeuft git
-    // im Prozess-Arbeitsverzeichnis und raeumt dort auf
-    if (!existsSync(path.join(this.workspaceDir, '.git'))) {
-      return;
-    }
-
-    const git = simpleGit(this.workspaceDir);
-    await git.reset(['--hard', 'HEAD']);
-    // Uploads ausnehmen - die sind noch nicht committed und waeren sonst weg
-    await git.clean('f', ['-d', '-e', 'public/images']);
+    await this.git.reset(['--hard', 'HEAD']);
+    await this.git.clean('f', ['-d']);
  }
 }
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="500" zoomAndPan="magnify" viewBox="0 0 375 374.999991" height="500" preserveAspectRatio="xMidYMid meet" version="1.0"><defs><clipPath id="f68ef4028f"><path d="M 47.203125 40 L 322 40 L 322 335 L 47.203125 335 Z M 47.203125 40 " clip-rule="nonzero"/></clipPath></defs><g clip-path="url(#f68ef4028f)"><path fill="#1d6b32" d="M 48.097656 139.574219 C 48.097656 128.285156 48.660156 119.429688 55.417969 109.972656 C 60.960938 102.21875 68.625 96.976562 75.371094 90.4375 C 90.03125 76.242188 102.058594 52.597656 122.386719 45.964844 C 140.441406 40.078125 161.71875 50.683594 170.175781 67.148438 C 174.488281 75.5625 175.570312 84.835938 176.609375 94.097656 C 178.023438 106.769531 179.671875 119.417969 181.199219 132.078125 C 186.097656 127.304688 184.324219 113.089844 184.800781 106.679688 C 185.414062 98.355469 185.589844 89.773438 187.167969 81.554688 C 190.136719 66.023438 202.230469 53.867188 215.535156 46.148438 C 230.378906 37.53125 245.867188 37.894531 259.476562 48.902344 C 265.457031 53.734375 269.027344 59.921875 273.558594 65.980469 C 278.105469 72.058594 283.742188 77.164062 289.878906 81.59375 C 301.03125 89.632812 313.222656 97.105469 314.707031 111.992188 C 315.859375 123.574219 312.664062 136.851562 306.261719 146.585938 C 298.824219 157.886719 283.566406 165.484375 271.140625 169.84375 C 263.703125 172.453125 256.171875 173.589844 248.375 174.402344 C 243.988281 174.855469 239.605469 175.347656 235.230469 175.863281 C 233.320312 176.085938 220.464844 177.1875 222.21875 178.914062 C 223.414062 180.097656 232.449219 178.90625 234.25 178.929688 C 238.816406 178.984375 243.378906 179.058594 247.9375 179.101562 C 258.195312 179.199219 268.472656 179.238281 278.703125 179.984375 C 294.078125 181.101562 308.125 186.960938 316.167969 200.828125 C 324.128906 214.566406 322.324219 235.332031 313.648438 248.554688 C 309.550781 254.800781 302.960938 258.933594 298.382812 264.773438 C 292.863281 271.808594 289.753906 280.417969 284.703125 287.777344 C 277.070312 298.902344 265.578125 308.597656 251.328125 307.664062 C 237.253906 306.738281 223.84375 295.984375 214.992188 285.644531 C 204.679688 273.609375 202.425781 260.40625 198.433594 245.617188 C 197.992188 243.980469 196.5 234.824219 195.105469 234.082031 C 192.15625 232.503906 193.15625 242.25 193.140625 243.652344 C 193.039062 252.289062 193.183594 260.898438 194.160156 269.492188 C 195.984375 285.542969 200.703125 301.367188 211.675781 313.625 C 215.640625 318.050781 226.738281 326.539062 219.757812 333.71875 C 216.042969 337.535156 203.546875 329.980469 199.726562 326.988281 C 169.355469 303.21875 175.738281 257.648438 175.738281 223.953125 C 158.667969 247.144531 172.769531 289.511719 141.984375 304.472656 C 130.417969 310.089844 113.792969 310.679688 102.148438 305.070312 C 88.4375 298.476562 81.277344 282.652344 73.429688 270.453125 C 69.234375 263.933594 63.84375 258.296875 58.707031 252.453125 C 55.953125 249.324219 52.542969 246.261719 50.21875 242.816406 C 47.457031 238.734375 47.503906 233.292969 48.097656 228.109375 C 49.5 215.78125 54.359375 203.136719 63.367188 194.40625 C 72.792969 185.277344 84.792969 181.804688 97.621094 181.160156 C 106.09375 180.734375 114.582031 180.5625 123.0625 180.191406 C 127.40625 180.003906 131.675781 179.730469 135.988281 179.113281 C 141.285156 178.359375 145.921875 177.105469 138.335938 175.230469 C 109.652344 168.167969 59.332031 176.03125 48.097656 139.574219 C 48.097656 135.066406 52.933594 155.265625 48.097656 139.574219 " fill-opacity="1" fill-rule="nonzero"/></g></svg>
@@ -1,40 +0,0 @@
---
-// src/components/Banner.astro
-import "../styles/components/Banner.css"
---
-
-<div id="banner-container"></div>
-
-<script>
-  const API_BASE = 'https://cms.gallus-pub.ch';
-
-  async function loadBanner() {
-    try {
-      const response = await fetch(`${API_BASE}/api/banners/active`);
-      if (response.ok) {
-        const data = await response.json();
-        if (data.banner) {
-          const container = document.getElementById('banner-container');
-          if (container) {
-            container.innerHTML = `
-              <div class="banner-wrapper">
-                <div class="banner container">
-                  <p>${data.banner.text}</p>
-                </div>
-              </div>
-            `;
-          }
-        }
-      }
-    } catch (error) {
-      console.error('Failed to fetch banner:', error);
-    }
-  }
-
-  // Load banner when DOM is ready
-  if (document.readyState === 'loading') {
-    document.addEventListener('DOMContentLoaded', loadBanner);
-  } else {
-    loadBanner();
-  }
-</script>
@@ -7,7 +7,8 @@ const { id } = Astro.props;
    <h2 class="title">Drinks</h2>

    <p class="note">
-        Ob frisch gezapftes Pint, edler Whisky oder ein gemütliches Glas Wein – bei uns genießt du das Leben in entspannter Atmosphäre. Auch Cocktails dürfen nicht fehlen: Vieles kreieren wir selbst. Sláinte!
+        Ob ein frisch gezapftes Pint, ein edler Tropfen Whiskey oder ein gemütliches Glas Wein – hier kannst du in entspannter
+        Atmosphäre das Leben genießen. Natürlich dürfen auch Cocktails nicht fehlen. Vieles kreieren wir auch selber - Sláinte!
    </p>

    <a href="/pdf/Getraenke_Gallus_2025.pdf" class="card-link" target="_blank" rel="noopener noreferrer">Getränkekarte</a>
@@ -15,7 +15,6 @@ import "../styles/index.css"

 		<meta charset="UTF-8" />
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-		<link rel="icon" type="image/svg+xml" href="/logo.svg" />
 		<title>Gallus Pub</title>
 	</head>

@@ -13,32 +13,41 @@ const { id } = Astro.props;
 		<h2>Gallus Pub!</h2>

 		<p>
-			Bei uns ist jede*r willkommen – ob jung oder alt, Rocker, Nerd, Meerjungfrau oder einfach du selbst. Unsere Türen stehen allen offen, die Spass und gute Gesellschaft suchen.
+			Wie die meisten bereits wissen, ist hier jeder willkommen - ob jung
+			oder alt, Rocker, Elf, Nerd, Meerjungfrau oder einfach nur du
+			selbst. Unsere Türen stehen offen für alle, die Spass haben wollen
+			und gute Gesellschaft suchen!
 		</p>
-		<br />
+
 		<p><b>Unsere Highlights:</b></p>

 		<ul>
 			<li>
-				<b>Karaoke:</b> Von Mittwoch bis Samstag kannst du auf zwei Stockwerken deine Stimme zum Besten geben – ganz ohne Perfektionsdruck, Hauptsache Spass. Du singst lieber im kleinen Rahmen?
-				Dann kannst du den Sangallerruum im 2.OG auch privat mieten.
+				<b>Karaoke:</b> Von Mittwoch bis Samstag kannst du deine
+				Stimme auf zwei Stockwerken zum Besten geben. Keine Sorge, es geht
+				nicht darum, perfekt zu sein, sondern einfach Spass zu haben! Du singst
+				gerne, aber lieber für dich? Dann kannst du den 2. OG auch privat
+				mieten.
 			</li>

 			<li>
-				<b>Pub Quiz:</b> Jeden Freitag ab 20:00 Uhr testet ihr euer Wissen in mehreren Runden. Jede Woche warten ein neues Thema und ein neuer Sieger der Herzen.
+				<b>Pub Quiz:</b> Jeden Freitag ab 20:00 Uhr testet ihr
+				euer Wissen in verschiedenen Runden. Jede Woche gibt es ein neues
+				Thema und einen neuen Champion.
 			</li>

 			<li>
-				<b>Getränke:</b> Geniesst frisches Guinness, Smithwick’s, Gallus Old Style Ale, leckere Cocktails und ausgewählte Whiskys aus Schottland und Irland.
+				<b>Getränke:</b> Geniesst frisches Guinness, Smithwicks,
+				Gallus Old Style Ale und unsere leckeren Cocktails. Für Whisky-Liebhaber
+				haben wir erlesene Sorten aus Schottland und Irland im Angebot.
 			</li>
 		</ul>

 		<p>
-			Wir freuen uns, euch bald bei uns zu begrüssen – auf viele unvergessliche Abende!
-		</p>
-		<p>
-			Sabrina & Raphael
+			Wir freuen uns darauf, euch bald bei uns begrüssen zu können! Lasst
+			uns gemeinsam unvergessliche Abende feiern. - Sabrina & Raphael
 		</p>
+
 	</div>


@@ -1,10 +1,8 @@
 ---
 import Layout from "../components/Layout.astro";
-import Banner from "../components/Banner.astro";
 ---

 <Layout>
-	<Banner />
 	
 	<h1>Gallery</h1>

@@ -1,10 +1,8 @@
 ---
 import Layout from "../components/Layout.astro";
-import Banner from "../components/Banner.astro";
 ---

 <Layout>
-	<Banner />

 	<h1>Openings</h1>

@@ -51,6 +51,7 @@ const title = 'Admin';
          <label>Datum<input id="ev-date" type="date" placeholder="z. B. 2025-12-31" /></label>
          <label>Beschreibung<textarea id="ev-desc" rows="4"></textarea></label>
          <label>Bild-Datei<input id="ev-file" type="file" accept="image/*" /></label>
+          <label>Alt-Text<input id="ev-alt" placeholder="Bildbeschreibung" /></label>
          <button id="btn-create-ev">Event anlegen</button>
          <div id="ev-create-msg" class="muted"></div>
        </div>
@@ -78,30 +79,17 @@ const title = 'Admin';
          <div id="gal-create-msg" class="muted"></div>
        </div>
        <div class="card" style="min-width:380px;">
-          <h3>Gallery-Liste</h3>
+          <h3>Liste</h3>
+          <div class="toolbar">
+            <button id="btn-toggle-gal-reorder">Reihenfolge bearbeiten</button>
+            <button id="btn-save-gal-order" style="display:none">Reihenfolge speichern</button>
+            <span id="gal-order-msg" class="muted"></span>
+          </div>
          <div id="gallery-list" class="grid"></div>
        </div>
      </div>
    </section>

-    <section id="sec-banner" style="display:none">
-      <h2>Banner verwalten</h2>
-      <div class="events-row">
-        <div class="card">
-          <h3>Neuen Banner erstellen</h3>
-          <label>Text<textarea id="banner-text" rows="3" placeholder="z.B. Wir sind vom 24.12. bis 02.01. geschlossen"></textarea></label>
-          <label>Von (Datum)<input id="banner-start" type="date" /></label>
-          <label>Bis (Datum)<input id="banner-end" type="date" /></label>
-          <button id="btn-create-banner">Banner erstellen</button>
-          <div id="banner-create-msg" class="muted"></div>
-        </div>
-        <div class="card" style="min-width:380px;">
-          <h3>Banner-Liste</h3>
-          <div id="banner-list" class="grid"></div>
-        </div>
-      </div>
-    </section>
-
    <section id="sec-publish" style="display:none">
      <h2>Veröffentlichen</h2>
      <label>Commit-Message<input id="pub-msg" placeholder="Änderungen beschreiben" value="Update events" /></label>
@@ -127,20 +115,16 @@ const title = 'Admin';
          // UI-Bereiche für eingeloggte Nutzer einblenden
          document.getElementById('sec-events').style.display = '';
          document.getElementById('sec-gallery').style.display = '';
-          document.getElementById('sec-banner').style.display = '';
          document.getElementById('sec-publish').style.display = '';
          // Direkt Events laden und auf Sektion fokussieren
          await loadEvents();
          await loadGallery();
-          await loadBanners();
          document.getElementById('sec-events').scrollIntoView({ behavior: 'smooth' });
        } catch (e) {
          const el = document.getElementById('auth-status');
          el.textContent = 'Nicht angemeldet';
          // Kein Auto-Redirect, damit keine Schleife entsteht. Login-Button verwenden.
          document.getElementById('sec-events').style.display = 'none';
-          document.getElementById('sec-gallery').style.display = 'none';
-          document.getElementById('sec-banner').style.display = 'none';
          document.getElementById('sec-publish').style.display = 'none';
        }
      }
@@ -165,15 +149,7 @@ const title = 'Admin';
      });

      // ========== Events & Publish ==========
-      async function uploadEventImage(file) {
-        const fd = new FormData();
-        fd.append('file', file);
-        const res = await fetch(API_BASE + '/api/events/upload', { method: 'POST', body: fd, credentials: 'include' });
-        if (!res.ok) throw new Error(await res.text());
-        return res.json();
-      }
-
-      async function uploadGalleryImage(file, altText) {
+      async function uploadImage(file, altText) {
        const fd = new FormData();
        fd.append('file', file);
        if (altText) fd.append('altText', altText);
@@ -223,7 +199,7 @@ const title = 'Admin';
              </div>
              <div class="muted">${ev.date}</div>
              <div>${ev.description || ''}</div>
-              ${ev.imageUrl ? `<img src="${API_BASE}${ev.imageUrl}" alt="${ev.title}" class="thumb" style="margin-top:0.5rem;" />` : '<div class="muted">Kein Bild</div>'}
+              <div class="muted">Bild: ${ev.imageUrl || ''}</div>
              <div class="row-buttons">
                <button data-id="${ev.id}" class="btn-del-ev">Löschen</button>
              </div>`;
@@ -278,13 +254,14 @@ const title = 'Admin';
        const date = (document.getElementById('ev-date')).value.trim();
        const desc = (document.getElementById('ev-desc')).value.trim();
        const file = /** @type {HTMLInputElement} */ (document.getElementById('ev-file')).files[0];
+        const alt = (document.getElementById('ev-alt')).value.trim();
        const msg = document.getElementById('ev-create-msg');
        msg.textContent = 'Lade Bild hoch...';
        try {
          let imageUrl = '';
          if (file) {
-            const up = await uploadEventImage(file);
-            imageUrl = up?.imageUrl || '';
+            const up = await uploadImage(file, alt || title);
+            imageUrl = up?.image?.imageUrl || '';
          }
          msg.textContent = 'Lege Event an...';
          await api('/api/events', {
@@ -296,6 +273,7 @@ const title = 'Admin';
          (document.getElementById('ev-date')).value = '';
          (document.getElementById('ev-desc')).value = '';
          (document.getElementById('ev-file')).value = '';
+          (document.getElementById('ev-alt')).value = '';
          await loadEvents();
        } catch(e){ msg.textContent = 'Fehler: '+e.message }
      });
@@ -334,144 +312,128 @@ const title = 'Admin';
        } catch(e){ msg.textContent = 'Fehler: '+e.message }
      });

-      // ========== Gallery ==========
+      // ========== Gallery Management ==========
+      let galReorderMode = false;
+      let lastGallery = [];
+
      async function loadGallery() {
        const listEl = document.getElementById('gallery-list');
        listEl.innerHTML = '<div class="muted">Lade...</div>';
        try {
          const data = await api('/api/gallery');
          listEl.innerHTML = '';
-          const galleryImages = (data.images || []).slice();
-          galleryImages.sort((a,b) => (a.displayOrder??0) - (b.displayOrder??0));
+          lastGallery = (data.images || []).slice();
+          let renderList = lastGallery.slice();

-          galleryImages.forEach((img) => {
+          if (galReorderMode) {
+            renderList.sort((a,b) => (a.displayOrder??0) - (b.displayOrder??0));
+          }
+
+          renderList.forEach((img, idx) => {
            const card = document.createElement('div');
            card.className = 'card';
+            card.setAttribute('draggable', String(galReorderMode));
+            card.dataset.id = img.id;
+            card.dataset.displayOrder = String(img.displayOrder ?? idx);
            card.innerHTML = `
-              <img src="${API_BASE}${img.imageUrl}" alt="${img.altText}" class="thumb" />
-              <div class="muted">${img.altText || ''}</div>
+              <div class="row" style="justify-content:space-between;align-items:center">
+                <div><strong>${img.altText}</strong></div>
+                ${galReorderMode ? '<span class="drag-handle">⇅ Ziehen</span>' : ''}
+              </div>
+              <img src="${API_BASE}${img.imageUrl}" alt="${img.altText}" style="max-width:100%;height:auto;margin:0.5rem 0;" />
+              <div class="muted">URL: ${img.imageUrl}</div>
              <div class="row-buttons">
                <button data-id="${img.id}" class="btn-del-gal">Löschen</button>
              </div>`;
            listEl.appendChild(card);
          });
+
          listEl.querySelectorAll('.btn-del-gal').forEach(btn => {
            btn.addEventListener('click', async () => {
              const id = btn.getAttribute('data-id');
              if (!id) return;
              if (!confirm('Bild wirklich löschen?')) return;
-              try { await api(`/api/gallery/${id}`, { method: 'DELETE' }); await loadGallery(); } catch(e){ alert('Fehler: '+e.message); }
+              try {
+                await api(`/api/gallery/${id}`, { method: 'DELETE' });
+                await loadGallery();
+              } catch(e){ alert('Fehler: '+e.message); }
            })
          })
+
+          if (galReorderMode) {
+            enableGalleryDragAndDrop(listEl);
+          }
        } catch (e) {
          listEl.innerHTML = '<div class="muted">Fehler beim Laden</div>';
          console.error(e);
        }
      }

+      function enableGalleryDragAndDrop(container){
+        let draggingEl = null;
+        container.querySelectorAll('.card').forEach(card => {
+          card.addEventListener('dragstart', (e) => {
+            draggingEl = card; card.classList.add('dragging');
+            e.dataTransfer.setData('text/plain', card.dataset.id || '');
+          });
+          card.addEventListener('dragend', () => { draggingEl = null; card.classList.remove('dragging'); });
+          card.addEventListener('dragover', (e) => { e.preventDefault(); });
+          card.addEventListener('drop', (e) => {
+            e.preventDefault();
+            const target = card;
+            if (!draggingEl || draggingEl === target) return;
+            const cards = Array.from(container.querySelectorAll('.card'));
+            const draggingIdx = cards.indexOf(draggingEl);
+            const targetIdx = cards.indexOf(target);
+            if (draggingIdx < targetIdx) {
+              target.after(draggingEl);
+            } else {
+              target.before(draggingEl);
+            }
+          });
+        });
+      }
+
      document.getElementById('btn-create-gal').addEventListener('click', async () => {
-        const file = /** @type {HTMLInputElement} */ (document.getElementById('gal-file')).files[0];
-        const alt = (document.getElementById('gal-alt')).value.trim();
+        const file = document.getElementById('gal-file').files[0];
+        const alt = document.getElementById('gal-alt').value.trim();
        const msg = document.getElementById('gal-create-msg');
+
        if (!file) {
-          msg.textContent = 'Bitte Datei auswählen';
+          msg.textContent = 'Bitte wähle ein Bild aus';
          return;
        }
+
        msg.textContent = 'Lade Bild hoch...';
        try {
-          await uploadGalleryImage(file, alt);
+          const up = await uploadImage(file, alt || 'Gallery Image');
          msg.textContent = 'Bild hochgeladen';
-          (document.getElementById('gal-file')).value = '';
-          (document.getElementById('gal-alt')).value = '';
+          document.getElementById('gal-file').value = '';
+          document.getElementById('gal-alt').value = '';
          await loadGallery();
-        } catch(e){ msg.textContent = 'Fehler: '+e.message }
-      });
-
-      // ========== Banner ==========
-      async function loadBanners() {
-        const listEl = document.getElementById('banner-list');
-        listEl.innerHTML = '<div class="muted">Lade...</div>';
-        try {
-          const data = await api('/api/banners');
-          listEl.innerHTML = '';
-          const bannersList = (data.banners || []).slice();
-          bannersList.sort((a,b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
-
-          bannersList.forEach((banner) => {
-            const card = document.createElement('div');
-            card.className = 'card';
-            const statusText = banner.isActive ? '✓ Aktiv' : '✗ Inaktiv';
-            card.innerHTML = `
-              <div><strong>${banner.text.substring(0, 60)}${banner.text.length > 60 ? '...' : ''}</strong></div>
-              <div class="muted">Von: ${banner.startDate}</div>
-              <div class="muted">Bis: ${banner.endDate}</div>
-              <div class="pill">${statusText}</div>
-              <div class="row-buttons">
-                <button data-id="${banner.id}" class="btn-toggle-banner">${banner.isActive ? 'Deaktivieren' : 'Aktivieren'}</button>
-                <button data-id="${banner.id}" class="btn-del-banner">Löschen</button>
-              </div>`;
-            listEl.appendChild(card);
-          });
-
-          listEl.querySelectorAll('.btn-toggle-banner').forEach(btn => {
-            btn.addEventListener('click', async () => {
-              const id = btn.getAttribute('data-id');
-              if (!id) return;
-              const banner = bannersList.find(b => b.id === id);
-              if (!banner) return;
-              try {
-                await api(`/api/banners/${id}`, {
-                  method: 'PUT',
-                  headers: { 'Content-Type': 'application/json' },
-                  body: JSON.stringify({
-                    text: banner.text,
-                    startDate: banner.startDate,
-                    endDate: banner.endDate,
-                    isActive: !banner.isActive
-                  })
-                });
-                await loadBanners();
-              } catch(e){ alert('Fehler: '+e.message); }
-            })
-          });
-
-          listEl.querySelectorAll('.btn-del-banner').forEach(btn => {
-            btn.addEventListener('click', async () => {
-              const id = btn.getAttribute('data-id');
-              if (!id) return;
-              if (!confirm('Banner wirklich löschen?')) return;
-              try { await api(`/api/banners/${id}`, { method: 'DELETE' }); await loadBanners(); } catch(e){ alert('Fehler: '+e.message); }
-            })
-          })
        } catch(e){
-          listEl.innerHTML = '<div class="muted">Fehler beim Laden</div>';
-          console.error(e);
+          msg.textContent = 'Fehler: '+e.message
        }
-      }
-
-      document.getElementById('btn-create-banner').addEventListener('click', async () => {
-        const text = (document.getElementById('banner-text')).value.trim();
-        const startDate = (document.getElementById('banner-start')).value.trim();
-        const endDate = (document.getElementById('banner-end')).value.trim();
-        const msg = document.getElementById('banner-create-msg');
-
-        if (!text || !startDate || !endDate) {
-          msg.textContent = 'Bitte alle Felder ausfüllen';
-          return;
-        }
-
-        msg.textContent = 'Erstelle Banner...';
-        try {
-          await api('/api/banners', {
-            method: 'POST',
-            headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify({ text, startDate, endDate, isActive: true })
      });
-          msg.textContent = 'Banner erstellt';
-          (document.getElementById('banner-text')).value = '';
-          (document.getElementById('banner-start')).value = '';
-          (document.getElementById('banner-end')).value = '';
-          await loadBanners();
+
+      document.getElementById('btn-toggle-gal-reorder').addEventListener('click', async () => {
+        galReorderMode = !galReorderMode;
+        document.getElementById('btn-save-gal-order').style.display = galReorderMode ? '' : 'none';
+        await loadGallery();
+      });
+
+      document.getElementById('btn-save-gal-order').addEventListener('click', async () => {
+        const container = document.getElementById('gallery-list');
+        const cards = Array.from(container.querySelectorAll('.card'));
+        const orders = cards.map((c, idx) => ({ id: c.dataset.id, displayOrder: idx }));
+        const msg = document.getElementById('gal-order-msg');
+        msg.textContent = 'Speichere Reihenfolge...';
+        try {
+          await api('/api/gallery/reorder', { method:'PUT', headers:{'Content-Type':'application/json'}, body: JSON.stringify({ orders }) });
+          msg.textContent = 'Reihenfolge gespeichert';
+          galReorderMode = false;
+          document.getElementById('btn-save-gal-order').style.display = 'none';
+          await loadGallery();
        } catch(e){ msg.textContent = 'Fehler: '+e.message }
      });

@@ -1,6 +1,5 @@
 ---
 import Layout from "../components/Layout.astro";
-import Banner from "../components/Banner.astro";
 import Hero from "../components/Hero.astro";
 import Welcome from "../components/Welcome.astro";
 import EventsGrid from "../components/EventsGrid.astro";
@@ -9,69 +8,43 @@ import ImageCarousel from "../components/ImageCarousel.astro";
 import Contact from "../components/Contact.astro";
 import About from "../components/About.astro";

-const events = [
-	{
-		image: "/images/events/mmnm5yob-w9xjor.jpeg",
-		title: "Karaoke",
-		date: "2026-03-12",
-		description: `
-			Du singst gerne, aber lieber für dich? Dann kannst du den Sangallerruum im 2OG auch privat mieten. (Optimal für 10-20Pers). Mehr Info's🍀via WA 077 232 27 70
-		`,
-	},
-	{
-		image: "/images/events/mj67800i-6ng82x.jpeg",
-		title: "Pub Quiz",
-		date: "2025-12-02",
-		description: `
-			Jeden Freitag 20:00Uhr-ca 21:30Uhr. 
-Plätze sind begrenzt! Jetzt reservieren unter 🍀WA 077 232 27 70
-		`,
-	},
-	{
-		image: "/images/events/mr82c7eh-yp87hy.jpeg",
-		title: "Richie Live",
-		date: "2026-08-27",
-		description: `
-			SOLD OUT! - Richie hat das Image eines Weltenbummlers und Musikkünstlers. In der Ostschweiz ist er bereits bestens bekannt.🍀Warteliste: WA 077 232 27 70
-		`,
-	},
-	{
-		image: "/images/events/mrnpux59-b3075p.jpeg",
-		title: "Hannes LIVE",
-		date: "2026-09-10",
-		description: `
-			Er ist zurück!🥰🍀Johannes ist wieder bei uns! Eine weitere unvergessliche Irish-Night!!🍀Sei dabei! Reservationen🍀via WA 077 232 27 70
-		`,
-	},
-	{
-		image: "/images/events/mrngoyyy-49rz7u.jpeg",
-		title: "Danielle&Nina",
-		date: "2026-09-24",
-		description: `
-			SOLD OUT! - First time on stage – und das direkt im Gallus Pub!🎤✨
-Danielle & Nina bringen Irish Folk & liebevolle Cover Songs.🍀Warteliste: WA 077 232 27 70
-		`,
-	}
-];
+const API_BASE = 'https://cms.gallus-pub.ch';

-const images = [
-	{ src: "/images/gallery/mndhrrtl-s4o8dn.png", alt: "mndhrrtl-s4o8dn.png" },
-	{ src: "/images/gallery/mndhtjvz-965yra.jpeg", alt: "mndhtjvz-965yra.jpeg" },
-	{ src: "/images/gallery/mndi3625-lnnggc.jpeg", alt: "mndi3625-lnnggc.jpeg" },
-	{ src: "/images/gallery/mndi7upa-qxukqg.jpeg", alt: "mndi7upa-qxukqg.jpeg" },
-	{ src: "/images/gallery/mndi8kzg-oazjp8.jpeg", alt: "mndi8kzg-oazjp8.jpeg" },
-	{ src: "/images/gallery/mndiabuo-m29xj0.jpeg", alt: "mndiabuo-m29xj0.jpeg" },
-	{ src: "/images/gallery/mndicr59-n8suoy.jpeg", alt: "mndicr59-n8suoy.jpeg" },
-	{ src: "/images/gallery/mndieqns-mjs7xe.jpeg", alt: "mndieqns-mjs7xe.jpeg" },
-	{ src: "/images/gallery/mndif8nv-aptjf6.jpeg", alt: "mndif8nv-aptjf6.jpeg" },
-	{ src: "/images/gallery/mndiggta-hnldkv.jpeg", alt: "mndiggta-hnldkv.jpeg" },
-	{ src: "/images/gallery/mndih8lp-woprt4.webp", alt: "mndih8lp-woprt4.webp" }
-];
+// Fetch events from backend API
+let events = [];
+try {
+	const eventsResponse = await fetch(`${API_BASE}/api/events/public`);
+	if (eventsResponse.ok) {
+		const eventsData = await eventsResponse.json();
+		events = (eventsData.events || []).map((ev: any) => ({
+			image: `${API_BASE}${ev.imageUrl}`,
+			title: ev.title,
+			date: ev.date,
+			description: ev.description
+		}));
+	}
+} catch (error) {
+	console.error('Failed to fetch events:', error);
+}
+
+// Fetch gallery images from backend API
+let images = [];
+try {
+	const galleryResponse = await fetch(`${API_BASE}/api/gallery/public`);
+	if (galleryResponse.ok) {
+		const galleryData = await galleryResponse.json();
+		images = (galleryData.images || []).map((img: any) => ({
+			src: `${API_BASE}${img.imageUrl}`,
+			alt: img.altText
+		}));
+	}
+} catch (error) {
+	console.error('Failed to fetch gallery:', error);
+}
 ---

 <Layout>
 	<Hero id="hero" />
-	<Banner />
 	<Welcome id="welcome" />
 	<EventsGrid id="events" events={events} />
 	<ImageCarousel id="gallery" images={images} />
@@ -1,26 +0,0 @@
-.banner-wrapper {
-  width: 100%;
-  background-color: var(--color-orange1);
-  padding: 1rem 0;
-}
-
-.banner {
-  max-width: var(--container-max-width);
-  margin: 0 auto;
-  padding: 0 var(--padding-horizontal);
-}
-
-.banner p {
-  color: #000;
-  font-size: var(--font-size-small-medium);
-  font-weight: 600;
-  margin: 0;
-  text-align: center;
-  line-height: 1.4;
-}
-
-@media (max-width: 768px) {
-  .banner p {
-    font-size: var(--font-size-small);
-  }
-}
				`@@ -1 +0,0 @@`
				<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="500" zoomAndPan="magnify" viewBox="0 0 375 374.999991" height="500" preserveAspectRatio="xMidYMid meet" version="1.0"><defs><clipPath id="f68ef4028f"><path d="M 47.203125 40 L 322 40 L 322 335 L 47.203125 335 Z M 47.203125 40 " clip-rule="nonzero"/></clipPath></defs><g clip-path="url(#f68ef4028f)"><path fill="#1d6b32" d="M 48.097656 139.574219 C 48.097656 128.285156 48.660156 119.429688 55.417969 109.972656 C 60.960938 102.21875 68.625 96.976562 75.371094 90.4375 C 90.03125 76.242188 102.058594 52.597656 122.386719 45.964844 C 140.441406 40.078125 161.71875 50.683594 170.175781 67.148438 C 174.488281 75.5625 175.570312 84.835938 176.609375 94.097656 C 178.023438 106.769531 179.671875 119.417969 181.199219 132.078125 C 186.097656 127.304688 184.324219 113.089844 184.800781 106.679688 C 185.414062 98.355469 185.589844 89.773438 187.167969 81.554688 C 190.136719 66.023438 202.230469 53.867188 215.535156 46.148438 C 230.378906 37.53125 245.867188 37.894531 259.476562 48.902344 C 265.457031 53.734375 269.027344 59.921875 273.558594 65.980469 C 278.105469 72.058594 283.742188 77.164062 289.878906 81.59375 C 301.03125 89.632812 313.222656 97.105469 314.707031 111.992188 C 315.859375 123.574219 312.664062 136.851562 306.261719 146.585938 C 298.824219 157.886719 283.566406 165.484375 271.140625 169.84375 C 263.703125 172.453125 256.171875 173.589844 248.375 174.402344 C 243.988281 174.855469 239.605469 175.347656 235.230469 175.863281 C 233.320312 176.085938 220.464844 177.1875 222.21875 178.914062 C 223.414062 180.097656 232.449219 178.90625 234.25 178.929688 C 238.816406 178.984375 243.378906 179.058594 247.9375 179.101562 C 258.195312 179.199219 268.472656 179.238281 278.703125 179.984375 C 294.078125 181.101562 308.125 186.960938 316.167969 200.828125 C 324.128906 214.566406 322.324219 235.332031 313.648438 248.554688 C 309.550781 254.800781 302.960938 258.933594 298.382812 264.773438 C 292.863281 271.808594 289.753906 280.417969 284.703125 287.777344 C 277.070312 298.902344 265.578125 308.597656 251.328125 307.664062 C 237.253906 306.738281 223.84375 295.984375 214.992188 285.644531 C 204.679688 273.609375 202.425781 260.40625 198.433594 245.617188 C 197.992188 243.980469 196.5 234.824219 195.105469 234.082031 C 192.15625 232.503906 193.15625 242.25 193.140625 243.652344 C 193.039062 252.289062 193.183594 260.898438 194.160156 269.492188 C 195.984375 285.542969 200.703125 301.367188 211.675781 313.625 C 215.640625 318.050781 226.738281 326.539062 219.757812 333.71875 C 216.042969 337.535156 203.546875 329.980469 199.726562 326.988281 C 169.355469 303.21875 175.738281 257.648438 175.738281 223.953125 C 158.667969 247.144531 172.769531 289.511719 141.984375 304.472656 C 130.417969 310.089844 113.792969 310.679688 102.148438 305.070312 C 88.4375 298.476562 81.277344 282.652344 73.429688 270.453125 C 69.234375 263.933594 63.84375 258.296875 58.707031 252.453125 C 55.953125 249.324219 52.542969 246.261719 50.21875 242.816406 C 47.457031 238.734375 47.503906 233.292969 48.097656 228.109375 C 49.5 215.78125 54.359375 203.136719 63.367188 194.40625 C 72.792969 185.277344 84.792969 181.804688 97.621094 181.160156 C 106.09375 180.734375 114.582031 180.5625 123.0625 180.191406 C 127.40625 180.003906 131.675781 179.730469 135.988281 179.113281 C 141.285156 178.359375 145.921875 177.105469 138.335938 175.230469 C 109.652344 168.167969 59.332031 176.03125 48.097656 139.574219 C 48.097656 135.066406 52.933594 155.265625 48.097656 139.574219 " fill-opacity="1" fill-rule="nonzero"/></g></svg>