39 lines
1.5 KiB
TypeScript
39 lines
1.5 KiB
TypeScript
import React from "react";
|
|
|
|
interface HeroSecondProps {
|
|
title: string;
|
|
}
|
|
|
|
export default function HeroSecond({ title }: HeroSecondProps) {
|
|
return (
|
|
<>
|
|
<div className="container max-w-5xl">
|
|
<div className="flex justify-center items-center relative overflow-hidden mx-auto">
|
|
{/* Background Image */}
|
|
<img
|
|
src="/assets/hero-second.jpg"
|
|
alt="Hero Section"
|
|
className="w-full object-cover rounded-lg md:rounded-3xl"
|
|
/>
|
|
|
|
{/* Overlay Content */}
|
|
<div className="absolute inset-0 flex flex-col items-center justify-center md:flex-row md:items-center md:justify-between md:p-8">
|
|
<div className="hidden md:flex md:w-1/3 md:justify-center">
|
|
<img
|
|
src="/assets/dlh-logo.svg"
|
|
alt=""
|
|
className="md:max-w-[170px] ml-28"
|
|
/>
|
|
</div>
|
|
<div className="md:w-1/2 md:flex md:justify-center">
|
|
<h1 className="text-2xl md:text-5xl font-bold text-[#43b311] text-center">
|
|
{title}
|
|
</h1>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|