diff --git a/client/pages/corp/CorpContactUs.tsx b/client/pages/corp/CorpContactUs.tsx index 91466ca2..6a90bc13 100644 --- a/client/pages/corp/CorpContactUs.tsx +++ b/client/pages/corp/CorpContactUs.tsx @@ -1,7 +1,14 @@ import Layout from "@/components/Layout"; import { Button } from "@/components/ui/button"; -import { Card, CardContent } from "@/components/ui/card"; -import { Mail, Phone, MapPin, Clock, ArrowRight } from "lucide-react"; +import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; +import { + Mail, + Phone, + MapPin, + MessageSquare, + ArrowRight, + Clock, +} from "lucide-react"; import { useNavigate } from "react-router-dom"; import { useState } from "react"; @@ -10,12 +17,58 @@ export default function CorpContactUs() { const [formData, setFormData] = useState({ name: "", email: "", + company: "", + phone: "", + service: "", message: "", }); + const contactMethods = [ + { + icon: Mail, + title: "Email", + value: "enterprise@aethex.tech", + description: "Response within 24 hours", + }, + { + icon: Phone, + title: "Phone", + value: "+1 (555) 123-4567", + description: "Available 9AM-6PM EST", + }, + { + icon: MapPin, + title: "Office", + value: "San Francisco, CA", + description: "Schedule an in-person meeting", + }, + { + icon: MessageSquare, + title: "Live Chat", + value: "Chat with us", + description: "Available during business hours", + }, + ]; + + const handleInputChange = ( + e: React.ChangeEvent< + HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement + > + ) => { + const { name, value } = e.target; + setFormData((prev) => ({ ...prev, [name]: value })); + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + console.log("Form submitted:", formData); + // Here you would typically send the form data to your backend + }; + return (
+ {/* Background */}
@@ -23,6 +76,7 @@ export default function CorpContactUs() {
+ {/* Header */}
+ {/* Contact Methods */}
-
- {/* Contact Info */} -
-

- Contact Information -

- -
-
- -
-

- Email +

+ Ways to Reach Us +

+
+ {contactMethods.map((method, idx) => { + const Icon = method.icon; + return ( + + + +

+ {method.title} +

+

+ {method.value}

- - info@aethex.biz - -
-
- -
- -
-

- Phone +

+ {method.description}

- - (346) 556-7100 - -
-
+ + + ); + })} +
+
+
-
- -
-

- Response Time -

-

- Within 24 business hours -

-
-
-
- -
-

- Quick Links -

-
- - - -
-
-
- - {/* Contact Form */} -
- - + {/* Contact Form */} +
+
+ + + + Send us a message + + + +
+
+ {/* Name */}
- setFormData({ ...formData, name: e.target.value }) - } - className="w-full px-4 py-2 bg-blue-950/40 border border-blue-400/30 rounded text-blue-300 placeholder-blue-400/50" - placeholder="Your name" + onChange={handleInputChange} + required + className="w-full bg-blue-950/50 border border-blue-400/30 rounded-lg px-4 py-2 text-white placeholder-blue-200/40 focus:outline-none focus:border-blue-400/60" + placeholder="John Doe" />
+ {/* Email */}
- setFormData({ ...formData, email: e.target.value }) - } - className="w-full px-4 py-2 bg-blue-950/40 border border-blue-400/30 rounded text-blue-300 placeholder-blue-400/50" - placeholder="your@email.com" + onChange={handleInputChange} + required + className="w-full bg-blue-950/50 border border-blue-400/30 rounded-lg px-4 py-2 text-white placeholder-blue-200/40 focus:outline-none focus:border-blue-400/60" + placeholder="john@company.com" />
+ {/* Company */}
-