From 49859bbcfa380fb310c54528c9a800dbef4da9a9 Mon Sep 17 00:00:00 2001
From: tamfrr <tamfrr93@gmail.com>
Date: Sun, 24 Nov 2024 09:00:16 -0800
Subject: [PATCH] Enviar arquivos para "src/app/admin/cars/[id]"

---
 src/app/admin/cars/[id]/page.jsx | 139 +++++++++++++++++++++++++++++++
 1 file changed, 139 insertions(+)
 create mode 100644 src/app/admin/cars/[id]/page.jsx

diff --git a/src/app/admin/cars/[id]/page.jsx b/src/app/admin/cars/[id]/page.jsx
new file mode 100644
index 0000000..2721c05
--- /dev/null
+++ b/src/app/admin/cars/[id]/page.jsx
@@ -0,0 +1,139 @@
+import React from 'react';
+import { X } from 'lucide-react';
+
+const CarForm = () => {
+  return (
+    <div className="min-h-screen bg-gray-50">
+      <header className="bg-white shadow-sm">
+        <div className="max-w-7xl mx-auto px-4 py-4 flex justify-between items-center">
+          <div className="w-48 h-12 bg-gray-200 rounded flex items-center justify-center">
+            <span className="text-gray-500">LOGO</span>
+          </div>
+          <span className="font-semibold text-gray-700">Add/Edit Car</span>
+        </div>
+      </header>
+
+      <main className="max-w-3xl mx-auto px-4 py-8">
+        <form className="bg-white rounded-lg shadow p-6">
+          {/* Basic Information */}
+          <div className="mb-8">
+            <h2 className="text-lg font-semibold mb-4">Basic Information</h2>
+            <div className="space-y-4">
+              <div>
+                <label className="block text-sm font-medium text-gray-700 mb-1">
+                  Car Name
+                </label>
+                <input 
+                  type="text"
+                  className="w-full px-3 py-2 border border-gray-300 rounded-md"
+                  placeholder="e.g. BMW M4 2024"
+                />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-700 mb-1">
+                  Price
+                </label>
+                <input 
+                  type="number"
+                  className="w-full px-3 py-2 border border-gray-300 rounded-md"
+                  placeholder="Price in dollars"
+                />
+              </div>
+              <div>
+                <label className="flex items-center gap-2">
+                  <input type="checkbox" className="w-4 h-4" />
+                  <span className="text-sm font-medium text-gray-700">Mark as Special</span>
+                </label>
+              </div>
+            </div>
+          </div>
+
+          {/* Technical Specifications */}
+          <div className="mb-8">
+            <h2 className="text-lg font-semibold mb-4">Technical Specifications</h2>
+            <div className="grid md:grid-cols-2 gap-4">
+              <div>
+                <label className="block text-sm font-medium text-gray-700 mb-1">
+                  Engine Layout
+                </label>
+                <input 
+                  type="text"
+                  className="w-full px-3 py-2 border border-gray-300 rounded-md"
+                />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-700 mb-1">
+                  Engine Volume
+                </label>
+                <input 
+                  type="text"
+                  className="w-full px-3 py-2 border border-gray-300 rounded-md"
+                />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-700 mb-1">
+                  Horse Power
+                </label>
+                <input 
+                  type="text"
+                  className="w-full px-3 py-2 border border-gray-300 rounded-md"
+                />
+              </div>
+              <div>
+                <label className="block text-sm font-medium text-gray-700 mb-1">
+                  Transmission
+                </label>
+                <select className="w-full px-3 py-2 border border-gray-300 rounded-md">
+                  <option>Automatic</option>
+                  <option>Manual</option>
+                </select>
+              </div>
+            </div>
+          </div>
+
+          {/* Features/Extras */}
+          <div className="mb-8">
+            <h2 className="text-lg font-semibold mb-4">Features & Extras</h2>
+            <div className="space-y-2">
+              {['ABS', 'Bluetooth', 'ESP', 'LED Headlights'].map((feature) => (
+                <label key={feature} className="flex items-center gap-2">
+                  <input type="checkbox" className="w-4 h-4" />
+                  <span className="text-sm font-medium text-gray-700">{feature}</span>
+                </label>
+              ))}
+            </div>
+          </div>
+
+          {/* Images */}
+          <div className="mb-8">
+            <h2 className="text-lg font-semibold mb-4">Images</h2>
+            <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
+              {[1, 2, 3, 4].map((n) => (
+                <div key={n} className="relative">
+                  <div className="aspect-w-3 aspect-h-2 bg-gray-100 rounded-lg flex items-center justify-center">
+                    <span className="text-gray-400">+ Add Image</span>
+                  </div>
+                  <button className="absolute -top-2 -right-2 bg-red-500 text-white p-1 rounded-full">
+                    <X className="w-4 h-4" />
+                  </button>
+                </div>
+              ))}
+            </div>
+          </div>
+
+          {/* Submit Buttons */}
+          <div className="flex gap-4">
+            <button type="submit" className="bg-blue-500 text-white px-6 py-2 rounded-lg hover:bg-blue-600 transition-colors">
+              Save Car
+            </button>
+            <button type="button" className="bg-gray-100 text-gray-600 px-6 py-2 rounded-lg hover:bg-gray-200 transition-colors">
+              Cancel
+            </button>
+          </div>
+        </form>
+      </main>
+    </div>
+  );
+};
+
+export default CarForm;