Create a dedicated "Book Now" page for my appliance repair website.
When a visitor clicks the "Book Now" button, they should be redirected to a booking page with a professional and modern design that matches the rest of the website.
The page should contain a booking form with the following required fields:
- First Name
- Last Name
- Email Address
- Phone Number
- Description (describe the appliance issue)
Add a "Book Appointment" submit button.
Form Functionality
When the customer submits the form:
- Validate that all required fields are completed.
- Validate the email format.
- Display a loading indicator while the form is being submitted.
- Send the form details via email to ns.appliance.93@gmail.com.
- The email subject should be:
New Appliance Repair Booking Request - The email body should include:
New Booking Request
First Name:
Last Name:
Email:
Phone Number:
Description:
- After the email is successfully sent, display the following confirmation message:
Thank you! Your booking request has been sent successfully. We will contact you shortly to confirm your appointment.
If the email cannot be sent, display:
Sorry, something went wrong. Please try again later or call us directly.
Design Requirements
- Responsive on desktop, tablet, and mobile.
- Clean, modern layout consistent with the rest of the website.
- Rounded input fields with clear labels.
- Use the website's existing colors, fonts, and branding.
- Prevent duplicate submissions by disabling the submit button while the email is being sent.
Important: Do not use mailto: to open the visitor's email application. The form must send the email automatically on the server (or through an email service such as EmailJS, Resend, Nodemailer, or SendGrid) without requiring the customer to have an email client installed.