Working state: Serbian at root (/), English at /en, proper i18n structure

src/app/contact/page.tsx

@@ -0,0 +1,114 @@
+"use client";
+
+import { useState } from "react";
+import Header from "@/components/layout/Header";
+import Footer from "@/components/layout/Footer";
+
+export default function ContactPage() {
+  const [formData, setFormData] = useState({
+    name: "",
+    email: "",
+    message: "",
+  });
+  const [submitted, setSubmitted] = useState(false);
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    setSubmitted(true);
+  };
+
+  return (
+    <main className="min-h-screen pt-16 md:pt-20">
+      <Header />
+      
+      <section className="py-20 px-4">
+        <div className="max-w-2xl mx-auto">
+          <h1 className="text-4xl md:text-5xl font-serif text-center mb-8">
+            Contact Us
+          </h1>
+          
+          <p className="text-foreground-muted text-center mb-12">
+            Have questions? We'd love to hear from you.
+          </p>
+          
+          {submitted ? (
+            <div className="bg-green-50 text-green-700 p-6 text-center">
+              <p className="text-lg">Thank you for your message!</p>
+              <p className="mt-2">We'll get back to you soon.</p>
+            </div>
+          ) : (
+            <form onSubmit={handleSubmit} className="space-y-6">
+              <div>
+                <label htmlFor="name" className="block text-sm font-medium mb-2">
+                  Name
+                </label>
+                <input
+                  type="text"
+                  id="name"
+                  required
+                  value={formData.name}
+                  onChange={(e) => setFormData({ ...formData, name: e.target.value })}
+                  className="w-full px-4 py-3 border border-border focus:outline-none focus:border-foreground"
+                />
+              </div>
+              
+              <div>
+                <label htmlFor="email" className="block text-sm font-medium mb-2">
+                  Email
+                </label>
+                <input
+                  type="email"
+                  id="email"
+                  required
+                  value={formData.email}
+                  onChange={(e) => setFormData({ ...formData, email: e.target.value })}
+                  className="w-full px-4 py-3 border border-border focus:outline-none focus:border-foreground"
+                />
+              </div>
+              
+              <div>
+                <label htmlFor="message" className="block text-sm font-medium mb-2">
+                  Message
+                </label>
+                <textarea
+                  id="message"
+                  required
+                  rows={5}
+                  value={formData.message}
+                  onChange={(e) => setFormData({ ...formData, message: e.target.value })}
+                  className="w-full px-4 py-3 border border-border focus:outline-none focus:border-foreground resize-none"
+                />
+              </div>
+              
+              <button
+                type="submit"
+                className="w-full py-3 bg-foreground text-white hover:bg-accent-dark transition-colors"
+              >
+                Send Message
+              </button>
+            </form>
+          )}
+          
+          <div className="mt-16 pt-8 border-t border-border/30">
+            <div className="grid grid-cols-1 md:grid-cols-3 gap-8 text-center">
+              <div>
+                <h3 className="font-serif mb-2">Email</h3>
+                <p className="text-foreground-muted">hello@manoonoils.com</p>
+              </div>
+              <div>
+                <h3 className="font-serif mb-2">Shipping</h3>
+                <p className="text-foreground-muted">Free over 3000 RSD</p>
+              </div>
+              <div>
+                <h3 className="font-serif mb-2">Location</h3>
+                <p className="text-foreground-muted">Serbia</p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </section>
+      
+      <Footer />
+    </main>
+  );
+}