Initial commit: dotzhauer v4 heimat + Dockerfile/nginx for Coolify

src/components/Contact.jsx

@@ -0,0 +1,95 @@
+import { useState } from "react";
+
+export default function Contact() {
+  const [sent, setSent] = useState(false);
+
+  return (
+    <section id="kontakt" className="section">
+      <div className="section-head">
+        <div>
+          <span className="num">— Sprechen wir</span>
+        </div>
+        <div>
+          <span className="eyebrow">finden Sie uns</span>
+          <h2>
+            Schreiben Sie uns — <em>wir freuen uns</em>.
+          </h2>
+        </div>
+      </div>
+
+      <div className="contact">
+        <aside className="contact-card">
+          <div className="letterhead">
+            <h3>Familie Dotzauer</h3>
+            <span className="h">in der Werkstatt erreichbar</span>
+          </div>
+          <ul>
+            <li>
+              <strong>Werkstatt</strong>
+              <span className="value">Maiberger Str. 2 · 03044 Cottbus</span>
+            </li>
+            <li>
+              <strong>Telefon</strong>
+              <a href="tel:+4935586034 5">0355 / 86 03 45</a>
+            </li>
+            <li>
+              <strong>Notdienst (24 / 7)</strong>
+              <a href="tel:+4935586034 6">0355 / 86 03 46</a>
+            </li>
+            <li>
+              <strong>E-Post</strong>
+              <a href="mailto:info@dotzauer-kaelte-klima.de">
+                info@dotzauer-kaelte-klima.de
+              </a>
+            </li>
+            <li>
+              <strong>Öffnungszeit</strong>
+              <span className="value">Mo – Fr · 7 – 17 Uhr</span>
+            </li>
+          </ul>
+        </aside>
+
+        <form
+          className="contact-form"
+          onSubmit={(e) => { e.preventDefault(); setSent(true); }}
+        >
+          <span className="form-label">
+            Hallo!
+            <span className="small">Erzählen Sie uns, worum es geht — wir antworten binnen eines Werktages.</span>
+          </span>
+
+          <div className="form-row">
+            <label>
+              <span>Ihr Name</span>
+              <input type="text" required placeholder="Vor- und Nachname" />
+            </label>
+            <label>
+              <span>E-Post</span>
+              <input type="email" required placeholder="ihre@adresse.de" />
+            </label>
+          </div>
+
+          <div className="form-row full">
+            <label>
+              <span>Worum geht es?</span>
+              <textarea rows="4" required placeholder="Was beschäftigt Sie? Welche Anlage, welcher Standort, welcher Termin?" />
+            </label>
+          </div>
+
+          {sent ? (
+            <p className="form-success">
+              Vielen Dank! Wir melden uns binnen eines Werktages bei Ihnen. — Familie Dotzauer
+            </p>
+          ) : (
+            <div className="actions">
+              <span className="note">Wir antworten binnen 24h ✓</span>
+              <button type="submit" className="btn btn-primary">
+                Absenden <span className="arrow">→</span>
+              </button>
+            </div>
+          )}
+        </form>
+      </div>
+    </section>
+  );
+}