CallBackRequest.js 3.67 KB
import Image from "next/image";
import React from "react";
import { Col, Container, Row } from "react-bootstrap";
import Heading from "./Heading";
import { motion } from "framer-motion";
import { slideFromLeft } from "./variants";

const CallBackRequest = () => {
  return (
    <>
      <div className="free-quote-area ptb-100">
        <Container>
          <Row className="align-items-center">
            <Col lg={6} md={12}>
              <div className="free-quote-image">
                <motion.div
                  variants={slideFromLeft(0.5)}
                  initial={"hidden"}
                  whileInView={"show"}
                  viewport={{ once: false, amount: 0.4 }}
                >
                  <Image
                    src="/images/home/free-quote.jpg"
                    layout="fill"
                    className="img-fluid image"
                    alt="image"
                  />
                </motion.div>
              </div>
            </Col>

            <Col lg={6} md={12}>
              <div className="free-quote-text">
                <span className="sub-title">
                  Have a quick question or need more information? Fill out the
                  form below, and we'll get back to you as soon as possible
                </span>
                <Heading el="h2" heading="Write to Us!" />
                <p>
                  Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed
                  diam nonumy ant extra eirmod te mpor invidunt ut labore et
                  dolore magna aliquyam erat. Te mpor invidunt utttfg labore et
                  dolore magna aliquyam erat
                </p>
                <form>
                  <Row>
                    <Col lg={6} md={6}>
                      <div className="form-group">
                        <label>Your Name</label>
                        <input type="text" className="form-control" />
                      </div>
                    </Col>

                    <Col lg={6} md={6}>
                      <div className="form-group">
                        <label>Your Email</label>
                        <input type="text" className="form-control" />
                      </div>
                    </Col>

                    <Col lg={6} md={6}>
                      <div className="form-group">
                        <label>Phone Number</label>
                        <input type="text" className="form-control" />
                      </div>
                    </Col>

                    <Col lg={6} md={6}>
                      <div className="form-group">
                        <label>Services</label>
                        <select className="form-select">
                          <option value="selected">
                            Financial Consultancy
                          </option>
                          <option>Virtual FC & CFO Services</option>
                          <option>Transaction Advisory</option>
                          <option>Risk Advisory</option>
                          <option>Business Advisory</option>
                        </select>
                      </div>
                    </Col>

                    <Col lg={6} md={6}>
                      <div className="form-group">
                        <button type="submit" className="default-btn">
                          Consultation
                          <i className="ri-arrow-right-line"></i>
                        </button>
                      </div>
                    </Col>
                  </Row>
                </form>
              </div>
            </Col>
          </Row>
        </Container>
      </div>
    </>
  );
};

export default CallBackRequest;