"use client";
import { useModal } from "@/context/ModalContext";
export default function About() {
  const { toggleModal } = useModal();
  return (
    <>
      <section>
        <div className="container-fluid">
          <div className="row">
            <div className="col-lg-4 col-md-4">
              <img
                src="/images/emaar.jpg"
                className="cover w-100"
                style={{ height: "270px" }}
              />
            </div>
            <div className="col-lg-4 col-md-4 my-3">
              <div>
                <h2 className="mb-2">Palm Jebel Ali</h2>
                <p>
                  The Palm Jebel Ali community, developed by Nakheel, is highly
                  regarded and coveted by both locals and residents. Its
                  popularity is attributed to its prime location, exceptional
                  features, and top-tier amenities.
                </p>
                <div className="mt-3">
                  <a onClick={() => toggleModal("Enquire Now!")}>
                    <button className="webbutton">Enquire Now!</button>
                  </a>
                </div>
              </div>
            </div>
            <div className="col-lg-4 col-md-4">
              <img
                className="cover w-100"
                src="/images/greenview.jpg"
                style={{ height: "270px" }}
              />
            </div>
          </div>
        </div>
        <div className="container mt-5">
          <div className="text-center">
            <h2 className="mb-2">Palm Jebel ali</h2>
            <p>
              Experience world-class attractions at Palm Jebel Ali, including a
              championship golf course, marina, theme park, and shopping mall,
              along with elite schools and hospitals. It’s the perfect place to
              live, work, and raise a family.
            </p>
            <div className="mt-3">
              <a onClick={() => toggleModal("Enquire Now!")}>
                <button className="webbutton">Enquire Now!</button>
              </a>
            </div>
          </div>
        </div>
      </section>
    </>
  );
}
