GetInTouchForm.js 3.91 KB
import React from "react";
import { Col, Row } from "react-bootstrap";
import Heading from "@/components/Heading";
const GetInTouchForm = () => {
  return (
    <>
      <div className="get-in-touch-sec">
        <Row>
          <Col>
            <Heading el="h2" heading="Get in touch" />
          </Col>
        </Row>
        <form action="" className="get-in-touch-form">
          <Row>
            <Col md={12} className="mb-3">
              <div>
                <select className="form-select" id="requestType">
                  <option value="">Select Request Type</option>
                  <option value="general">General Inquiry</option>
                  <option value="support">Support</option>
                  <option value="quotation">Request Quotation</option>
                  <option value="complaint">Complaint</option>
                </select>
              </div>
            </Col>
            <Col md={12} className="mb-3">
              <div>
                <input
                  type="text"
                  placeholder="Full Name"
                  name="Full Name"
                  className="inputField nameInput"
                />
              </div>
            </Col>
          </Row>
          <Row>
            <Col md={12} className="mb-3">
              <div>
                <input
                  type="text"
                  placeholder="Mobile Number"
                  name="Mobile Number"
                  className="inputField nameInput"
                />
              </div>
            </Col>
             <Col md={12} className="mb-3">
              <div>
                <input
                  type="text"
                  placeholder="Email Address"
                  name="Email Address"
                  className="inputField nameInput"
                />
              </div>
            </Col>
          </Row>
          
          <Row>
            <Col md={12} className="mb-3">
              <div>
                 <select className="form-select" id="requestType">
                  <option value="">City</option>
                  <option value="mumbai">Mumbai</option>
                  <option value="pune">Pune</option>
                  <option value="delhi">Delhi</option>
                </select>
               
              </div>
            </Col>
             <Col md={12} className="mb-3">
              <div>
                <select className="form-select" id="requestType">
                  <option value="">Country</option>
                  <option value="India">India</option>
                  <option value="Dubai">Dubai</option>
                  <option value="Singapore">Singapore</option>
                </select>
               
              </div>
            </Col>
          </Row>
        
          <Row>
            <Col md={12} className="mb-3">
              <div>
                <textarea  rows="4"
                  type="text"
                  placeholder="Message*"
                  name="Message"
                  className="inputField nameInput"
                />
              </div>
            </Col>
          </Row>
          <Row>
            <Col className="mb-3">
                <div className="form-check">
              <input
                className="form-check-input"
                type="checkbox"
                value=""
                id="checkChecked"
              />
              <label className="form-check-label" for="checkChecked">
                By Continuing, I Declare that i have read the privacy policy of akurti luxe. 
              </label>
            </div>
            </Col>
          </Row>
           <Row>
            <Col className="mb-3">
                <div className="d-flex gap-3">
                    <button className="btn2">Submit <i className="fa-solid fa-arrow-right"></i></button>
                </div>
            </Col>
            </Row>
        </form>
      </div>
    </>
  );
};

export default GetInTouchForm;