import { get } from "lodash";
import React from "react";

export default function TopBanner({ hero }: { hero: any }) {
  return (
    <div
      className="top-banner-section"
      style={{
        backgroundImage: `url('${get(
          hero,
          ["image", "url"],
          "/Assets/home/top-banner.jpg"
        )}')`,
      }}
    >
      <div className="banner-text">
        <h1 className="big-text">
          {hero?.title || "Experience Pure Delight With Handcrafted Sweetness"}
        </h1>
        <hr />
        <p className="short-text">
          {hero?.description || "Bake your dream celebration with La Tarte"}
        </p>
      </div>
    </div>
  );
}