"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">Wilds Community by Aldar</h2>
                <p>
                  The Wilds Community by Aldar 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">Wilds Community by Aldar</h2>
            <p>
              Experience world-class attractions at Wilds Community by Aldar,
              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>
    </>
  );
}
