Merge branch 'dev' into prod

docker-compose.yml

@@ -1,16 +1,19 @@
 services:
-  #  frontend:
+  frontend:
-  #    container_name: ca-lose-frontend
+    container_name: ca-lose-frontend
-  #    build: ./frontend
+    hostname: lose-verkaufen
-  #    ports:
+    build: ./frontend
-  #      - "8002:80"
+    depends_on:
-  #    restart: unless-stopped
+      - backend
+    networks:
+      ca-lose-internal:
+        ipv4_address: 172.25.0.2
+    restart: unless-stopped
 
   backend:
     container_name: ca-lose-backend
+    hostname: backend
     build: ./backend
-    ports:
-      - "8004:8004"
     environment:
       NODE_ENV: production
       DB_HOST: ca-lose-mysql
@@ -19,21 +22,81 @@ services:
       DB_NAME: ca_lose
     depends_on:
       - database
+    networks:
+      ca-lose-internal:
+        ipv4_address: 172.25.0.3
     restart: unless-stopped
 
   database:
     container_name: ca-lose-mysql
+    hostname: database
     image: mysql:8.0
     restart: unless-stopped
-    ports:
-      - "3311:3306"
     environment:
       MYSQL_ROOT_PASSWORD: ${DB_PASSWORD}
       MYSQL_DATABASE: ca_lose
       TZ: Europe/Berlin
     volumes:
-      - ca-lose_mysql:/var/lib/mysql
+      - ../docker/volumes/ca-lose_mysql:/var/lib/mysql
       - ./mysql-timezone.cnf:/etc/mysql/conf.d/timezone.cnf:ro
+    networks:
+      ca-lose-internal:
+        ipv4_address: 172.25.0.4
 
-volumes:
+  # DNS Server für Hostname-Auflösung innerhalb des VPN
-  ca-lose_mysql:
+  dnsmasq:
+    container_name: ca-lose-dns
+    image: andyshinn/dnsmasq:latest
+    restart: unless-stopped
+    cap_add:
+      - NET_ADMIN
+    command: >
+      --no-daemon
+      --log-queries
+      --address=/lose-verkaufen/172.25.0.2
+      --address=/frontend/172.25.0.2
+      --address=/backend/172.25.0.3
+      --address=/database/172.25.0.4
+      --address=/wireguard/172.25.0.6
+    networks:
+      ca-lose-internal:
+        ipv4_address: 172.25.0.5
+
+  # WireGuard VPN mit Web-UI (wg-easy)
+  wireguard:
+    image: ghcr.io/wg-easy/wg-easy:latest
+    container_name: ca-lose-wireguard
+    cap_add:
+      - NET_ADMIN
+      - SYS_MODULE
+    environment:
+      LANG: de
+      WG_HOST: dus3.the1s.de
+      WG_PORT: "51830"
+      WG_DEFAULT_DNS: "172.25.0.5"
+      WG_ALLOWED_IPS: 172.25.0.0/24
+      PORT: "80" # Web-UI Port
+      PASSWORD_HASH: ${WIREGUARD_PASSWORD_HASH}
+    volumes:
+      - ../docker/volumes/ca-lose-wireguard:/etc/wireguard
+      - /lib/modules:/lib/modules:ro
+    ports:
+      - "51830:51830/udp"
+    #  - "51831:80/tcp" # only for short configuration access - remove in production - external: 51831 internal: 80
+    sysctls:
+      - net.ipv4.ip_forward=1
+      - net.ipv4.conf.all.src_valid_mark=1
+    restart: unless-stopped
+    depends_on:
+      - dnsmasq
+    networks:
+      ca-lose-internal:
+        ipv4_address: 172.25.0.6
+
+networks:
+  ca-lose-internal:
+    driver: bridge
+    ipam:
+      config:
+        - subnet: 172.25.0.0/24
+          gateway: 172.25.0.1

frontend/src/pages/SuccessPage.tsx

@@ -36,7 +36,7 @@ export const SuccessPage = () => {
   });
 
   return (
-    <div className="min-h-screen w-full flex items-center justify-center bg-linear-to-br from-slate-800 to-slate-900 p-4">
+    <div className="min-h-screen w-full flex items-center justify-center bg-gradient-to-br from-slate-800 to-slate-900 p-4">
       <Sheet
         variant="plain"
         sx={{
@@ -82,10 +82,7 @@ export const SuccessPage = () => {
 
         {/* Headline */}
         <div style={fadeUp("0.2s")}>
-          <Typography
+          <Typography level="h3" sx={{ fontWeight: 700, color: "#15803d", mb: 1 }}>
-            level="h3"
-            sx={{ fontWeight: 700, color: "#15803d", mb: 1 }}
-          >
             {t("form-submitted-successfully")}
           </Typography>
         </div>
@@ -113,18 +110,8 @@ export const SuccessPage = () => {
 
         {/* Order ID chip */}
         {orderId && (
-          <div
+          <div style={fadeUp("0.4s")} className="flex flex-col items-center gap-1 mb-4">
-            style={fadeUp("0.4s")}
+            <Typography level="body-xs" sx={{ color: "#9ca3af", textTransform: "uppercase", letterSpacing: "0.08em" }}>
-            className="flex flex-col items-center gap-1 mb-4"
-          >
-            <Typography
-              level="body-xs"
-              sx={{
-                color: "#9ca3af",
-                textTransform: "uppercase",
-                letterSpacing: "0.08em",
-              }}
-            >
               {t("entry-id")}
             </Typography>
             <Chip
@@ -151,9 +138,7 @@ export const SuccessPage = () => {
               borderRadius: "12px",
               fontWeight: 700,
               background: "linear-gradient(135deg, #2563eb, #1d4ed8)",
-              "&:hover": {
+              "&:hover": { background: "linear-gradient(135deg, #1d4ed8, #1e40af)" },
-                background: "linear-gradient(135deg, #1d4ed8, #1e40af)",
-              },
             }}
           >
             {seconds}s &mdash; {t("return-to-homepage")}
@@ -161,11 +146,11 @@ export const SuccessPage = () => {
         </div>
 
         {/* Thank-you note */}
-        <div style={fadeUp("0.5s")} className="pt-4 border-t border-slate-100">
+        <div
-          <Typography
+          style={fadeUp("0.5s")}
-            level="body-sm"
+          className="pt-4 border-t border-slate-100"
-            sx={{ color: "#9ca3af", lineHeight: 1.6 }}
+        >
-          >
+          <Typography level="body-sm" sx={{ color: "#9ca3af", lineHeight: 1.6 }}>
             {t("thank-you")}
           </Typography>
         </div>