allbest/rekan_ai_fe
1
0
Fork 0
forked from amnannn/rekan_ai
Code Pull Requests Activity

add produk

Browse Source
This commit is contained in:
Yogamnan 2025-02-14 16:40:23 +07:00
parent 8cb7eeadc1
commit 3148ff7a2e
24 changed files with 201 additions and 125 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
package-lock.json generated
View File

@ -10,6 +10,7 @@
"dependencies": {
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-google-recaptcha": "^3.1.0",
"react-router-dom": "^7.1.3"
},
"devDependencies": {
@ -3182,6 +3183,15 @@
"node": ">= 0.4"
}
},
"node_modules/hoist-non-react-statics": {
"version": "3.3.2",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
"integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
"license": "BSD-3-Clause",
"dependencies": {
"react-is": "^16.7.0"
}
},
"node_modules/ignore": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
@ -3996,7 +4006,6 @@
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
"dev": true,
"license": "MIT",
"engines": {
"node": ">=0.10.0"
@ -4483,7 +4492,6 @@
"version": "15.8.1",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
"dev": true,
"license": "MIT",
"dependencies": {
"loose-envify": "^1.4.0",
@ -4534,6 +4542,19 @@
"node": ">=0.10.0"
}
},
"node_modules/react-async-script": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/react-async-script/-/react-async-script-1.2.0.tgz",
"integrity": "sha512-bCpkbm9JiAuMGhkqoAiC0lLkb40DJ0HOEJIku+9JDjxX3Rcs+ztEOG13wbrOskt3n2DTrjshhaQ/iay+SnGg5Q==",
"license": "MIT",
"dependencies": {
"hoist-non-react-statics": "^3.3.0",
"prop-types": "^15.5.0"
},
"peerDependencies": {
"react": ">=16.4.1"
}
},
"node_modules/react-dom": {
"version": "18.3.1",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
@ -4547,11 +4568,23 @@
"react": "^18.3.1"
}
},
"node_modules/react-google-recaptcha": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/react-google-recaptcha/-/react-google-recaptcha-3.1.0.tgz",
"integrity": "sha512-cYW2/DWas8nEKZGD7SCu9BSuVz8iOcOLHChHyi7upUuVhkpkhYG/6N3KDiTQ3XAiZ2UAZkfvYKMfAHOzBOcGEg==",
"license": "MIT",
"dependencies": {
"prop-types": "^15.5.0",
"react-async-script": "^1.2.0"
},
"peerDependencies": {
"react": ">=16.4.1"
}
},
"node_modules/react-is": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
"dev": true,
"license": "MIT"
},
"node_modules/react-refresh": {

1
package.json
View File

@ -12,6 +12,7 @@
"dependencies": {
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-google-recaptcha": "^3.1.0",
"react-router-dom": "^7.1.3"
},
"devDependencies": {

9
src/components/beranda/Banner.jsx
View File

@ -1,9 +1,7 @@
import { waIcon2, L1, L2, L3, L4, R1, R2, R3, R4, bgcBanner } from "../../assets/"
import { useNavigate } from "react-router-dom"
import { Link } from "react-router-dom"
function Banner() {
const navigate = useNavigate();
return (
<div className="relative w-full overflow-hidden">
<div
@ -44,12 +42,13 @@ function Banner() {
/>
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button
onClick={() => navigate("/FormSection")}
className="flex items-center justify-center w-full md:w-[270px] h-[50px] md:h-[65px] rounded-2xl px-4 md:px-8 py-2 md:py-3 border-[1px] border-white bg-gradient-to-r from-[#dc0168] to-[#5b59e8] text-white text-sm md:text-lg font-bold hover:opacity-90">
Coba Sekarang
</button>
</Link>
</div>
</div>

9
src/components/beranda/Footer.jsx
View File

@ -1,4 +1,4 @@
import { useNavigate } from "react-router-dom"
import { useNavigate, Link } from "react-router-dom"
import {
nvidia,
@ -38,7 +38,6 @@ function Footer() {
</p>
</div>
<p className="mb-4 text-[18px]">Lebih dekat dengan Kami</p>
<div className="flex space-x-3">
{/* Tautan ke media sosial */}
<a href="#">
@ -118,14 +117,12 @@ function Footer() {
</button>
</li>
<li>
<Link to={"/Contact#faq"}>
<button
onClick={() => {
navigate("/FormSection");
window.scrollTo({ top: 0, behavior: "smooth" });
}}
className="block w-full text-left">
F.A.Q
</button>
</Link>
</li>
</ul>
</div>

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

@ -72,7 +72,7 @@ const Header = () => {
</button>
{isProdukOpen && (
<div className="absolute left-[525px] -translate-x-1/2 top-full md:top-11 mt-2 w-[5000px]">
<div className="absolute left-[500px] -translate-x-1/2 top-full md:top-11 mt-2 w-[5000px]">
<div className="bg-customRed bg-opacity-80 rounded-xl p-8">
<div className="flex justify-center gap-8">
{/* HR */}
@ -104,7 +104,7 @@ const Header = () => {
<div className="text-left">
<h3 className="font-medium text-base py-1">Rekan Doku</h3>
<p className="text-xs text-customBlack">
Kelola dokumen digital
Kelola dokumen <br /> digital
</p>
</div>
</button>
@ -120,7 +120,7 @@ const Header = () => {
<img src={ProdukLlm} alt="" className="w-16 h-16" />
<div className="text-left">
<h3 className="font-medium text-base py-1">Rekan LLM</h3>
<p className="text-xs text-customBlack">Solusi analisis berbasis data</p>
<p className="text-xs text-customBlack">Solusi analisis berbasis <br /> data</p>
</div>
</button>
{/* VERI */}
@ -134,7 +134,7 @@ const Header = () => {
<img src={ProdukVeri} alt="" className="w-16 h-16" />
<div className="text-left">
<h3 className="font-medium text-base py-1">Rekan Veri</h3>
<p className="text-xs text-customBlack">Verifikasi data secara akurat</p>
<p className="text-xs text-customBlack">Verifikasi data secara <br /> akurat</p>
</div>
</button>
</div>

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

@ -1,5 +1,5 @@
import { homeLogo, waIcon, homeImg } from '../../assets';
import { useNavigate } from "react-router-dom"
import { useNavigate, Link } from "react-router-dom"
function Hero() {
const navigate = useNavigate();
@ -30,11 +30,13 @@ function Hero() {
<img src={waIcon} alt="WhatsApp Icon" className="mr-2 h-7 w-7" />
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button
onClick={() => navigate("/FormSection")}
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>
</Link>
</div>
</div>
</div>

7
src/components/beranda/Kenapa.jsx
View File

@ -1,9 +1,7 @@
import { imgLeft, chek2, waIcon, circle1, circle2 } from '../../assets'
import { useNavigate } from "react-router-dom"
import { Link } from "react-router-dom"
function Kenapa() {
const navigate = useNavigate();
return (
<div className="flex justify-center items-center bg-customWhite mt-5 min-h-screen">
<div className="flex flex-col md:flex-row bg-customWhite rounded-lg overflow-hidden relative pt-16 md:pt-52">
@ -55,11 +53,12 @@ function Kenapa() {
<img src={waIcon} alt="WhatsApp Icon" className="mr-2 w-4 h-4 md:w-[30px] md:h-[30px]" />
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button
onClick={() => navigate("/FormSection")}
className="w-full md:w-[276px] h-[50px] md:h-[70px] bg-gradient-to-r from-pink-700 to-indigo-600 text-white md:text-xl font-medium rounded-[14px] hover:opacity-90 transition">
Coba Sekarang
</button>
</Link>
</div>
</div>
</div>

8
src/components/beranda/MasaDepan.jsx
View File

@ -1,11 +1,9 @@
import React from "react";
import { waIcon } from "../../assets";
import { useNavigate } from "react-router-dom"
import { Link } from "react-router-dom"
function MasaDepan() {
const navigate = useNavigate();
return (
<>
<div className="flex flex-col items-center justify-center text-center w-full h-[65vh] -mt-3">
@ -33,12 +31,12 @@ function MasaDepan() {
<img src={waIcon} alt="WhatsApp Icon" className="mr-4 w-5 h-5 md:w-[30px] md:h-[30px]" />
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button
onClick={() => navigate("/FormSection")}
className="w-full lg:w-[276px] h-[70px] btn2 flex items-center justify-center py-3 px-8 rounded-[14px] bg-gradient-to-r from-[#DC0168] to-[#5B59E8] text-white font-medium text-[18px] lg:text-[20px] cursor-pointer transition-all ease-in-out hover:opacity-90">
Coba Sekarang
</button>
</Link>
</div>
</>

15
src/components/contact/FAQSection.jsx
View File

@ -1,6 +1,17 @@
import { useState } from "react";
import { useState, useEffect } from "react";
import { useLocation } from "react-router-dom";
const FAQ = () => {
const location = useLocation();
useEffect(() => {
if (location.hash) {
const element = document.querySelector(location.hash);
if (element) {
element.scrollIntoView({ behavior: "smooth" });
}
}
}, [location]);
// State untuk menyimpan indeks pertanyaan yang sedang dibuka
// Jika tidak ada pertanyaan yang terbuka, nilai adalah null
const [openQuestion, setOpenQuestion] = useState(null);
@ -111,7 +122,7 @@ const FAQ = () => {
];
return (
<div className="text-[#212121] max-w-4xl mx-auto px-4 py-6 text-center ">
<div className="text-[#212121] max-w-4xl mx-auto px-4 py-6 text-center " id="faq">
{/* Judul halaman FAQ */}
<div className="mt-[111px]">
<h1 className="text-[32px] font-[505] leading-[48px] tracking-[0.005em] text-center mb-4">

67
src/components/contact/FormSection.jsx
View File

@ -1,9 +1,27 @@
import { img10 } from "./asset";
import { img10 } from "./asset"; // Pastikan img10 ada dan benar path-nya
import ReCAPTCHA from "react-google-recaptcha"; // Pastikan penulisan benar (ReCAPTCHA)
import useRecaptcha from './Recaptcha/useRecaptcha';
import { useLocation } from "react-router-dom";
import { useEffect } from "react";
const ContactForm = () => {
const { capchaToken, handleRecaptcha } = useRecaptcha();
const location = useLocation();
useEffect(() => {
if (location.hash) {
const element = document.querySelector(location.hash);
if (element) {
element.scrollIntoView({ behavior: "smooth" });
}
}
}, [location]);
return (
<div
className="flex min-h-screen items-center justify-center p-5 text-white rounded-tl-[80px] rounded-tr-[80px]"
id="form"
style={{
background: `linear-gradient(45deg, #DC016866 15%, rgba(91, 89, 232, 1), rgba(91, 89, 232, 1)), url(${img10})`,
backgroundSize: "cover",
@ -14,38 +32,24 @@ const ContactForm = () => {
<div className="flex flex-col lg:flex-row items-start w-full 2xl:max-w-[100%] 2xl:max-h-[100%] sm:mt-[79px] sm:mb-[79px] 2xl:mt-[-125px] 2xl:px-10">
{/* Bagian Kiri */}
<div className="flex-1 p-5 mb-10 lg:mb-0 md:ml-28 2xl:mt-28 md:max-w-[40%]">
{/* Judul utama */}
<h2 className="text-[32px] font-[550] leading-[48px] tracking-[0.005em] text-left mt-16 mb-[39px] 2xl:text-[36px] 2xl:leading-[52px]">
Isi formulir di samping ini dan kami akan menghubungi Anda secepat
mungkin
Isi formulir di samping ini dan kami akan menghubungi Anda secepat mungkin
</h2>
{/* Deskripsi tambahan */}
<p className="text-[18px] font-[400] leading-[30px] tracking-[0.005em] text-left mb-6 2xl:text-[20px] 2xl:leading-[34px]">
Kami percaya bahwa kolaborasi adalah kunci kesuksesan. Hubungi kami
hari ini, dan mari wujudkan masa depan bisnis Anda bersama Rekan AI!
Kami percaya bahwa kolaborasi adalah kunci kesuksesan. Hubungi kami hari ini, dan mari wujudkan masa depan bisnis Anda bersama Rekan AI!
</p>
</div>
{/* Bagian Form */}
<div
className="bg-white text-[#212121] mt-5 rounded-[25px] md:ml-24 md:mt-52 p-[40px] border-[8px] border-[#F086A4] md:w-[794px] 2xl:px-[60px] 2xl:py-[50px]"
>
{/* Judul form */}
<div className="bg-white text-[#212121] mt-5 rounded-[25px] md:ml-24 md:mt-52 p-[40px] border-[8px] border-[#F086A4] md:w-[794px] 2xl:px-[60px] 2xl:py-[50px]">
<h3 className="text-[32px] font-[550] mb-4 text-[#212121] 2xl:text-[28px] 2xl:mb-6">
Hubungi Tim Terbaik Kami
</h3>
{/* Deskripsi form */}
<p className="mb-6 text-[#212121] 2xl:text-[18px]">
Silakan isi data diri Anda pada formulir di bawah ini
</p>
{/* Formulir input */}
<form className="flex flex-col gap-4 px-2">
{/* Input Nama */}
<div>
<label className="text-[#6B5CEA]">Nama (Tanpa Gelar)*</label>
<input
@ -55,8 +59,6 @@ const ContactForm = () => {
className="w-full mt-1 p-4 border border-[#5B59E8] rounded-lg focus:ring-2 focus:ring-[#5B59E8] 2xl:p-5"
/>
</div>
{/* Input Nomor Telepon */}
<div>
<label className="text-[#6B5CEA]">Nomor Telepon*</label>
<input
@ -70,8 +72,6 @@ const ContactForm = () => {
}}
/>
</div>
{/* Input Email */}
<div>
<label className="text-[#6B5CEA]">Email*</label>
<input
@ -81,20 +81,14 @@ const ContactForm = () => {
className="w-full mt-1 p-4 border border-[#5B59E8] rounded-lg focus:ring-2 focus:ring-[#5B59E8] 2xl:p-5"
/>
</div>
{/* Input Nama Organisasi */}
<div>
<label className="text-[#6B5CEA]">
Nama Organisasi/Perusahaan
</label>
<label className="text-[#6B5CEA]">Nama Organisasi/Perusahaan</label>
<input
type="text"
placeholder="Masukkan nama organisasi/perusahaan Anda"
className="w-full mt-1 p-4 border border-[#5B59E8] rounded-lg focus:ring-2 focus:ring-[#5B59E8] 2xl:p-5"
/>
</div>
{/* Dropdown Pilih Kebutuhan */}
<div className="relative">
<label className="text-[#6B5CEA]">Pilih Kebutuhan</label>
<select
@ -106,7 +100,6 @@ const ContactForm = () => {
<option value="pelatihan">Pelatihan</option>
<option value="pengembangan">Pengembangan</option>
</select>
{/* Tanda panah kustom */}
<div className="absolute inset-y-0 right-5 flex items-center pointer-events-none">
<svg
className="w-6 text-[#5B59E8]"
@ -125,20 +118,18 @@ const ContactForm = () => {
</div>
</div>
{/* Checkbox Verifikasi */}
{/* ReCAPTCHA */}
<div className="flex items-center gap-2">
<input
type="checkbox"
required
className="focus:ring-2 focus:ring-indigo-500"
<ReCAPTCHA
sitekey="6LcIYNYqAAAAAJW_YJRWbBDBGt1gsKwsL9vK1SfW"
onChange={handleRecaptcha} // Mengganti render="explicit" dengan onChange yang lebih sederhana
/>
<span className="text-[#212121]">Saya bukan robot</span>
</div>
{/* Tombol Kirim */}
<button
type="submit"
className="bg-indigo-500 hover:bg-indigo-600 text-white py-3 px-6 rounded-lg shadow-md transition-all w-[173px] 2xl:w-[200px] 2xl:py-4"
className="bg-[#5B59E0] hover:bg-indigo-700 text-white py-3 px-6 rounded-lg shadow-md transition-all w-[173px] 2xl:w-[200px] 2xl:py-4"
disabled={!capchaToken} // Tombol dinonaktifkan jika reCAPTCHA belum dicentang
>
Kirim Pesan
</button>

23
src/components/contact/Recaptcha/useRecaptcha.js Normal file
View File

@ -0,0 +1,23 @@
import { useState, useRef } from "react";
const useRecaptcha = () => {
const [capchaToken, setCapchaToken] = useState(null); // Menyimpan token reCAPTCHA
const recaptchaRef = useRef(); // Menggunakan ref untuk reCAPTCHA jika perlu manipulasi lebih lanjut
// Fungsi untuk menangani perubahan token setelah reCAPTCHA berhasil
const handleRecaptcha = (token) => {
if (token) {
setCapchaToken(token); // Set token jika berhasil
} else {
setCapchaToken(null); // Reset token jika tidak ada token
}
};
return {
capchaToken, // Mengembalikan token
recaptchaRef, // Referensi reCAPTCHA
handleRecaptcha, // Fungsi untuk menangani perubahan token
};
};
export default useRecaptcha;

4
src/components/solusi/HeadCorporate/HeadCorporate.jsx
View File

@ -1,5 +1,5 @@
import { Link } from "react-router-dom";
import { component11, wagreen, hc } from "../asset";
export default function HeadCorporate() {
return (
<div className="container mx-auto px-4 lg:px-6">
@ -44,9 +44,11 @@ export default function HeadCorporate() {
<img src={wagreen} alt="WhatsApp Icon" width={30} height={30} className="mr-2" />
Konsultasi Gratis
</button>
<Link to="/Contact#form">
<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>
</Link>
</div>
</div>
</div>

4
src/components/solusi/HeadPersonal/HeadPersonal.jsx
View File

@ -1,4 +1,5 @@
import { component11, wagreen, start22 } from "../asset";
import { Link } from "react-router-dom";
export default function HeadPersonal() {
return (
@ -46,9 +47,12 @@ export default function HeadPersonal() {
<img src={wagreen} alt="WhatsApp Icon" width={30} height={30} className="mr-2" />
Konsultasi Gratis
</button>
<Link to="/Contact#form">
<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>
</Link>
</div>
</div>
</div>

4
src/components/solusi/HeadStartup/HeadStartup.jsx
View File

@ -1,5 +1,5 @@
import { component11, wagreen, hs } from "../asset";
import { Link } from "react-router-dom";
export default function HeadPersonal() {
return (
<div className="container mx-auto px-4 lg:px-6">
@ -44,9 +44,11 @@ export default function HeadPersonal() {
<img src={wagreen} alt="WhatsApp Icon" width={30} height={30} className="mr-2" />
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<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>
</Link>
</div>
</div>
</div>

10
src/components/solusi/MengapaCorporate/MengapaCorporate.jsx
View File

@ -1,8 +1,8 @@
import { Link } from "react-router-dom"
import { chek2, wagreen, start33, start44, start55 } from "../asset"
function Kenapa() {
return (
<div className="flex justify-center items-center bg-customWhite mt-5 min-h-screen">
<div className="container mx-auto flex justify-center items-center bg-customWhite mt-5 min-h-screen">
<div className="flex flex-col md:flex-row bg-customWhite rounded-lg overflow-hidden relative pt-16 md:pt-52">
{/* Image Section */}
<div className="relative w-full md:w-2/5 p-5 flex justify-center md:ml-14 md:justify-start">
@ -15,8 +15,8 @@ function Kenapa() {
{/* Text Section */}
<div className="w-full md:w-3/5 p-6 md:p-10 flex flex-col items-center md:items-start md:mr-28 text-center md:text-left text-[#212121] ">
<h2 className="text-[32px] font-semibold">Mengapa Rekan AI untuk Corporate Business?</h2>
<p className="mt-4 text-sm md:max-w-[90%] md:leading-8 text-[20px]">
<h2 className="text-[30px] font-semibold">Mengapa Rekan AI untuk Corporate Business?</h2>
<p className="mt-4 text-sm md:leading-8 md:text-lg">
Rekan AI dirancang khusus untuk mendukung kebutuhan bisnis berskala besar dengan menghadirkan solusi yang dapat meningkatkan efisiensi, mempercepat proses, dan membantu pengambilan keputusan strategis. Dengan teknologi mutakhir yang fleksibel dan aman, Rekan AI menjadi mitra terpercaya dalam perjalanan transformasi digital perusahaan Anda.
</p>
<ul className="mt-8 space-y-4 md:space-y-6 text-[16px] md:max-w-[70%] font-medium">
@ -41,9 +41,11 @@ function Kenapa() {
/>
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button className="w-full md:w-[276px] h-[50px] md:h-[70px] bg-gradient-to-r from-pink-700 to-indigo-600 text-white md:text-xl font-medium rounded-[14px] hover:opacity-90 transition">
Coba Sekarang
</button>
</Link>
</div>
</div>
</div>

10
src/components/solusi/MengapaStartup/MengapaStartup.jsx
View File

@ -1,8 +1,8 @@
import { Link } from "react-router-dom"
import { chek2, wagreen, start44 } from "../asset"
function Kenapa() {
return (
<div className="flex justify-center items-center bg-customWhite mt-5 min-h-screen">
<div className="container mx-auto flex justify-center items-center bg-customWhite mt-5 min-h-screen">
<div className="flex flex-col md:flex-row bg-customWhite rounded-lg overflow-hidden relative pt-16 md:pt-52">
{/* Image Section */}
<div className="relative w-full md:w-2/5 p-5 flex justify-center md:ml-14 md:justify-start">
@ -15,8 +15,8 @@ function Kenapa() {
{/* Text Section */}
<div className="w-full md:w-3/5 p-6 md:p-10 flex flex-col items-center md:items-start md:mr-28 text-center md:text-left text-[#212121] ">
<h2 className="text-[32px] font-semibold">Kenapa Memilih Rekan AI untuk Startup Anda?</h2>
<p className="mt-4 text-sm md:max-w-[90%] md:leading-8 text-[20px]">
<h2 className="text-[30px] font-semibold">Kenapa Memilih Rekan AI untuk Startup Anda?</h2>
<p className="mt-4 text-sm md:leading-8 md:text-xl">
Startup adalah tulang punggung perekonomian, dan Rekan AI hadir untuk memberdayakan pelaku usaha agar dapat bersaing di era digital. Dengan solusi berbasis AI, kami membantu usaha kecil dan menengah mencapai efisiensi yang lebih baik, memperluas jangkauan pasar, dan meningkatkan kepuasan pelanggan.
</p>
<ul className="mt-8 space-y-4 md:space-y-6 text-[16px] md:max-w-[70%] font-medium">
@ -43,9 +43,11 @@ function Kenapa() {
/>
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button className="w-full md:w-[276px] h-[50px] md:h-[70px] bg-gradient-to-r from-pink-700 to-indigo-600 text-white md:text-xl font-medium rounded-[14px] hover:opacity-90 transition">
Coba Sekarang
</button>
</Link>
</div>
</div>
</div>

10
src/components/solusi/MengapapPersonal/MengapapPersonal.jsx
View File

@ -1,8 +1,8 @@
import { chek2, wagreen, start33 } from "../asset"
import { Link } from "react-router-dom"
function Kenapa() {
return (
<div className="flex justify-center items-center bg-customWhite mt-5 min-h-screen">
<div className="container mx-auto flex justify-center items-center bg-customWhite mt-5 min-h-screen">
<div className="flex flex-col md:flex-row bg-customWhite rounded-lg overflow-hidden relative pt-16 md:pt-52">
{/* Image Section */}
<div className="relative w-full md:w-2/5 p-5 flex justify-center md:ml-14 md:justify-start">
@ -15,8 +15,8 @@ function Kenapa() {
{/* Text Section */}
<div className="w-full md:w-3/5 p-6 md:p-10 flex flex-col items-center md:items-start md:mr-28 text-center md:text-left text-[#212121] ">
<h2 className="text-[32px] font-semibold">Mengapa Memilih Rekan AI untuk Penggunaan Pribadi?</h2>
<p className="mt-4 text-sm md:max-w-[90%] md:leading-8 text-[20px]">
<h2 className="text-[30px] font-semibold">Mengapa Memilih Rekan AI untuk Penggunaan Pribadi?</h2>
<p className="mt-4 md:text-lg md:leading-8 text-sm">
Rekan AI hadir untuk memberikan kemudahan dan efisiensi bagi individu yang ingin memanfaatkan kecerdasan
buatan dalam kehidupan sehari-hari. Apakah Anda ingin meningkatkan produktivitas, mengelola data dengan
aman, atau membuat keputusan yang lebih cerdas, Rekan AI adalah solusi tepat yang dirancang khusus untuk
@ -46,9 +46,11 @@ function Kenapa() {
/>
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button className="w-full md:w-[276px] h-[50px] md:h-[70px] bg-gradient-to-r from-pink-700 to-indigo-600 text-white md:text-xl font-medium rounded-[14px] hover:opacity-90 transition">
Coba Sekarang
</button>
</Link>
</div>
</div>
</div>

4
src/components/solusi/SolusiCorporate/SolusiCorporate.jsx
View File

@ -34,7 +34,7 @@ export default function BusinessSolution() {
{activeContent && (
<div className="max-w-7xl mx-auto flex flex-col sm:flex-row flex-wrap gap-8 justify-center lg:justify-start">
{/* Image Section */}
<div className="w-full sm:w-[400px] md:w-[500px] lg:w-[618px] h-auto rounded-[14px] border border-gray-200 overflow-hidden shadow-lg">
<div className="w-full sm:w-[400px] md:w-[500px] md:-ml-20 lg:w-[618px] h-auto rounded-[14px] border border-gray-200 overflow-hidden shadow-lg">
<img
src={activeContent.image || "/placeholder.svg"}
alt={activeContent.title}
@ -43,7 +43,7 @@ export default function BusinessSolution() {
</div>
{/* Text Content */}
<div className="flex-1 max-w-full md:max-w-[600px]">
<div className="flex-1 max-w-full md:max-w-[600px] md:ml-9">
<h2 className="text-[24px] md:text-[32px] text-[#212121] font-semibold mb-6">{activeContent.title}</h2>
<p className="text-[#212121] text-[16px] md:text-[20px] mb-8">{activeContent.description}</p>

4
src/components/solusi/SolusiPersonal/SolusiPersonal.jsx
View File

@ -34,7 +34,7 @@ export default function BusinessSolution() {
{activeContent && (
<div className="max-w-7xl mx-auto flex flex-col sm:flex-row flex-wrap gap-8 justify-center lg:justify-start">
{/* Image Section */}
<div className="w-full sm:w-[400px] md:w-[500px] lg:w-[618px] h-auto rounded-[14px] border border-gray-200 overflow-hidden shadow-lg">
<div className="w-full sm:w-[400px] md:w-[500px] md:-ml-20 lg:w-[618px] h-auto rounded-[14px] border border-gray-200 overflow-hidden shadow-lg">
<img
src={activeContent.image || "/placeholder.svg"}
alt={activeContent.title}
@ -43,7 +43,7 @@ export default function BusinessSolution() {
</div>
{/* Text Content */}
<div className="flex-1 max-w-full md:max-w-[600px]">
<div className="flex-1 max-w-full md:max-w-[600px] md:ml-9">
<h2 className="text-[24px] md:text-[32px] text-[#212121] font-semibold mb-6">{activeContent.title}</h2>
<p className="text-[#212121] text-[16px] md:text-[20px] mb-8">{activeContent.description}</p>

4
src/components/solusi/SolusiStartup/SolusiStartup.jsx
View File

@ -34,7 +34,7 @@ export default function BusinessSolution() {
{activeContent && (
<div className="max-w-7xl mx-auto flex flex-col sm:flex-row flex-wrap gap-8 justify-center lg:justify-start">
{/* Image Section */}
<div className="w-full sm:w-[400px] md:w-[500px] lg:w-[618px] h-auto rounded-[14px] border border-gray-200 overflow-hidden shadow-lg">
<div className="w-full sm:w-[400px] md:w-[500px] md:-ml-20 lg:w-[618px] h-auto rounded-[14px] border border-gray-200 overflow-hidden shadow-lg">
<img
src={activeContent.image || "/placeholder.svg"}
alt={activeContent.title}
@ -43,7 +43,7 @@ export default function BusinessSolution() {
</div>
{/* Text Content */}
<div className="flex-1 max-w-full md:max-w-[600px]">
<div className="flex-1 max-w-full md:max-w-[600px] md:ml-9">
<h2 className="text-[24px] md:text-[32px] text-[#212121] font-semibold mb-6">{activeContent.title}</h2>
<p className="text-[#212121] text-[16px] md:text-[20px] mb-8">{activeContent.description}</p>

4
src/components/solusi/TransformasiCorpo/TransformasiCorpo.jsx
View File

@ -1,5 +1,5 @@
import { Link } from "react-router-dom";
import { wagreen } from "../asset";
function Transformasi() {
return (
<>
@ -27,9 +27,11 @@ function Transformasi() {
<img src={wagreen} alt="WhatsApp Icon" className="mr-4 w-5 h-5 md:w-[30px] md:h-[30px]" />
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button className="w-full lg:w-[276px] h-[70px] btn2 flex items-center justify-center py-3 px-8 rounded-[14px] bg-gradient-to-r from-[#DC0168] to-[#5B59E8] text-white font-semibold text-[18px] lg:text-[20px] cursor-pointer transition-all ease-in-out hover:opacity-90">
Coba Sekarang
</button>
</Link>
</div>
</>

4
src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx
View File

@ -1,6 +1,6 @@
import React from "react";
import { wagreen } from "../asset";
import { Link } from "react-router-dom";
function MasaDepan() {
return (
<>
@ -28,9 +28,11 @@ function MasaDepan() {
<img src={wagreen} alt="WhatsApp Icon" className="mr-4 w-5 h-5 md:w-[30px] md:h-[30px]" />
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button className="w-full lg:w-[276px] h-[70px] btn2 flex items-center justify-center py-3 px-8 rounded-[14px] bg-gradient-to-r from-[#DC0168] to-[#5B59E8] text-white font-medium text-[18px] lg:text-[20px] cursor-pointer transition-all ease-in-out hover:opacity-90">
Coba Sekarang
</button>
</Link>
</div>
</>

4
src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx
View File

@ -1,5 +1,5 @@
import { wagreen } from "../asset";
import { Link } from "react-router-dom";
function Transformasi() {
return (
<>
@ -31,9 +31,11 @@ function Transformasi() {
<img src={wagreen} alt="WhatsApp Icon" className="mr-4 w-5 h-5 md:w-[30px] md:h-[30px]" />
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button className="w-full lg:w-[276px] h-[70px] btn2 flex items-center justify-center py-3 px-8 rounded-[14px] bg-gradient-to-r from-[#DC0168] to-[#5B59E8] text-white font-semibold text-[18px] lg:text-[20px] cursor-pointer transition-all ease-in-out hover:opacity-90">
Coba Sekarang
</button>
</Link>
</div>
</>

4
src/components/solusi/TransformasiStart/TransformasiStart.jsx
View File

@ -1,5 +1,5 @@
import { Link } from "react-router-dom";
import { wagreen } from "../asset";
function Transformasi() {
return (
<>
@ -31,9 +31,11 @@ function Transformasi() {
<img src={wagreen} alt="WhatsApp Icon" className="mr-4 w-5 h-5 md:w-[30px] md:h-[30px]" />
Konsultasi Gratis
</button>
<Link to={"/Contact#form"}>
<button className="w-full lg:w-[276px] h-[70px] btn2 flex items-center justify-center py-3 px-8 rounded-[14px] bg-gradient-to-r from-[#DC0168] to-[#5B59E8] text-white font-semibold text-[18px] lg:text-[20px] cursor-pointer transition-all ease-in-out hover:opacity-90">
Coba Sekarang
</button>
</Link>
</div>
</>