Add src/components/sections/contact/ContactTwo.tsx

src/components/sections/contact/ContactTwo.tsx

@@ -0,0 +1,85 @@
+import React from 'react';
+import { Mail, Phone, MapPin } from 'lucide-react';
+
+const ContactTwo = () => {
+  return (
+    <section className="py-20 bg-gray-50 dark:bg-gray-800">
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div className="text-center mb-16">
+          <h2 className="text-4xl font-bold text-gray-900 dark:text-white mb-4">
+            Get in Touch
+          </h2>
+          <p className="text-xl text-gray-600 dark:text-gray-300 max-w-2xl mx-auto">
+            Ready to start your project? Contact us today.
+          </p>
+        </div>
+        <div className="grid lg:grid-cols-2 gap-12">
+          <div>
+            <div className="space-y-8">
+              <div className="flex items-center">
+                <Mail className="w-6 h-6 text-blue-600 mr-4" />
+                <div>
+                  <h3 className="text-lg font-semibold text-gray-900 dark:text-white">Email</h3>
+                  <p className="text-gray-600 dark:text-gray-300">hello@example.com</p>
+                </div>
+              </div>
+              <div className="flex items-center">
+                <Phone className="w-6 h-6 text-blue-600 mr-4" />
+                <div>
+                  <h3 className="text-lg font-semibold text-gray-900 dark:text-white">Phone</h3>
+                  <p className="text-gray-600 dark:text-gray-300">+1 (555) 123-4567</p>
+                </div>
+              </div>
+              <div className="flex items-center">
+                <MapPin className="w-6 h-6 text-blue-600 mr-4" />
+                <div>
+                  <h3 className="text-lg font-semibold text-gray-900 dark:text-white">Address</h3>
+                  <p className="text-gray-600 dark:text-gray-300">123 Main St, City, State 12345</p>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div className="bg-white dark:bg-gray-900 p-8 rounded-xl">
+            <form className="space-y-6">
+              <div>
+                <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+                  Name
+                </label>
+                <input 
+                  type="text" 
+                  className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-800 text-gray-900 dark:text-white"
+                />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+                  Email
+                </label>
+                <input 
+                  type="email" 
+                  className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-800 text-gray-900 dark:text-white"
+                />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+                  Message
+                </label>
+                <textarea 
+                  rows={4}
+                  className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-800 text-gray-900 dark:text-white"
+                ></textarea>
+              </div>
+              <button 
+                type="submit"
+                className="w-full bg-blue-600 text-white py-3 px-6 rounded-lg hover:bg-blue-700 transition-colors"
+              >
+                Send Message
+              </button>
+            </form>
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default ContactTwo;