www/app/contact/page.jsx

import ContactForm from "@/components/contact-form";

export const metadata = {
    title: "Contact Us",
    description: "Need our help? Get in touch!",
};

const ContactPage = () => {
    return (
        <>
            <header className="bg-white shadow">
                <div className="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
                    <h1 className="text-3xl font-bold text-gray-900">Contact Us</h1>
                </div>
            </header>
            <div className="bg-gray-100 mx-auto text-gray-900 px-4 pt-8">
                <div className="grid grid-cols-1 gap-8 max-w-3xl mx-auto">
                    <div className="text-gray-900">
                        <h2 className="text-xl font-semibold mb-4">Get in Touch</h2>
                        <p className="mb-4">We would love to hear from you. Please fill out the form below or use our contact information.</p>

                        <h3 className="text-lg font-semibold mb-2">Contact Information</h3>
                        <p>Email: sales@techaro.lol</p>
                    </div>

                    <div className="pb-4">
                        <h2 className="text-xl font-semibold mb-4">Contact Form</h2>
                        <noscript className="my-2">Enable JavaScript to use the contact form. It's 2024. Give up.</noscript>
                        <ContactForm />
                    </div>
                </div>
            </div>
        </>
    );
};

export default ContactPage;