import * as React from "react"
import cls from "classnames"

type IPros = React.PropsWithChildren<{
  url?: string
  className?: string
  id?: string
}>
const DetailBackground: React.FC<IPros> = ({
  url,
  children,
  className,
  id = "",
}) => {
  return (
    <div
      className={cls(className ?? "")}
      style={{
        background: url
          ? `linear-gradient(0deg, rgba(36, 43, 72, 0.6), rgba(36, 43, 72, 0.6)), url(${url}), center`
          : "linear-gradient(180deg, #242b48 0%, #54547a 100%)",
        backgroundRepeat: "no-repeat",
        backgroundSize: "cover",
      }}
      id={id}
    >
      {children}
    </div>
  )
}
export default DetailBackground
