amnannn/rekan_ai
1
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Last

Browse Source
This commit is contained in:
Yogamnan
2025-02-08 20:46:52 +07:00
parent 940448f28b
commit 4f07bdf08b
30 changed files with 535 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/beranda/Header.jsx
View File

@@ -70,7 +70,7 @@ const Header = () => {
onClick={() => setIsSolusiOpen(!isSolusiOpen)}
className="text-[#212121] text-base transition-colors hover:text-[#5a55ff] flex items-center"
>
Produk
Solusi
<svg
stroke="currentColor"
fill="currentColor"

80
src/components/beranda/Hero.jsx
View File

@@ -1,49 +1,41 @@
import {homeLogo,waIcon,homeImg} from '../../assets';
import { homeLogo, waIcon, homeImg } from '../../assets';
function Hero() {
return (
<div className="w-full overflow-hidden" id="Home">
<div className="container mx-auto px-4 lg:px-6">
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-12 items-center py-12 lg:py-16">
{/* Left Section */}
<div className="space-y-6 md:-mt-10 mt-10">
<img src={homeLogo} alt="Rekan AI Logo" className="h-12 w-auto" />
<h1 className="text-[24px] lg:text-[30px] font-semibold text-customBlack leading-tight">
Ciptakan Pengalaman Pelanggan yang Tak Terlupakan dengan Solusi AI dari Rekan AI.
</h1>
<p className="text-[16px] lg:text-[18px] lg:max-w-[90%] text-customBlack">
Rekan AI menghadirkan teknologi kecerdasan buatan untuk membantu bisnis Anda beradaptasi dan tumbuh di era
digital. Dari automasi hingga analisis data, kami membawa solusi cerdas yang mudah diimplementasikan.
</p>
{/* Buttons - Moved inside left column for better mobile layout */}
<div className="flex flex-col sm:flex-row gap-4 pt-4">
<button className="flex items-center justify-center px-6 py-3 border-2 md:w-[245px] md:h-[55px] border-customRed rounded-[14px] text-customRed border-customRed font-medium text-base lg:text-lg hover:bg-pink-50 transition-colors">
<img src={waIcon} alt="WhatsApp Icon" className="mr-2 h-7 w-7" />
Konsultasi Gratis
</button>
<button className="flex items-center justify-center px-6 py-3 rounded-[14px] md:w-[245px] md:h-[55px] bg-gradient-to-r from-[#DC0168] to-[#5B59E8] text-white font-medium text-base lg:text-lg hover:opacity-90 transition-opacity">
Coba Sekarang
</button>
</div>
</div>
{/* Right Section */}
<div className="relative">
<div className="relative w-full aspect-square lg:aspect-auto lg:h-[600px]">
<img
src={homeImg}
alt="Rekan AI Illustration"
className="object-contain"
/>
</div>
</div>
return (
<div className="w-full overflow-hidden" id="Home">
<div className="container mx-auto px-4 lg:px-6">
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-12 items-center py-12 lg:py-16">
{/* Left Section */}
<div className="space-y-6 md:-mt-32 mt-10 text-center lg:text-left order-1 lg:order-none">
<img src={homeLogo} alt="Rekan AI Logo" className="h-12 w-auto lg:mx-0" />
<h1 className="text-[24px] lg:text-[30px] font-semibold text-customBlack leading-tight">
Ciptakan Pengalaman Pelanggan yang Tak Terlupakan dengan Solusi AI dari Rekan AI.
</h1>
<p className="text-[16px] lg:text-[18px] lg:max-w-[90%] text-customBlack">
Rekan AI menghadirkan teknologi kecerdasan buatan untuk membantu bisnis Anda beradaptasi dan tumbuh di era
digital. Dari automasi hingga analisis data, kami membawa solusi cerdas yang mudah diimplementasikan.
</p>
</div>
{/* Right Section - Adjust order for mobile */}
<div className="relative w-full aspect-square lg:aspect-auto lg:h-[600px] order-2 lg:order-none">
<img src={homeImg} alt="Rekan AI Illustration" className="object-contain" />
</div>
{/* Buttons - Ensure they come last on mobile */}
<div className="flex flex-col sm:flex-row gap-4 md:-mt-96 order-3 lg:order-none">
<button className="flex items-center justify-center px-6 py-3 border-2 md:w-[245px] md:h-[55px] border-customRed rounded-[14px] text-customRed font-medium text-base lg:text-lg hover:bg-pink-50 transition-colors">
<img src={waIcon} alt="WhatsApp Icon" className="mr-2 h-7 w-7" />
Konsultasi Gratis
</button>
<button className="flex items-center justify-center px-6 py-3 rounded-[14px] md:w-[245px] md:h-[55px] bg-gradient-to-r from-[#DC0168] to-[#5B59E8] text-white font-medium text-base lg:text-lg hover:opacity-90 transition-opacity">
Coba Sekarang
</button>
</div>
</div>
</div>
)
}
export default Hero
</div>
);
}
export default Hero;