38 lines
1.6 KiB
TypeScript
38 lines
1.6 KiB
TypeScript
import Image from 'next/image'
|
||
import Wrap from '@/components/wrap'
|
||
import FreeTrial from '@/components/free-trial'
|
||
import banner from '../_assets/banner.webp'
|
||
import check_main from '@/assets/check-main.svg'
|
||
|
||
export function HeroSection() {
|
||
return (
|
||
<section className="w-full relative">
|
||
<Image src={banner} alt="banner" className="absolute inset-0 h-full object-cover"/>
|
||
<Wrap className="relative pt-64 pb-48 max-md:pt-32 max-md:pb-24">
|
||
<h1 className="text-4xl">安全，稳定，快速，合规的代理服务器</h1>
|
||
<p className="mt-10 text-gray-500">遍布全国的代理服务器节点为用户提供智能可靠的IP代理服务</p>
|
||
|
||
<div className="mt-24 max-md:mt-14 flex gap-8 max-md:flex-col">
|
||
<p className="flex gap-4 items-center">
|
||
<Image src={check_main} alt="checkbox" width={24} height={24}/>
|
||
<span className="lg:text-lg">全国200+城市节点</span>
|
||
</p>
|
||
<p className="flex gap-4 items-center">
|
||
<Image src={check_main} alt="checkbox" width={24} height={24}/>
|
||
<span className="lg:text-lg">300+城市级精准定位</span>
|
||
</p>
|
||
<p className="flex gap-4 items-center">
|
||
<Image src={check_main} alt="checkbox" width={24} height={24}/>
|
||
<span className="lg:text-lg">低延迟&高并发提取</span>
|
||
</p>
|
||
</div>
|
||
|
||
<FreeTrial className={[
|
||
`mt-32 max-md:mt-20 w-96 max-md:w-full h-16 md:h-24 rounded-lg shadow-lg cursor-pointer`,
|
||
`bg-linear-to-r from-blue-500 to-cyan-400 text-white text-xl lg:text-4xl`,
|
||
].join(' ')}/>
|
||
</Wrap>
|
||
</section>
|
||
)
|
||
}
|