import ImageLoader from '@/lib/utils/ImageLoader'
import { Media } from '@/payload-types'

export const HeroImgOnly = ({ bg }: { bg: Media }) => {
  return (
    <section className="w-full h-[400px] md:h-[460px] relative">
      <ImageLoader media={bg} alt="bg" className="object-cover w-full h-full " />
      <div className="absolute h-full w-full bottom-0 bg-[#00000066]" />
      <div
        className="absolute h-[304px] w-full bottom-0 
        bg-[linear-gradient(180deg,rgba(0,0,0,0)_0%,#000_100%)]"
      />
    </section>
  )
}

export default HeroImgOnly
