|
发表于 2024-9-28 18:42:44
|
显示全部楼层
import { Input } from "/components/ui/input"
import { Label } from "/components/ui/label"
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "/components/ui/select"
import { Textarea } from "/components/ui/textarea"
export default function BookAppointment() {
return (
<div className="min-h-screen bg-white">
<header className="bg-white shadow-sm">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 flex items-center justify-between">
<nav className="flex space-x-8">
<a href="#logo" className="text-gray-700 hover:text-gray-900">Logo</a>
<a href="#home" className="text-gray-700 hover:text-gray-900">Home</a>
<a href="#about" className="text-gray-700 hover:text-gray-900">About</a>
<a href="#contact" className="text-gray-700 hover:text-gray-900">Contact</a>
<a href="#login" className="text-gray-700 hover:text-gray-900">Login</a>
</nav>
</div>
</header>
<main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
<div className="text-center mb-12">
<h1 className="text-4xl font-bold mb-4">Book an appointment</h1>
<p className="text-lg text-gray-600">We'll respond in 3-5 business days</p>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-12">
<div className="md:col-span-2">
<form>
<div className="mb-6">
<Label htmlFor="name">Name:</Label>
<Input id="name" type="text" placeholder="Enter your name" />
</div>
<div className="mb-6">
<Label htmlFor="address">Address:</Label>
<Input id="address" type="text" placeholder="Enter your address" />
</div>
<div className="mb-6">
<Label htmlFor="phone">Phone:</Label>
<Input id="phone" type="tel" placeholder="Enter your phone number" />
</div>
<div className="mb-6">
<Label htmlFor="date">Date:</Label>
<Input id="date" type="date" />
</div>
<div className="mb-6">
<Label htmlFor="comments">Comments:</Label>
<Textarea id="comments" placeholder="Enter your comments" />
</div>
<Button className="rounded-full px-8 py-3 bg-black text-white hover:bg-gray-800">Submit</Button>
</form>
</div>
</div>
</main>
</div>
)
} |
|