Legal pages: privacy, terms, GDPR, contact form for enterprise. Footer links updated.

2026-04-13 20:37:56 +02:00
parent 5712fd7872
commit 1074b31c90
5 changed files with 453 additions and 2 deletions
@@ -0,0 +1,128 @@
+"use client"
+import { useState } from "react"
+import Link from "next/link"
+
+export default function ContactPage() {
+  const [form, setForm] = useState({
+    name: "", company: "", email: "", phone: "", type: "enterprise", message: ""
+  })
+  const [loading, setLoading] = useState(false)
+  const [success, setSuccess] = useState(false)
+  const [error, setError] = useState("")
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault()
+    setLoading(true)
+    setError("")
+    
+    try {
+      // In production, this would send to a backend/API
+      await new Promise(resolve => setTimeout(resolve, 1500))
+      setSuccess(true)
+    } catch {
+      setError("Something went wrong. Please try again.")
+    }
+    setLoading(false)
+  }
+
+  return (
+    <div className="min-h-screen bg-slate-900">
+      <nav className="flex justify-between items-center px-6 py-5 max-w-4xl mx-auto">
+        <Link href="/autojobs" className="text-2xl font-bold text-white">
+          Auto<span className="text-blue-400">Jobs</span>
+        </Link>
+        <Link href="/autojobs" className="text-slate-400 hover:text-white transition text-sm">
+          ← Back to Home
+        </Link>
+      </nav>
+      
+      <main className="max-w-2xl mx-auto px-6 py-12">
+        <div className="text-center mb-10">
+          <div className="inline-block px-4 py-1.5 rounded-full bg-purple-500/20 border border-purple-500/30 text-purple-300 text-sm mb-4">
+            Enterprise Solutions
+          </div>
+          <h1 className="text-3xl font-bold text-white mb-3">Contact Us</h1>
+          <p className="text-slate-400">Ready for unlimited job applications? Let's build a custom plan for your agency.</p>
+        </div>
+        
+        {success ? (
+          <div className="bg-green-500/20 border border-green-500/30 rounded-2xl p-8 text-center">
+            <div className="text-5xl mb-4">✓</div>
+            <h2 className="text-2xl font-bold text-white mb-2">Message Sent!</h2>
+            <p className="text-slate-300 mb-4">Our enterprise team will respond within 24 hours.</p>
+            <Link href="/autojobs" className="text-blue-400 hover:underline">← Back to AutoJobs</Link>
+          </div>
+        ) : (
+          <form onSubmit={handleSubmit} className="bg-slate-800 rounded-2xl p-8 border border-slate-700">
+            {error && (
+              <div className="mb-6 p-4 bg-red-500/20 border border-red-500/30 rounded-xl text-red-400 text-sm">
+                {error}
+              </div>
+            )}
+            
+            <div className="space-y-5">
+              <div className="grid grid-cols-2 gap-5">
+                <div>
+                  <label className="block text-sm text-slate-400 mb-1.5">Full Name *</label>
+                  <input required type="text" value={form.name} onChange={e => setForm({...form, name: e.target.value})}
+                    className="w-full px-4 py-3 bg-slate-700 border border-slate-600 rounded-xl text-white placeholder-slate-500 focus:outline-none focus:border-blue-500"
+                    placeholder="Sarah Johnson" />
+                </div>
+                <div>
+                  <label className="block text-sm text-slate-400 mb-1.5">Company *</label>
+                  <input required type="text" value={form.company} onChange={e => setForm({...form, company: e.target.value})}
+                    className="w-full px-4 py-3 bg-slate-700 border border-slate-600 rounded-xl text-white placeholder-slate-500 focus:outline-none focus:border-blue-500"
+                    placeholder="Acme Recruiting" />
+                </div>
+              </div>
+              
+              <div className="grid grid-cols-2 gap-5">
+                <div>
+                  <label className="block text-sm text-slate-400 mb-1.5">Email *</label>
+                  <input required type="email" value={form.email} onChange={e => setForm({...form, email: e.target.value})}
+                    className="w-full px-4 py-3 bg-slate-700 border border-slate-600 rounded-xl text-white placeholder-slate-500 focus:outline-none focus:border-blue-500"
+                    placeholder="sarah@acme-recruiting.com" />
+                </div>
+                <div>
+                  <label className="block text-sm text-slate-400 mb-1.5">Phone</label>
+                  <input type="tel" value={form.phone} onChange={e => setForm({...form, phone: e.target.value})}
+                    className="w-full px-4 py-3 bg-slate-700 border border-slate-600 rounded-xl text-white placeholder-slate-500 focus:outline-none focus:border-blue-500"
+                    placeholder="+1 555 123 4567" />
+                </div>
+              </div>
+              
+              <div>
+                <label className="block text-sm text-slate-400 mb-1.5">Interest</label>
+                <select value={form.type} onChange={e => setForm({...form, type: e.target.value})}
+                  className="w-full px-4 py-3 bg-slate-700 border border-slate-600 rounded-xl text-white focus:outline-none focus:border-blue-500">
+                  <option value="enterprise">Enterprise Plan — Unlimited</option>
+                  <option value="agency">Agency Plan — High Volume</option>
+                  <option value="partnership">Partnership / Reseller</option>
+                  <option value="custom">Custom Integration</option>
+                  <option value="other">Other</option>
+                </select>
+              </div>
+              
+              <div>
+                <label className="block text-sm text-slate-400 mb-1.5">Tell us about your needs *</label>
+                <textarea required rows={4} value={form.message} onChange={e => setForm({...form, message: e.target.value})}
+                  className="w-full px-4 py-3 bg-slate-700 border border-slate-600 rounded-xl text-white placeholder-slate-500 focus:outline-none focus:border-blue-500 resize-none"
+                  placeholder="We're a recruiting agency with 50+ clients. We need to handle 10,000+ applications/month with white-label options..." />
+              </div>
+              
+              <button type="submit" disabled={loading}
+                className="w-full py-3.5 bg-purple-500 hover:bg-purple-600 disabled:bg-slate-600 text-white rounded-xl font-semibold transition">
+                {loading ? "Sending..." : "Send Message"}
+              </button>
+            </div>
+          </form>
+        )}
+        
+        <div className="mt-8 text-center text-slate-500 text-sm">
+          <p>Prefer email? <a href="mailto:enterprise@hostpioneers.com" className="text-blue-400 hover:underline">enterprise@hostpioneers.com</a></p>
+          <p className="mt-2">Typical response time: &lt;24 hours</p>
+        </div>
+      </main>
+    </div>
+  )
+}