From d4749582c11cfd02efb4c01fa6c217f173656d04 Mon Sep 17 00:00:00 2001 From: Carls2320 Date: Fri, 14 Feb 2025 02:37:44 +0700 Subject: [PATCH 1/8] done recaptcha and solusi bisnis --- index.html | 3 + package-lock.json | 46 +++++++++++- package.json | 2 + src/components/contact/FormSection.jsx | 69 ++++++++---------- .../contact/asset/Dribbble-Light-Preview.png | Bin 0 -> 411 bytes src/components/contact/asset/index.js | 3 +- .../SolusiCorporate/SolusiCorporate.jsx | 19 ++++- .../solusi/SolusiPersonal/SolusiPersonal.jsx | 19 ++++- .../solusi/SolusiStartup/SolusiStartup.jsx | 19 ++++- 9 files changed, 128 insertions(+), 52 deletions(-) create mode 100644 src/components/contact/asset/Dribbble-Light-Preview.png diff --git a/index.html b/index.html index 9a4e869..0fd35b0 100644 --- a/index.html +++ b/index.html @@ -15,6 +15,9 @@
+ \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 797bb67..e414e2a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,8 @@ "dependencies": { "react": "^18.3.1", "react-dom": "^18.3.1", + "react-google-recaptcha": "^3.1.0", + "react-recaptcha": "^2.3.10", "react-router-dom": "^7.1.3" }, "devDependencies": { @@ -3182,6 +3184,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 +4007,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 +4493,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 +4543,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,13 +4569,31 @@ "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-recaptcha": { + "version": "2.3.10", + "resolved": "https://registry.npmjs.org/react-recaptcha/-/react-recaptcha-2.3.10.tgz", + "integrity": "sha512-IyanbozsYCuHvTYDuskZTIEcRAMG/sdvAu5b29iQWoC8Kd3Zk9WGCv2oNxh6RfGHvSvgHAyaLjmC6ei/yMsJ7g==", + "license": "BSD" + }, "node_modules/react-refresh": { "version": "0.14.2", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz", diff --git a/package.json b/package.json index f8e479e..1a9d1ad 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,8 @@ "dependencies": { "react": "^18.3.1", "react-dom": "^18.3.1", + "react-google-recaptcha": "^3.1.0", + "react-recaptcha": "^2.3.10", "react-router-dom": "^7.1.3" }, "devDependencies": { diff --git a/src/components/contact/FormSection.jsx b/src/components/contact/FormSection.jsx index 9222f38..b8b6b12 100644 --- a/src/components/contact/FormSection.jsx +++ b/src/components/contact/FormSection.jsx @@ -1,11 +1,28 @@ -import { img10 } from "./asset"; +import { useState } from "react"; +import { img10 } from "./asset"; // Pastikan img10 ada dan benar path-nya +import ReCAPTCHA from "react-google-recaptcha"; // Pastikan penulisan benar (ReCAPTCHA) const ContactForm = () => { + // State untuk melacak status reCAPTCHA + const [isCaptchaVerified, setIsCaptchaVerified] = useState(false); + + // Callback yang dijalankan setelah reCAPTCHA dimuat + const callback = function () { + console.log("Done!!!!"); + }; + + // Callback verifikasi reCAPTCHA + const verifyCallback = function (response) { + if (response) { + setIsCaptchaVerified(true); // Jika reCAPTCHA berhasil, set state menjadi true + } + }; + return (
{
{/* Bagian Kiri */}
- {/* Judul utama */}

- Isi formulir di samping ini dan kami akan menghubungi Anda secepat - mungkin + Isi formulir di samping ini dan kami akan menghubungi Anda secepat mungkin

- - {/* Deskripsi tambahan */}

- 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!

{/* Bagian Form */} - -
- - - {/* Judul form */} +

Hubungi Tim Terbaik Kami

- {/* Deskripsi form */}

Silakan isi data diri Anda pada formulir di bawah ini

- {/* Formulir input */}
- {/* Input Nama */}
{ className="w-full mt-1 p-4 border border-[#5B59E8] rounded-lg focus:ring-2 focus:ring-[#5B59E8] 2xl:p-5" />
- - {/* Input Nomor Telepon */}
{ }} />
- - {/* Input Email */}
{ className="w-full mt-1 p-4 border border-[#5B59E8] rounded-lg focus:ring-2 focus:ring-[#5B59E8] 2xl:p-5" />
- - {/* Input Nama Organisasi */}
- +
- - {/* Dropdown Pilih Kebutuhan */}
- {/* Tanda panah kustom */}
{
- {/* Checkbox Verifikasi */} + {/* ReCAPTCHA */}
- - Saya bukan robot
- {/* Tombol Kirim */} diff --git a/src/components/contact/asset/Dribbble-Light-Preview.png b/src/components/contact/asset/Dribbble-Light-Preview.png new file mode 100644 index 0000000000000000000000000000000000000000..53dae629ff92c82a3992b1452024faa16e9ab230 GIT binary patch literal 411 zcmV;M0c8G(P)jV5zU+gC6i-usWU>h2Wd4UpsWj?ud>a=|$!a5Z51|=%B{Mz8p zr9H+z7&G7zZ}1u#f(3&$diXv{<9175Az0@KnyGHTvmHfV&-7L|la2rY002ovPDHLk FV1j!2ooWC8 literal 0 HcmV?d00001 diff --git a/src/components/contact/asset/index.js b/src/components/contact/asset/index.js index 7439b71..38a7926 100644 --- a/src/components/contact/asset/index.js +++ b/src/components/contact/asset/index.js @@ -18,8 +18,9 @@ import telephone from './telephone.png'; import wagreen from './whatsapp-color_svgrepo.com.png'; import wabutton from './Whatsapp22.png'; import x from './x.png'; +import arrowform from './Dribbble-Light-Preview.png'; export{ - row,component11,customer,email,facebook,frame,frame27,img10,instagram,kmn,kominfo,Logo1,nvidia,ojk,phone,search,telephone,wagreen,wabutton,x + row,component11,customer,email,facebook,frame,frame27,img10,instagram,kmn,kominfo,Logo1,nvidia,ojk,phone,search,telephone,wagreen,wabutton,x,arrowform } \ No newline at end of file diff --git a/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx b/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx index ecca628..e5568ef 100644 --- a/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx +++ b/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx @@ -1,9 +1,22 @@ -import { useState } from "react"; +import { useState, useEffect } from "react"; import { data } from "./data"; export default function BusinessSolution() { const [activeTab, setActiveTab] = useState("hr"); const activeContent = data.content[activeTab]; + const [isMobile, setIsMobile] = useState(false); + + // Detect mobile screen size + useEffect(() => { + const handleResize = () => { + setIsMobile(window.innerWidth < 768); // Set to true if screen width is less than 768px + }; + + window.addEventListener("resize", handleResize); + handleResize(); // Initialize state on component mount + + return () => window.removeEventListener("resize", handleResize); // Cleanup on unmount + }, []); return (
@@ -15,7 +28,7 @@ export default function BusinessSolution() { {/* Navigation Buttons */}
-
+
{data.tabs.map((button) => ( diff --git a/src/components/contact/Form/useRecaptcha.js b/src/components/contact/Form/useRecaptcha.js new file mode 100644 index 0000000..6b6768f --- /dev/null +++ b/src/components/contact/Form/useRecaptcha.js @@ -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; diff --git a/src/pages/Contact.jsx b/src/pages/Contact.jsx index 54cede4..ceca7cd 100644 --- a/src/pages/Contact.jsx +++ b/src/pages/Contact.jsx @@ -1,6 +1,6 @@ import Header from "../components/beranda/Header" import CustomerService from "../components/contact/CustomerService" -import FormSection from "../components/contact/FormSection" +import FormSection from "../components/contact/Form/FormSection" import FAQSection from "../components/contact/FAQSection" import BottomCTA from "../components/contact/BottomCTA" import WhatsAppButton from "../components/beranda/WhatsAppButon" From 17440450fd0fc642795333cf465bbd80ff173292 Mon Sep 17 00:00:00 2001 From: Carls2320 Date: Mon, 17 Feb 2025 09:28:35 +0700 Subject: [PATCH 3/8] update 50% --- index.html | 2 - package-lock.json | 123 +++++++---- package.json | 9 +- src/App.jsx | 2 + src/assets/image/Frame 18 (3).png | Bin 0 -> 2281 bytes src/assets/image/Frame 18 (4).png | Bin 0 -> 2094 bytes src/assets/image/Frame 18 (5).png | Bin 0 -> 2364 bytes src/assets/image/Frame 18 (6).png | Bin 0 -> 2597 bytes src/assets/index.js | 8 +- src/components/beranda/Banner.jsx | 13 +- src/components/beranda/Footer.jsx | 120 ++++++++--- src/components/beranda/Header.jsx | 204 +++++++++++++++--- src/components/beranda/Hero.jsx | 12 +- src/components/beranda/Kenapa.jsx | 12 +- src/components/beranda/MasaDepan.jsx | 22 +- src/components/beranda/WhatsAppButon.jsx | 2 +- src/components/contact/BottomCTA.jsx | 68 ++++-- src/components/contact/CustomerService.jsx | 42 +++- src/components/contact/FAQSection.jsx | 177 +++++---------- src/components/contact/Footer.jsx | 10 +- .../contact/{Form => }/FormSection.jsx | 59 +++-- .../{Form => Recaptcha}/useRecaptcha.js | 0 src/components/contact/asset/index.js | 3 +- .../solusi/HeadCorporate/HeadCorporate.jsx | 10 +- .../solusi/HeadPersonal/HeadPersonal.jsx | 16 +- .../solusi/HeadStartup/HeadStartup.jsx | 4 +- .../MengapaCorporate/MengapaCorporate.jsx | 18 +- .../solusi/MengapaStartup/MengapaStartup.jsx | 10 +- .../MengapapPersonal/MengapapPersonal.jsx | 16 +- .../SolusiCorporate/SolusiCorporate.jsx | 4 +- .../solusi/SolusiPersonal/SolusiPersonal.jsx | 16 +- .../solusi/SolusiStartup/SolusiStartup.jsx | 4 +- .../TransformasiCorpo/TransformasiCorpo.jsx | 4 +- .../TransformasiCorporate.jsx | 4 +- .../TransformasiPersonal.jsx | 4 +- .../TransformasiStart/TransformasiStart.jsx | 4 +- src/pages/Contact.jsx | 4 +- src/pages/Home.jsx | 48 ++--- src/pages/SolusiCorporate.jsx | 2 +- src/pages/SolusiPersonal.jsx | 2 +- src/pages/SolusiStartup.jsx | 2 +- 41 files changed, 677 insertions(+), 383 deletions(-) create mode 100644 src/assets/image/Frame 18 (3).png create mode 100644 src/assets/image/Frame 18 (4).png create mode 100644 src/assets/image/Frame 18 (5).png create mode 100644 src/assets/image/Frame 18 (6).png rename src/components/contact/{Form => }/FormSection.jsx (75%) rename src/components/contact/{Form => Recaptcha}/useRecaptcha.js (100%) diff --git a/index.html b/index.html index beb0d7e..9a4e869 100644 --- a/index.html +++ b/index.html @@ -15,8 +15,6 @@
- - \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index e414e2a..5dc2754 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,11 +8,12 @@ "name": "rekan-ai-tailwind", "version": "0.0.0", "dependencies": { - "react": "^18.3.1", - "react-dom": "^18.3.1", + "framer-motion": "^12.4.3", + "react": "^19.0.0", + "react-dom": "^19.0.0", "react-google-recaptcha": "^3.1.0", - "react-recaptcha": "^2.3.10", - "react-router-dom": "^7.1.3" + "react-intersection-observer": "^9.15.1", + "react-router-dom": "^7.1.5" }, "devDependencies": { "@eslint/js": "^9.17.0", @@ -2864,6 +2865,33 @@ "url": "https://github.com/sponsors/rawify" } }, + "node_modules/framer-motion": { + "version": "12.4.3", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-12.4.3.tgz", + "integrity": "sha512-rsMeO7w3dKyNG09o3cGwSH49iHU+VgDmfSSfsX+wfkO3zDA6WWkh4sUsMXd155YROjZP+7FTIhDrBYfgZeHjKQ==", + "license": "MIT", + "dependencies": { + "motion-dom": "^12.0.0", + "motion-utils": "^12.0.0", + "tslib": "^2.4.0" + }, + "peerDependencies": { + "@emotion/is-prop-valid": "*", + "react": "^18.0.0 || ^19.0.0", + "react-dom": "^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@emotion/is-prop-valid": { + "optional": true + }, + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, "node_modules/fsevents": { "version": "2.3.3", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", @@ -3931,6 +3959,21 @@ "node": ">=16 || 14 >=14.17" } }, + "node_modules/motion-dom": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-12.0.0.tgz", + "integrity": "sha512-CvYd15OeIR6kHgMdonCc1ihsaUG4MYh/wrkz8gZ3hBX/uamyZCXN9S9qJoYF03GqfTt7thTV/dxnHYX4+55vDg==", + "license": "MIT", + "dependencies": { + "motion-utils": "^12.0.0" + } + }, + "node_modules/motion-utils": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-12.0.0.tgz", + "integrity": "sha512-MNFiBKbbqnmvOjkPyOKgHUp3Q6oiokLkI1bEwm5QA28cxMZrv0CbbBGDNmhF6DIXsi1pCQBSs0dX8xjeER1tmA==", + "license": "MIT" + }, "node_modules/ms": { "version": "2.1.3", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", @@ -4532,13 +4575,10 @@ "license": "MIT" }, "node_modules/react": { - "version": "18.3.1", - "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", - "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", + "version": "19.0.0", + "resolved": "https://registry.npmjs.org/react/-/react-19.0.0.tgz", + "integrity": "sha512-V8AVnmPIICiWpGfm6GLzCR/W5FXLchHop40W4nXBmdlEceh16rCN8O8LNWm5bh5XUX91fh7KpA+W0TgMKmgTpQ==", "license": "MIT", - "dependencies": { - "loose-envify": "^1.1.0" - }, "engines": { "node": ">=0.10.0" } @@ -4557,16 +4597,15 @@ } }, "node_modules/react-dom": { - "version": "18.3.1", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", - "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", + "version": "19.0.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.0.0.tgz", + "integrity": "sha512-4GV5sHFG0e/0AD4X+ySy6UJd3jVl1iNsNHdpad0qhABJ11twS3TTBnseqsKurKcsNqCEFeGL3uLpVChpIO3QfQ==", "license": "MIT", "dependencies": { - "loose-envify": "^1.1.0", - "scheduler": "^0.23.2" + "scheduler": "^0.25.0" }, "peerDependencies": { - "react": "^18.3.1" + "react": "^19.0.0" } }, "node_modules/react-google-recaptcha": { @@ -4582,18 +4621,27 @@ "react": ">=16.4.1" } }, + "node_modules/react-intersection-observer": { + "version": "9.15.1", + "resolved": "https://registry.npmjs.org/react-intersection-observer/-/react-intersection-observer-9.15.1.tgz", + "integrity": "sha512-vGrqYEVWXfH+AGu241uzfUpNK4HAdhCkSAyFdkMb9VWWXs6mxzBLpWCxEy9YcnDNY2g9eO6z7qUtTBdA9hc8pA==", + "license": "MIT", + "peerDependencies": { + "react": "^17.0.0 || ^18.0.0 || ^19.0.0", + "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + } + } + }, "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==", "license": "MIT" }, - "node_modules/react-recaptcha": { - "version": "2.3.10", - "resolved": "https://registry.npmjs.org/react-recaptcha/-/react-recaptcha-2.3.10.tgz", - "integrity": "sha512-IyanbozsYCuHvTYDuskZTIEcRAMG/sdvAu5b29iQWoC8Kd3Zk9WGCv2oNxh6RfGHvSvgHAyaLjmC6ei/yMsJ7g==", - "license": "BSD" - }, "node_modules/react-refresh": { "version": "0.14.2", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz", @@ -4605,9 +4653,9 @@ } }, "node_modules/react-router": { - "version": "7.1.3", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.1.3.tgz", - "integrity": "sha512-EezYymLY6Guk/zLQ2vRA8WvdUhWFEj5fcE3RfWihhxXBW7+cd1LsIiA3lmx+KCmneAGQuyBv820o44L2+TtkSA==", + "version": "7.1.5", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.1.5.tgz", + "integrity": "sha512-8BUF+hZEU4/z/JD201yK6S+UYhsf58bzYIDq2NS1iGpwxSXDu7F+DeGSkIXMFBuHZB21FSiCzEcUb18cQNdRkA==", "license": "MIT", "dependencies": { "@types/cookie": "^0.6.0", @@ -4629,12 +4677,12 @@ } }, "node_modules/react-router-dom": { - "version": "7.1.3", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.1.3.tgz", - "integrity": "sha512-qQGTE+77hleBzv9SIUIkGRvuFBQGagW+TQKy53UTZAO/3+YFNBYvRsNIZ1GT17yHbc63FylMOdS+m3oUriF1GA==", + "version": "7.1.5", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.1.5.tgz", + "integrity": "sha512-/4f9+up0Qv92D3bB8iN5P1s3oHAepSGa9h5k6tpTFlixTTskJZwKGhJ6vRJ277tLD1zuaZTt95hyGWV1Z37csQ==", "license": "MIT", "dependencies": { - "react-router": "7.1.3" + "react-router": "7.1.5" }, "engines": { "node": ">=20.0.0" @@ -4869,13 +4917,10 @@ } }, "node_modules/scheduler": { - "version": "0.23.2", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz", - "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==", - "license": "MIT", - "dependencies": { - "loose-envify": "^1.1.0" - } + "version": "0.25.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.25.0.tgz", + "integrity": "sha512-xFVuu11jh+xcO7JOAGJNOXld8/TcEHK/4CituBUeUb5hqxJLj9YuemAEuvm9gQ/+pgXYfbQuqAkiYu+u7YEsNA==", + "license": "MIT" }, "node_modules/semver": { "version": "6.3.1", @@ -5430,6 +5475,12 @@ "dev": true, "license": "Apache-2.0" }, + "node_modules/tslib": { + "version": "2.8.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", + "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", + "license": "0BSD" + }, "node_modules/turbo-stream": { "version": "2.4.0", "resolved": "https://registry.npmjs.org/turbo-stream/-/turbo-stream-2.4.0.tgz", diff --git a/package.json b/package.json index 1a9d1ad..7cecf80 100644 --- a/package.json +++ b/package.json @@ -10,11 +10,12 @@ "preview": "vite preview" }, "dependencies": { - "react": "^18.3.1", - "react-dom": "^18.3.1", + "framer-motion": "^12.4.3", + "react": "^19.0.0", + "react-dom": "^19.0.0", "react-google-recaptcha": "^3.1.0", - "react-recaptcha": "^2.3.10", - "react-router-dom": "^7.1.3" + "react-intersection-observer": "^9.15.1", + "react-router-dom": "^7.1.5" }, "devDependencies": { "@eslint/js": "^9.17.0", diff --git a/src/App.jsx b/src/App.jsx index eb13f86..c6edf53 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,6 +1,7 @@ import { BrowserRouter as Router, Routes, Route } from 'react-router-dom'; import Contact from "./pages/Contact" import Home from "./pages/Home" +import FormSection from "./components/contact/FormSection" import SolusiPersonal from "./pages/SolusiPersonal" import SolusiStartup from "./pages/SolusiStartup" import SolusiCorporate from "./pages/SolusiCorporate" @@ -11,6 +12,7 @@ function App() { }/> }/> + }/> }/> }/> }/> diff --git a/src/assets/image/Frame 18 (3).png b/src/assets/image/Frame 18 (3).png new file mode 100644 index 0000000000000000000000000000000000000000..ddbb2b2e6ae89733f4ef685de0d12a8be1081301 GIT binary patch literal 2281 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 Hu0mjfDv!M5 literal 0 HcmV?d00001 diff --git a/src/assets/index.js b/src/assets/index.js index 6bdae59..fe5e03e 100644 --- a/src/assets/index.js +++ b/src/assets/index.js @@ -2,7 +2,11 @@ import Logo1 from './image/logo.png' import search from './image/search.png'; import IconPersonal from './image/Frame 18.png'; import IconStartup from './image/Frame 18 (1).png'; -import IconCorporate from './image/Frame 18 (2).png' +import IconCorporate from './image/Frame 18 (2).png'; +import ProdukHr from './image/Frame 18 (3).png'; +import ProdukDoku from './image/Frame 18 (4).png'; +import ProdukLlm from './image/Frame 18 (5).png'; +import ProdukVeri from './image/Frame 18 (6).png'; import row from './image/arrow.png'; import row2 from './image/vector.png'; import homeLogo from './image/Component 1.png'; @@ -80,5 +84,5 @@ export{ swipper7,swipper8,swipper9,swipper10,swipper11,swipper12,swipper13,swipper14, swipper15,swipper16,swipper17,swipper18,swipper19,swipper20,swipper21,swipper22, swipper23,swipper24,bgSwiper,imgLeft1,imgLeft2,imgLeft3,imgRight,nvdia,kmn,kominfo, - ojk,facebook,x,instagram,frame,IconPersonal,IconStartup,IconCorporate + ojk,facebook,x,instagram,frame,IconPersonal,IconStartup,IconCorporate,ProdukDoku,ProdukHr,ProdukVeri,ProdukLlm } \ No newline at end of file diff --git a/src/components/beranda/Banner.jsx b/src/components/beranda/Banner.jsx index 77b9080..608a469 100644 --- a/src/components/beranda/Banner.jsx +++ b/src/components/beranda/Banner.jsx @@ -1,10 +1,11 @@ import { waIcon2, L1, L2, L3, L4, R1, R2, R3, R4, bgcBanner } from "../../assets/" +import { Link } from "react-router-dom" function Banner() { return (
Konsultasi Gratis - + + + +
diff --git a/src/components/beranda/Footer.jsx b/src/components/beranda/Footer.jsx index 57248f8..dab4ae7 100644 --- a/src/components/beranda/Footer.jsx +++ b/src/components/beranda/Footer.jsx @@ -1,78 +1,129 @@ -import { nvdia,kmn,kominfo,ojk,x,instagram,facebook,frame, } from "../../assets"; +import { useNavigate, Link } from "react-router-dom" +import { + nvidia, + kmn, + kominfo, + ojk, + facebook, + x, + instagram, + component11, +} from "../contact/asset"; // Gambar logo sebagai partner dan logo medsos dan logo rekanai function Footer() { + const navigate = useNavigate(); return ( -
+
{/* Kontainer utama footer */}
{/* Kolom 1: Logo perusahaan */}
Logo
{/* Kolom 2: Deskripsi singkat perusahaan */} -
+

Rekan AI{" "}
- + Reimagine Your Business with AI.

-

- Jl. Anggrek No.6, Sawah Lama, Kec. Ciputat, Kota Tangerang Selatan, - Banten 15413 -

-

Lebih dekat dengan Kami

- {/* Kolom 3: Produk perusahaan */} -
-

Produk Kami

+
+

Produk Kami

    -
  • Rekan Doku
    • {/* Produk: Dokumen otomatis */} -
  • Rekan Veri
    • {/* Produk: Verifikasi data */} -
  • Rekan HR
    • {/* Produk: Manajemen SDM */} -
  • Rekan LLM
    • {/* Produk: Model bahasa besar */} +
  • Rekan Doku
    • +
  • Rekan Veri
    • +
  • Rekan HR
    • +
  • Rekan LLM
{/* Kolom 4: Solusi yang ditawarkan */} -
-

Solusi Kami

+
+

Solusi Kami

    -
  • Personal
    • {/* Solusi untuk individu */} -
  • UMKM
    • {/* Solusi untuk Usaha Mikro, Kecil, dan Menengah */} -
  • Corporate Business
    • {/* Solusi untuk perusahaan besar */} +
  • + +
    • +
  • + +
    • +
  • + +
+ {/* Kolom 5: Informasi kontak */}

Hubungi Kami

    -
  • Email: support@rekanai.com
    • {/* Email dukungan */} -
  • Phone: +68452098
    • {/* Nomor telepon */} -
  • F.A.Q
    • {/* Halaman Pertanyaan yang Sering Diajukan */} +
  • + +
    • +
  • + + + +
@@ -80,21 +131,21 @@ function Footer() {
NVIDIA Inception Premier Member
- Partner 1 {/* Gambar logo partner Kementerian */} - Partner 2 {/* Gambar logo partner Kominfo */} - Partner 3 {/* Gambar logo partner OJK */} + Partner 1 + Partner 2 + Partner 3
{/* Bagian hak cipta */} -
+

© Copyright 2025 Rekan AI. Seluruh hak cipta dilindungi undang-undang

@@ -103,5 +154,4 @@ function Footer() { ); } - -export default Footer; \ No newline at end of file +export default Footer; diff --git a/src/components/beranda/Header.jsx b/src/components/beranda/Header.jsx index 45e963d..6f0027e 100644 --- a/src/components/beranda/Header.jsx +++ b/src/components/beranda/Header.jsx @@ -1,12 +1,34 @@ -import { useState } from "react" +import { useState, useRef, useEffect } from "react" import { useNavigate } from "react-router-dom" -import { Logo1, search, row, IconPersonal, IconCorporate, IconStartup } from "../../assets" +import { Logo1, search, row, IconPersonal, IconCorporate, IconStartup, ProdukDoku, ProdukHr, ProdukLlm, ProdukVeri } from "../../assets" const Header = () => { - const navigate = useNavigate() - const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false) - const [isSolusiOpen, setIsSolusiOpen] = useState(false) - const [isProdukOpen, setIsProdukOpen] = useState(false) + const navigate = useNavigate(); + const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); + const [isSolusiOpen, setIsSolusiOpen] = useState(false); + const [isProdukOpen, setIsProdukOpen] = useState(false); + + // Referensi untuk mendeteksi klik di luar dropdown + const solusiRef = useRef(null); + const produkRef = useRef(null); + + // Fungsi untuk menutup dropdown jika klik di luar elemen + useEffect(() => { + function handleClickOutside(event) { + if (solusiRef.current && !solusiRef.current.contains(event.target)) { + setIsSolusiOpen(false); + } + if (produkRef.current && !produkRef.current.contains(event.target)) { + setIsProdukOpen(false); + } + } + + // Tambahkan event listener saat dropdown terbuka + document.addEventListener("mousedown", handleClickOutside); + return () => { + document.removeEventListener("mousedown", handleClickOutside); + }; + }, []); return (
@@ -19,14 +41,17 @@ const Header = () => { {/* Desktop Navigation */}
{/* Produk Dropdown */} -
+
{isProdukOpen && ( - +
+
+
+ {/* HR */} + + + {/* DOKU */} + + + {/* LLM */} + + {/* VERI */} + +
+
+
)}
{/* Solusi Dropdown - Desktop */} -
+
@@ -133,7 +223,10 @@ const Header = () => {
+ + + + + +
)} diff --git a/src/components/beranda/Hero.jsx b/src/components/beranda/Hero.jsx index 0380972..2d5b2bb 100644 --- a/src/components/beranda/Hero.jsx +++ b/src/components/beranda/Hero.jsx @@ -1,6 +1,8 @@ import { homeLogo, waIcon, homeImg } from '../../assets'; +import { useNavigate, Link } from "react-router-dom" function Hero() { + const navigate = useNavigate(); return (
@@ -28,9 +30,13 @@ function Hero() { WhatsApp Icon Konsultasi Gratis - + + + +
diff --git a/src/components/beranda/Kenapa.jsx b/src/components/beranda/Kenapa.jsx index 0b632d3..ccb35c0 100644 --- a/src/components/beranda/Kenapa.jsx +++ b/src/components/beranda/Kenapa.jsx @@ -1,4 +1,5 @@ -import {imgLeft,chek2,waIcon,circle1,circle2} from '../../assets' +import { imgLeft, chek2, waIcon, circle1, circle2 } from '../../assets' +import { Link } from "react-router-dom" function Kenapa() { return ( @@ -52,9 +53,12 @@ function Kenapa() { WhatsApp Icon Konsultasi Gratis - + + +
diff --git a/src/components/beranda/MasaDepan.jsx b/src/components/beranda/MasaDepan.jsx index 17feb85..26fed31 100644 --- a/src/components/beranda/MasaDepan.jsx +++ b/src/components/beranda/MasaDepan.jsx @@ -1,5 +1,8 @@ import React from "react"; import { waIcon } from "../../assets"; +import { Link } from "react-router-dom" + + function MasaDepan() { return ( <> @@ -24,14 +27,17 @@ function MasaDepan() {
{/* Button Section */}
- - -
+ + + + +
diff --git a/src/components/beranda/WhatsAppButon.jsx b/src/components/beranda/WhatsAppButon.jsx index 62c61a9..79d7879 100644 --- a/src/components/beranda/WhatsAppButon.jsx +++ b/src/components/beranda/WhatsAppButon.jsx @@ -2,7 +2,7 @@ import { waButton } from "../../assets"; const WhatsAppButton = () => { return ( -
+
{ + const [isVisible, setIsVisible] = useState(false); + + useEffect(() => { + const handleScroll = () => { + const scrollY = window.scrollY; + const triggerHeight = window.innerHeight / 1.5; + setIsVisible(scrollY > triggerHeight); + }; + + window.addEventListener("scroll", handleScroll); + return () => window.removeEventListener("scroll", handleScroll); + }, []); + return (
- {/* Bagian ini untuk menampilkan teks yang memberi tahu pengguna bahwa mereka bisa menghubungi jika masih ada pertanyaan */} -
+ {/* Animasi teks turun dari atas saat di-scroll */} +

Masih punya pertanyaan seputar

- -

- {/* Menampilkan tag #Rekan AI dengan background warna dan teks putih */} +

#Rekan AI - ? + ?

-
+ - {/* Pesan yang memberi tahu pengguna untuk menghubungi jika pertanyaan belum terjawab */} -

- Jika pertanyaan Anda belum terjawab di atas, jangan ragu untuk menghubungi kami melalui formulir
kontak atau email. Kami dengan senang hati akan membantu! -

+ + Jika pertanyaan Anda belum terjawab di atas, jangan ragu untuk menghubungi kami melalui formulir
+ kontak atau email. Kami dengan senang hati akan membantu! + - {/* Bagian tombol CTA */} -
- - +
-
); }; diff --git a/src/components/contact/CustomerService.jsx b/src/components/contact/CustomerService.jsx index 9d6c9b9..3492ac7 100644 --- a/src/components/contact/CustomerService.jsx +++ b/src/components/contact/CustomerService.jsx @@ -1,10 +1,33 @@ import { email, phone, customer } from "./asset"; +import { motion } from "framer-motion"; +import { useEffect } from "react"; +import { useInView } from "react-intersection-observer"; const CustomerService = () => { + const { ref: leftRef, inView: leftInView } = useInView({ triggerOnce: false, threshold: 0.2 }); + const { ref: rightRef, inView: rightInView } = useInView({ triggerOnce: false, threshold: 0.2 }); + + const fadeInLeft = { + hidden: { opacity: 0, x: -100 }, + visible: { opacity: 1, x: 0, transition: { duration: 0.8 } }, + }; + + const fadeInRight = { + hidden: { opacity: 0, x: 100 }, + visible: { opacity: 1, x: 0, transition: { duration: 0.8 } }, + }; + return ( -
+
{/* LEFT SECTION - Informasi */} -
+

Kami Siap Membantu Bisnis Anda @@ -50,16 +73,23 @@ const CustomerService = () => {

-
+ {/* RIGHT SECTION - Gambar */} -
+ Customer Service -
+ ); }; diff --git a/src/components/contact/FAQSection.jsx b/src/components/contact/FAQSection.jsx index ba7e200..6eb86a5 100644 --- a/src/components/contact/FAQSection.jsx +++ b/src/components/contact/FAQSection.jsx @@ -1,118 +1,37 @@ -import { useState } from "react"; +import { useState, useEffect } from "react"; +import { useLocation } from "react-router-dom"; +import { useInView } from "react-intersection-observer"; const FAQ = () => { - // State untuk menyimpan indeks pertanyaan yang sedang dibuka - // Jika tidak ada pertanyaan yang terbuka, nilai adalah null + const location = useLocation(); const [openQuestion, setOpenQuestion] = useState(null); - // Fungsi untuk membuka atau menutup pertanyaan berdasarkan indeks - // Jika pertanyaan yang sama diklik lagi, tutup pertanyaan tersebut + useEffect(() => { + if (location.hash) { + const element = document.querySelector(location.hash); + if (element) { + element.scrollIntoView({ behavior: "smooth" }); + } + } + }, [location]); + const toggleQuestion = (index) => { - // Cek apakah pertanyaan yang sama diklik - // Jika iya, tutup (set openQuestion ke null), jika tidak, buka pertanyaan tersebut setOpenQuestion(openQuestion === index ? null : index); }; - // Data FAQ yang berisi array objek dengan pertanyaan dan jawaban const faqData = [ - { - question: "Apa itu Rekan AI?", - answer: ( -

- Rekan AI adalah platform teknologi kecerdasan buatan (AI) yang - menyediakan solusi berbasis AI untuk meningkatkan efisiensi - operasional, analisis data, dan pengalaman pelanggan bagi UMKM hingga - perusahaan besar. -

- ), - }, - { - question: "Apa saja produk yang ditawarkan oleh Rekan AI?", - answer: ( -
-

Kami menawarkan beberapa produk unggulan, termasuk:

-
    -
  • - Rekan Doku: Solusi autentikasi dan manajemen dokumen digital. -
    • -
  • Rekan HR: Automasi dan optimalisasi proses HR.
    • -
  • - Rekan LLM: AI berbasis model bahasa besar untuk analisis dan - komunikasi. -
    • -
  • Rekan Veri: Verifikasi data yang cepat dan akurat.
    • -
-
- ), - }, - { - question: "Bagaimana cara menghubungi tim Rekan AI?", - answer: ( -
-

Anda dapat menghubungi kami melalui:

-
    -
  • Email: support@rekanai.com
    • -
  • Telepon: (+62) 123-4567-890
    • -
  • WhatsApp: (+62) 812-3456-7890
    • -
-
- ), - }, - { - question: "Apakah solusi Rekan AI mudah diimplementasikan?", - answer: ( -

- Ya, produk kami dirancang untuk integrasi yang mulus dengan sistem - bisnis Anda yang sudah ada. Kami juga menyediakan dukungan teknis - untuk memastikan implementasi berjalan lancar. -

- ), - }, - { - question: "Apakah Rekan AI cocok untuk UMKM?", - answer: ( -

- Tentu saja! Kami menawarkan solusi yang terjangkau, mudah digunakan, - dan dapat membantu UMKM meningkatkan efisiensi, mengurangi biaya - operasional, dan mempercepat pertumbuhan. -

- ), - }, - { - question: "Bagaimana dengan keamanan data?", - answer: ( -

- Keamanan adalah prioritas kami. Semua produk Rekan AI menggunakan - teknologi enkripsi canggih untuk melindungi data Anda dari ancaman - cyber. -

- ), - }, - { - question: "Bagaimana saya memulai menggunakan produk Rekan AI?", - answer: ( -

- Anda dapat memulai dengan menghubungi tim kami untuk demo produk atau - konsultasi gratis. Kami akan membantu Anda menemukan solusi yang - paling sesuai dengan kebutuhan bisnis Anda. -

- ), - }, - { - question: "Apakah Rekan AI memiliki paket harga yang bisa dipilih?", - answer: ( -

- Ya, kami dapat memberikan paket harga terbaik untuk solusi produk yang - Anda pilih. Informasi lebih lanjut silakan hubungi kami dan - konsultasikan kebutuhan Anda secara gratis. -

- ), - }, + { question: "Apa itu Rekan AI?", answer:

Rekan AI adalah platform teknologi kecerdasan buatan (AI) yang menyediakan solusi berbasis AI untuk meningkatkan efisiensi operasional, analisis data, dan pengalaman pelanggan bagi UMKM hingga perusahaan besar.

}, + { question: "Apa saja produk yang ditawarkan oleh Rekan AI?", answer:

Kami menawarkan beberapa produk unggulan, termasuk:

  • Rekan Doku: Solusi autentikasi dan manajemen dokumen digital.
  • Rekan HR: Automasi dan optimalisasi proses HR.
  • Rekan LLM: AI berbasis model bahasa besar untuk analisis dan komunikasi.
  • Rekan Veri: Verifikasi data yang cepat dan akurat.
}, + { question: "Bagaimana cara menghubungi tim Rekan AI?", answer:

Anda dapat menghubungi kami melalui:

  • Email: support@rekanai.com
  • Telepon: (+62) 123-4567-890
  • WhatsApp: (+62) 812-3456-7890
}, + { question: "Apakah solusi Rekan AI mudah diimplementasikan?", answer:

Ya, produk kami dirancang untuk integrasi yang mulus dengan sistem bisnis Anda yang sudah ada. Kami juga menyediakan dukungan teknis untuk memastikan implementasi berjalan lancar.

}, + { question: "Apakah Rekan AI cocok untuk UMKM?", answer:

Tentu saja! Kami menawarkan solusi yang terjangkau, mudah digunakan, dan dapat membantu UMKM meningkatkan efisiensi, mengurangi biaya operasional, dan mempercepat pertumbuhan.

}, + { question: "Bagaimana dengan keamanan data?", answer:

Keamanan adalah prioritas kami. Semua produk Rekan AI menggunakan teknologi enkripsi canggih untuk melindungi data Anda dari ancaman cyber.

}, + { question: "Bagaimana saya memulai menggunakan produk Rekan AI?", answer:

Anda dapat memulai dengan menghubungi tim kami untuk demo produk atau konsultasi gratis. Kami akan membantu Anda menemukan solusi yang paling sesuai dengan kebutuhan bisnis Anda.

}, + { question: "Apakah Rekan AI memiliki paket harga yang bisa dipilih?", answer:

Ya, kami dapat memberikan paket harga terbaik untuk solusi produk yang Anda pilih. Informasi lebih lanjut silakan hubungi kami dan konsultasikan kebutuhan Anda secara gratis.

}, ]; return ( -
- {/* Judul halaman FAQ */} +

Frequently Asked Questions @@ -122,33 +41,37 @@ const FAQ = () => {

- {/* Bagian FAQ */}
- {faqData.map((item, index) => ( -
- {/* Bagian untuk menampilkan pertanyaan dan tanda buka/tutup */} -
toggleQuestion(index)} // Ketika pertanyaan diklik, panggil toggleQuestion - > - {item.question} - {openQuestion === index ? "–" : "+"} {/* Tampilkan tanda buka atau tutup */} -
+ {faqData.map((item, index) => { + const { ref, inView } = useInView({ threshold: 0.1 }); - {/* Bagian untuk menampilkan jawaban jika pertanyaan ini terbuka */} - {openQuestion === index && ( -
- {item.answer} + return ( +
+
toggleQuestion(index)} + > + {item.question} + {openQuestion === index ? "–" : "+"}
- )} -
- ))} + + {openQuestion === index && ( +
+ {item.answer} +
+ )} +
+ ); + })}
); diff --git a/src/components/contact/Footer.jsx b/src/components/contact/Footer.jsx index 3f2cc4f..f97ca64 100644 --- a/src/components/contact/Footer.jsx +++ b/src/components/contact/Footer.jsx @@ -35,13 +35,7 @@ function Footer() {

-

- Jl. Anggrek No.6, Sawah Lama, Kec. -
- Ciputat, Kota Tangerang Selatan, Banten -
- 15413 -

+

Lebih dekat dengan Kami

{/* Tautan ke media sosial */} @@ -73,7 +67,7 @@ function Footer() {

Solusi Kami

  • Personal
    • -
  • UMKM
    • +
  • Startup
  • Corporate Business
diff --git a/src/components/contact/Form/FormSection.jsx b/src/components/contact/FormSection.jsx similarity index 75% rename from src/components/contact/Form/FormSection.jsx rename to src/components/contact/FormSection.jsx index 012171b..010e8a5 100644 --- a/src/components/contact/Form/FormSection.jsx +++ b/src/components/contact/FormSection.jsx @@ -1,14 +1,31 @@ -import { useState } from "react"; -import { img10 } from "../asset"; // Pastikan img10 ada dan benar path-nya +import { img10 } from "./asset"; // Pastikan img10 ada dan benar path-nya import ReCAPTCHA from "react-google-recaptcha"; // Pastikan penulisan benar (ReCAPTCHA) -import useRecaptcha from './useRecaptcha'; +import useRecaptcha from './Recaptcha/useRecaptcha'; +import { useLocation } from "react-router-dom"; +import { useEffect } from "react"; +import { motion } from "framer-motion"; // Impor motion dari framer-motion const ContactForm = () => { - const { capchaToken, recaptchaRef, handleRecaptcha } = useRecaptcha(); + 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 ( -
{ >
{/* Bagian Kiri */} -
+

Isi formulir di samping ini dan kami akan menghubungi Anda secepat mungkin

Kami percaya bahwa kolaborasi adalah kunci kesuksesan. Hubungi kami hari ini, dan mari wujudkan masa depan bisnis Anda bersama Rekan AI!

-
+ {/* Bagian Form */} -
+

Hubungi Tim Terbaik Kami

@@ -89,7 +118,7 @@ const ContactForm = () => {
{
{/* ReCAPTCHA */} -
+ -
+ -
+
-
+ ); }; diff --git a/src/components/contact/Form/useRecaptcha.js b/src/components/contact/Recaptcha/useRecaptcha.js similarity index 100% rename from src/components/contact/Form/useRecaptcha.js rename to src/components/contact/Recaptcha/useRecaptcha.js diff --git a/src/components/contact/asset/index.js b/src/components/contact/asset/index.js index 38a7926..7439b71 100644 --- a/src/components/contact/asset/index.js +++ b/src/components/contact/asset/index.js @@ -18,9 +18,8 @@ import telephone from './telephone.png'; import wagreen from './whatsapp-color_svgrepo.com.png'; import wabutton from './Whatsapp22.png'; import x from './x.png'; -import arrowform from './Dribbble-Light-Preview.png'; export{ - row,component11,customer,email,facebook,frame,frame27,img10,instagram,kmn,kominfo,Logo1,nvidia,ojk,phone,search,telephone,wagreen,wabutton,x,arrowform + row,component11,customer,email,facebook,frame,frame27,img10,instagram,kmn,kominfo,Logo1,nvidia,ojk,phone,search,telephone,wagreen,wabutton,x } \ No newline at end of file diff --git a/src/components/solusi/HeadCorporate/HeadCorporate.jsx b/src/components/solusi/HeadCorporate/HeadCorporate.jsx index c16f348..fdcb9b5 100644 --- a/src/components/solusi/HeadCorporate/HeadCorporate.jsx +++ b/src/components/solusi/HeadCorporate/HeadCorporate.jsx @@ -1,5 +1,5 @@ +import { Link } from "react-router-dom"; import { component11, wagreen, hc } from "../asset"; - export default function HeadCorporate() { return (
@@ -44,9 +44,11 @@ export default function HeadCorporate() { WhatsApp Icon Konsultasi Gratis - + + +
diff --git a/src/components/solusi/HeadPersonal/HeadPersonal.jsx b/src/components/solusi/HeadPersonal/HeadPersonal.jsx index 013255d..76bced6 100644 --- a/src/components/solusi/HeadPersonal/HeadPersonal.jsx +++ b/src/components/solusi/HeadPersonal/HeadPersonal.jsx @@ -1,4 +1,5 @@ import { component11, wagreen, start22 } from "../asset"; +import { Link } from "react-router-dom"; export default function HeadPersonal() { return ( @@ -6,7 +7,7 @@ export default function HeadPersonal() {
{/* Left Column */}
- {/* Logo and Tagline */} + {/* Logo and Tagline */}
Logo @@ -42,13 +43,16 @@ export default function HeadPersonal() { {/* Buttons - Ensure they come last on mobile */}
- - + + + +
diff --git a/src/components/solusi/HeadStartup/HeadStartup.jsx b/src/components/solusi/HeadStartup/HeadStartup.jsx index 245fc23..91ca8f2 100644 --- a/src/components/solusi/HeadStartup/HeadStartup.jsx +++ b/src/components/solusi/HeadStartup/HeadStartup.jsx @@ -1,5 +1,5 @@ import { component11, wagreen, hs } from "../asset"; - +import { Link } from "react-router-dom"; export default function HeadPersonal() { return (
@@ -44,9 +44,11 @@ export default function HeadPersonal() { WhatsApp Icon Konsultasi Gratis + +
diff --git a/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx b/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx index 502655e..39443fe 100644 --- a/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx +++ b/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx @@ -1,8 +1,8 @@ +import { Link } from "react-router-dom" import { chek2, wagreen, start33, start44, start55 } from "../asset" - function Kenapa() { return ( -
+
{/* Image Section */}
@@ -15,9 +15,9 @@ function Kenapa() { {/* Text Section */}
-

Mengapa Rekan AI untuk Corporate Business?

-

- 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. +

Mengapa Rekan AI untuk Corporate Business?

+

+ 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.

  • @@ -41,9 +41,11 @@ function Kenapa() { /> Konsultasi Gratis - + + +
diff --git a/src/components/solusi/MengapaStartup/MengapaStartup.jsx b/src/components/solusi/MengapaStartup/MengapaStartup.jsx index 17f7f54..6a86a2f 100644 --- a/src/components/solusi/MengapaStartup/MengapaStartup.jsx +++ b/src/components/solusi/MengapaStartup/MengapaStartup.jsx @@ -1,8 +1,8 @@ +import { Link } from "react-router-dom" import { chek2, wagreen, start44 } from "../asset" - function Kenapa() { return ( -
+
{/* Image Section */}
@@ -15,8 +15,8 @@ function Kenapa() { {/* Text Section */}
-

Kenapa Memilih Rekan AI untuk Startup Anda?

-

+

Kenapa Memilih Rekan AI untuk Startup Anda?

+

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.

    @@ -43,9 +43,11 @@ function Kenapa() { /> Konsultasi Gratis + +
diff --git a/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx b/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx index 67d2d0a..ba0b6ff 100644 --- a/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx +++ b/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx @@ -1,8 +1,8 @@ import { chek2, wagreen, start33 } from "../asset" - +import { Link } from "react-router-dom" function Kenapa() { return ( -
+
{/* Image Section */}
@@ -15,8 +15,8 @@ function Kenapa() { {/* Text Section */}
-

Mengapa Memilih Rekan AI untuk Penggunaan Pribadi?

-

+

Mengapa Memilih Rekan AI untuk Penggunaan Pribadi?

+

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 - + + +

diff --git a/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx b/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx index e5568ef..22da617 100644 --- a/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx +++ b/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx @@ -19,7 +19,7 @@ export default function BusinessSolution() { }, []); return ( -
+
{/* Header */}

{data.title}

@@ -83,4 +83,4 @@ export default function BusinessSolution() { )}
); -} +} \ No newline at end of file diff --git a/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx b/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx index e5568ef..e40f5ce 100644 --- a/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx +++ b/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx @@ -9,17 +9,17 @@ export default function BusinessSolution() { // Detect mobile screen size useEffect(() => { const handleResize = () => { - setIsMobile(window.innerWidth < 768); // Set to true if screen width is less than 768px + setIsMobile(window.innerWidth < 768); // Set true jika lebar layar < 768px }; window.addEventListener("resize", handleResize); - handleResize(); // Initialize state on component mount + handleResize(); // Inisialisasi state saat pertama kali mount - return () => window.removeEventListener("resize", handleResize); // Cleanup on unmount + return () => window.removeEventListener("resize", handleResize); }, []); return ( -
+
{/* Header */}

{data.title}

@@ -27,8 +27,8 @@ export default function BusinessSolution() {
{/* Navigation Buttons */} -
-
+
+
{data.tabs.map((button) => ( + +
diff --git a/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx b/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx index f32746b..1c57299 100644 --- a/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx +++ b/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx @@ -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() { WhatsApp Icon Konsultasi Gratis + +
diff --git a/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx b/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx index dc3f49e..569fce6 100644 --- a/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx +++ b/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx @@ -1,5 +1,5 @@ import { wagreen } from "../asset"; - +import { Link } from "react-router-dom"; function Transformasi() { return ( <> @@ -31,9 +31,11 @@ function Transformasi() { WhatsApp Icon Konsultasi Gratis + +
diff --git a/src/components/solusi/TransformasiStart/TransformasiStart.jsx b/src/components/solusi/TransformasiStart/TransformasiStart.jsx index fe44781..def22cc 100644 --- a/src/components/solusi/TransformasiStart/TransformasiStart.jsx +++ b/src/components/solusi/TransformasiStart/TransformasiStart.jsx @@ -1,5 +1,5 @@ +import { Link } from "react-router-dom"; import { wagreen } from "../asset"; - function Transformasi() { return ( <> @@ -31,9 +31,11 @@ function Transformasi() { WhatsApp Icon Konsultasi Gratis + +
diff --git a/src/pages/Contact.jsx b/src/pages/Contact.jsx index ceca7cd..27a8eb7 100644 --- a/src/pages/Contact.jsx +++ b/src/pages/Contact.jsx @@ -1,10 +1,10 @@ import Header from "../components/beranda/Header" import CustomerService from "../components/contact/CustomerService" -import FormSection from "../components/contact/Form/FormSection" +import FormSection from "../components/contact/FormSection" import FAQSection from "../components/contact/FAQSection" import BottomCTA from "../components/contact/BottomCTA" import WhatsAppButton from "../components/beranda/WhatsAppButon" -import Footer from "../components/contact/Footer" +import Footer from "../components/beranda/Footer" function Contact() { return ( <> diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx index 25655ce..1b683dd 100644 --- a/src/pages/Home.jsx +++ b/src/pages/Home.jsx @@ -1,31 +1,31 @@ -import Header from "../components/beranda/Header" -import Hero from "../components/beranda/Hero" -import Solusi from "../components/beranda/Solusi" -import Banner from "../components/beranda/Banner" -import Kenapa from "../components/beranda/Kenapa" -import Mitra from '../components/beranda/Mitra' -import Mendukung from "../components/beranda/Mendukung" -import Footer from "../components/contact/Footer" -import MasaDepan from "../components/beranda/MasaDepan" -import WhatsAppButton from "../components/beranda/WhatsAppButon" - +import { BrowserRouter as Router, Routes, Route } from 'react-router-dom'; +import Header from "../components/beranda/Header"; +import Hero from "../components/beranda/Hero"; +import Solusi from "../components/beranda/Solusi"; +import Banner from "../components/beranda/Banner"; +import Kenapa from "../components/beranda/Kenapa"; +import Mitra from '../components/beranda/Mitra'; +import Mendukung from "../components/beranda/Mendukung"; +import Footer from "../components/beranda/Footer"; +import MasaDepan from "../components/beranda/MasaDepan"; +import WhatsAppButton from "../components/beranda/WhatsAppButon"; function Home() { return ( <> -
- - - - - - - -
- +
+ + + + + + + +
+ - - ) + ); } -export default Home \ No newline at end of file + +export default Home; diff --git a/src/pages/SolusiCorporate.jsx b/src/pages/SolusiCorporate.jsx index 246ee96..eb8b667 100644 --- a/src/pages/SolusiCorporate.jsx +++ b/src/pages/SolusiCorporate.jsx @@ -5,7 +5,7 @@ import MengapaCorporate from '../components/solusi/MengapaCorporate/MengapaCorpo import SolusiCorporate from '../components/solusi/SolusiCorporate/SolusiCorporate' import TransformasiCorpo from '../components/solusi/TransformasiCorpo/TransformasiCorpo' import WhatsAppButton from "../components/beranda/WhatsAppButon" -import Footer from "../components/contact/Footer" +import Footer from "../components/beranda/Footer" function Contact() { return ( <> diff --git a/src/pages/SolusiPersonal.jsx b/src/pages/SolusiPersonal.jsx index eeff1f9..1c3ce18 100644 --- a/src/pages/SolusiPersonal.jsx +++ b/src/pages/SolusiPersonal.jsx @@ -5,7 +5,7 @@ import MengapapPersonal from '../components/solusi/MengapapPersonal/MengapapPers import SolusiPersonal from '../components/solusi/SolusiPersonal/SolusiPersonal' import TransformasiPersonal from '../components/solusi/TransformasiPersonal/TransformasiPersonal' import WhatsAppButton from "../components/beranda/WhatsAppButon" -import Footer from "../components/contact/Footer" +import Footer from "../components/beranda/Footer" function Contact() { return ( <> diff --git a/src/pages/SolusiStartup.jsx b/src/pages/SolusiStartup.jsx index a6d59d8..50f954b 100644 --- a/src/pages/SolusiStartup.jsx +++ b/src/pages/SolusiStartup.jsx @@ -1,7 +1,7 @@ import Header from "../components/beranda/Header" import HeadStartup from '../components/solusi/HeadStartup/HeadStartup' import WhatsAppButton from "../components/beranda/WhatsAppButon" -import Footer from "../components/contact/Footer" +import Footer from "../components/beranda/Footer" import CardStartup from "../components/solusi/CardStartup/CardStartup" import MengapaStartup from "../components/solusi/MengapaStartup/MengapaStartup" import SolusiStartup from "../components/solusi/SolusiStartup/SolusiStartup" From f054fe56c320b282429bf97897e1255a4be7dbcc Mon Sep 17 00:00:00 2001 From: Carls2320 Date: Mon, 17 Feb 2025 13:28:07 +0700 Subject: [PATCH 4/8] fresssss --- src/components/solusi/SolusiPersonal/SolusiPersonal.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx b/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx index e40f5ce..05fb444 100644 --- a/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx +++ b/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx @@ -19,7 +19,7 @@ export default function BusinessSolution() { }, []); return ( -
+
{/* Header */}

{data.title}

From b5b04505b9cb00134b1aa95782b77758288555cb Mon Sep 17 00:00:00 2001 From: Carls2320 Date: Mon, 17 Feb 2025 13:48:26 +0700 Subject: [PATCH 6/8] sisa animasi --- package-lock.json | 101 +++-------- src/components/beranda/Hero.jsx | 10 +- src/components/contact/BottomCTA.jsx | 68 ++------ src/components/contact/FAQSection.jsx | 163 +++++++++++++----- src/components/contact/FormSection.jsx | 2 +- .../SolusiCorporate/SolusiCorporate.jsx | 2 +- .../solusi/SolusiStartup/SolusiStartup.jsx | 2 +- 7 files changed, 174 insertions(+), 174 deletions(-) diff --git a/package-lock.json b/package-lock.json index 8f717b1..3dfee1a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4575,10 +4575,13 @@ "license": "MIT" }, "node_modules/react": { - "version": "19.0.0", - "resolved": "https://registry.npmjs.org/react/-/react-19.0.0.tgz", - "integrity": "sha512-V8AVnmPIICiWpGfm6GLzCR/W5FXLchHop40W4nXBmdlEceh16rCN8O8LNWm5bh5XUX91fh7KpA+W0TgMKmgTpQ==", + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", + "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", "license": "MIT", + "dependencies": { + "loose-envify": "^1.1.0" + }, "engines": { "node": ">=0.10.0" } @@ -4597,71 +4600,16 @@ } }, "node_modules/react-dom": { - "version": "19.0.0", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.0.0.tgz", - "integrity": "sha512-4GV5sHFG0e/0AD4X+ySy6UJd3jVl1iNsNHdpad0qhABJ11twS3TTBnseqsKurKcsNqCEFeGL3uLpVChpIO3QfQ==", + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", + "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", "license": "MIT", "dependencies": { - "scheduler": "^0.25.0" + "loose-envify": "^1.1.0", + "scheduler": "^0.23.2" }, "peerDependencies": { - "react": "^19.0.0" - } - }, - "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-intersection-observer": { - "version": "9.15.1", - "resolved": "https://registry.npmjs.org/react-intersection-observer/-/react-intersection-observer-9.15.1.tgz", - "integrity": "sha512-vGrqYEVWXfH+AGu241uzfUpNK4HAdhCkSAyFdkMb9VWWXs6mxzBLpWCxEy9YcnDNY2g9eO6z7qUtTBdA9hc8pA==", - "license": "MIT", - "peerDependencies": { - "react": "^17.0.0 || ^18.0.0 || ^19.0.0", - "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0" - }, - "peerDependenciesMeta": { - "react-dom": { - "optional": true - } - } - }, - "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-intersection-observer": { - "version": "9.15.1", - "resolved": "https://registry.npmjs.org/react-intersection-observer/-/react-intersection-observer-9.15.1.tgz", - "integrity": "sha512-vGrqYEVWXfH+AGu241uzfUpNK4HAdhCkSAyFdkMb9VWWXs6mxzBLpWCxEy9YcnDNY2g9eO6z7qUtTBdA9hc8pA==", - "license": "MIT", - "peerDependencies": { - "react": "^17.0.0 || ^18.0.0 || ^19.0.0", - "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0" - }, - "peerDependenciesMeta": { - "react-dom": { - "optional": true - } + "react": "^18.3.1" } }, "node_modules/react-google-recaptcha": { @@ -4709,9 +4657,9 @@ } }, "node_modules/react-router": { - "version": "7.1.5", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.1.5.tgz", - "integrity": "sha512-8BUF+hZEU4/z/JD201yK6S+UYhsf58bzYIDq2NS1iGpwxSXDu7F+DeGSkIXMFBuHZB21FSiCzEcUb18cQNdRkA==", + "version": "7.1.3", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.1.3.tgz", + "integrity": "sha512-EezYymLY6Guk/zLQ2vRA8WvdUhWFEj5fcE3RfWihhxXBW7+cd1LsIiA3lmx+KCmneAGQuyBv820o44L2+TtkSA==", "license": "MIT", "dependencies": { "@types/cookie": "^0.6.0", @@ -4733,12 +4681,12 @@ } }, "node_modules/react-router-dom": { - "version": "7.1.5", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.1.5.tgz", - "integrity": "sha512-/4f9+up0Qv92D3bB8iN5P1s3oHAepSGa9h5k6tpTFlixTTskJZwKGhJ6vRJ277tLD1zuaZTt95hyGWV1Z37csQ==", + "version": "7.1.3", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.1.3.tgz", + "integrity": "sha512-qQGTE+77hleBzv9SIUIkGRvuFBQGagW+TQKy53UTZAO/3+YFNBYvRsNIZ1GT17yHbc63FylMOdS+m3oUriF1GA==", "license": "MIT", "dependencies": { - "react-router": "7.1.5" + "react-router": "7.1.3" }, "engines": { "node": ">=20.0.0" @@ -4973,10 +4921,13 @@ } }, "node_modules/scheduler": { - "version": "0.25.0", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.25.0.tgz", - "integrity": "sha512-xFVuu11jh+xcO7JOAGJNOXld8/TcEHK/4CituBUeUb5hqxJLj9YuemAEuvm9gQ/+pgXYfbQuqAkiYu+u7YEsNA==", - "license": "MIT" + "version": "0.23.2", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz", + "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==", + "license": "MIT", + "dependencies": { + "loose-envify": "^1.1.0" + } }, "node_modules/semver": { "version": "6.3.1", diff --git a/src/components/beranda/Hero.jsx b/src/components/beranda/Hero.jsx index c5fc0f4..c933578 100644 --- a/src/components/beranda/Hero.jsx +++ b/src/components/beranda/Hero.jsx @@ -30,9 +30,13 @@ function Hero() { WhatsApp Icon Konsultasi Gratis - + + + +
diff --git a/src/components/contact/BottomCTA.jsx b/src/components/contact/BottomCTA.jsx index 588a5aa..61c716c 100644 --- a/src/components/contact/BottomCTA.jsx +++ b/src/components/contact/BottomCTA.jsx @@ -1,71 +1,39 @@ import { wagreen } from "./asset"; // Import gambar WhatsApp untuk ikon -import { motion } from "framer-motion"; -import { useEffect, useState } from "react"; const BottomCTA = () => { - const [isVisible, setIsVisible] = useState(false); - - useEffect(() => { - const handleScroll = () => { - const scrollY = window.scrollY; - const triggerHeight = window.innerHeight / 1.5; - setIsVisible(scrollY > triggerHeight); - }; - - window.addEventListener("scroll", handleScroll); - return () => window.removeEventListener("scroll", handleScroll); - }, []); - return (
- {/* Animasi teks turun dari atas saat di-scroll */} - + {/* Bagian ini untuk menampilkan teks yang memberi tahu pengguna bahwa mereka bisa menghubungi jika masih ada pertanyaan */} +

Masih punya pertanyaan seputar

-

+ +

+ {/* Menampilkan tag #Rekan AI dengan background warna dan teks putih */} #Rekan AI - ? + ?

- +
- - Jika pertanyaan Anda belum terjawab di atas, jangan ragu untuk menghubungi kami melalui formulir
- kontak atau email. Kami dengan senang hati akan membantu! - + {/* Pesan yang memberi tahu pengguna untuk menghubungi jika pertanyaan belum terjawab */} +

+ Jika pertanyaan Anda belum terjawab di atas, jangan ragu untuk menghubungi kami melalui formulir
kontak atau email. Kami dengan senang hati akan membantu! +

- {/* Animasi tombol keluar dari kanan dan kiri saat di-scroll */} -
- + {/* Bagian tombol CTA */} +
+ +
+
); }; diff --git a/src/components/contact/FAQSection.jsx b/src/components/contact/FAQSection.jsx index e60b1c4..6b2883a 100644 --- a/src/components/contact/FAQSection.jsx +++ b/src/components/contact/FAQSection.jsx @@ -16,28 +16,109 @@ const FAQ = () => { // Jika tidak ada pertanyaan yang terbuka, nilai adalah null const [openQuestion, setOpenQuestion] = useState(null); - useEffect(() => { - if (location.hash) { - const element = document.querySelector(location.hash); - if (element) { - element.scrollIntoView({ behavior: "smooth" }); - } - } - }, [location]); - + // Fungsi untuk membuka atau menutup pertanyaan berdasarkan indeks + // Jika pertanyaan yang sama diklik lagi, tutup pertanyaan tersebut const toggleQuestion = (index) => { + // Cek apakah pertanyaan yang sama diklik + // Jika iya, tutup (set openQuestion ke null), jika tidak, buka pertanyaan tersebut setOpenQuestion(openQuestion === index ? null : index); }; + // Data FAQ yang berisi array objek dengan pertanyaan dan jawaban const faqData = [ - { question: "Apa itu Rekan AI?", answer:

Rekan AI adalah platform teknologi kecerdasan buatan (AI) yang menyediakan solusi berbasis AI untuk meningkatkan efisiensi operasional, analisis data, dan pengalaman pelanggan bagi UMKM hingga perusahaan besar.

}, - { question: "Apa saja produk yang ditawarkan oleh Rekan AI?", answer:

Kami menawarkan beberapa produk unggulan, termasuk:

  • Rekan Doku: Solusi autentikasi dan manajemen dokumen digital.
  • Rekan HR: Automasi dan optimalisasi proses HR.
  • Rekan LLM: AI berbasis model bahasa besar untuk analisis dan komunikasi.
  • Rekan Veri: Verifikasi data yang cepat dan akurat.
}, - { question: "Bagaimana cara menghubungi tim Rekan AI?", answer:

Anda dapat menghubungi kami melalui:

  • Email: support@rekanai.com
  • Telepon: (+62) 123-4567-890
  • WhatsApp: (+62) 812-3456-7890
}, - { question: "Apakah solusi Rekan AI mudah diimplementasikan?", answer:

Ya, produk kami dirancang untuk integrasi yang mulus dengan sistem bisnis Anda yang sudah ada. Kami juga menyediakan dukungan teknis untuk memastikan implementasi berjalan lancar.

}, - { question: "Apakah Rekan AI cocok untuk UMKM?", answer:

Tentu saja! Kami menawarkan solusi yang terjangkau, mudah digunakan, dan dapat membantu UMKM meningkatkan efisiensi, mengurangi biaya operasional, dan mempercepat pertumbuhan.

}, - { question: "Bagaimana dengan keamanan data?", answer:

Keamanan adalah prioritas kami. Semua produk Rekan AI menggunakan teknologi enkripsi canggih untuk melindungi data Anda dari ancaman cyber.

}, - { question: "Bagaimana saya memulai menggunakan produk Rekan AI?", answer:

Anda dapat memulai dengan menghubungi tim kami untuk demo produk atau konsultasi gratis. Kami akan membantu Anda menemukan solusi yang paling sesuai dengan kebutuhan bisnis Anda.

}, - { question: "Apakah Rekan AI memiliki paket harga yang bisa dipilih?", answer:

Ya, kami dapat memberikan paket harga terbaik untuk solusi produk yang Anda pilih. Informasi lebih lanjut silakan hubungi kami dan konsultasikan kebutuhan Anda secara gratis.

}, + { + question: "Apa itu Rekan AI?", + answer: ( +

+ Rekan AI adalah platform teknologi kecerdasan buatan (AI) yang + menyediakan solusi berbasis AI untuk meningkatkan efisiensi + operasional, analisis data, dan pengalaman pelanggan bagi UMKM hingga + perusahaan besar. +

+ ), + }, + { + question: "Apa saja produk yang ditawarkan oleh Rekan AI?", + answer: ( +
+

Kami menawarkan beberapa produk unggulan, termasuk:

+
    +
  • + Rekan Doku: Solusi autentikasi dan manajemen dokumen digital. +
    • +
  • Rekan HR: Automasi dan optimalisasi proses HR.
    • +
  • + Rekan LLM: AI berbasis model bahasa besar untuk analisis dan + komunikasi. +
    • +
  • Rekan Veri: Verifikasi data yang cepat dan akurat.
    • +
+
+ ), + }, + { + question: "Bagaimana cara menghubungi tim Rekan AI?", + answer: ( +
+

Anda dapat menghubungi kami melalui:

+
    +
  • Email: support@rekanai.com
    • +
  • Telepon: (+62) 123-4567-890
    • +
  • WhatsApp: (+62) 812-3456-7890
    • +
+
+ ), + }, + { + question: "Apakah solusi Rekan AI mudah diimplementasikan?", + answer: ( +

+ Ya, produk kami dirancang untuk integrasi yang mulus dengan sistem + bisnis Anda yang sudah ada. Kami juga menyediakan dukungan teknis + untuk memastikan implementasi berjalan lancar. +

+ ), + }, + { + question: "Apakah Rekan AI cocok untuk UMKM?", + answer: ( +

+ Tentu saja! Kami menawarkan solusi yang terjangkau, mudah digunakan, + dan dapat membantu UMKM meningkatkan efisiensi, mengurangi biaya + operasional, dan mempercepat pertumbuhan. +

+ ), + }, + { + question: "Bagaimana dengan keamanan data?", + answer: ( +

+ Keamanan adalah prioritas kami. Semua produk Rekan AI menggunakan + teknologi enkripsi canggih untuk melindungi data Anda dari ancaman + cyber. +

+ ), + }, + { + question: "Bagaimana saya memulai menggunakan produk Rekan AI?", + answer: ( +

+ Anda dapat memulai dengan menghubungi tim kami untuk demo produk atau + konsultasi gratis. Kami akan membantu Anda menemukan solusi yang + paling sesuai dengan kebutuhan bisnis Anda. +

+ ), + }, + { + question: "Apakah Rekan AI memiliki paket harga yang bisa dipilih?", + answer: ( +

+ Ya, kami dapat memberikan paket harga terbaik untuk solusi produk yang + Anda pilih. Informasi lebih lanjut silakan hubungi kami dan + konsultasikan kebutuhan Anda secara gratis. +

+ ), + }, ]; return ( @@ -52,37 +133,33 @@ const FAQ = () => {
+ {/* Bagian FAQ */}
- {faqData.map((item, index) => { - const { ref, inView } = useInView({ threshold: 0.1 }); - - return ( + {faqData.map((item, index) => ( +
+ {/* Bagian untuk menampilkan pertanyaan dan tanda buka/tutup */}
toggleQuestion(index)} // Ketika pertanyaan diklik, panggil toggleQuestion > -
toggleQuestion(index)} - > - {item.question} - {openQuestion === index ? "–" : "+"} -
- - {openQuestion === index && ( -
- {item.answer} -
- )} + {item.question} + {openQuestion === index ? "–" : "+"} {/* Tampilkan tanda buka atau tutup */}
- ); - })} + + {/* Bagian untuk menampilkan jawaban jika pertanyaan ini terbuka */} + {openQuestion === index && ( +
+ {item.answer} +
+ )} +
+ ))}
); diff --git a/src/components/contact/FormSection.jsx b/src/components/contact/FormSection.jsx index 6eee2f5..7fdd515 100644 --- a/src/components/contact/FormSection.jsx +++ b/src/components/contact/FormSection.jsx @@ -39,7 +39,7 @@ const ContactForm = () => { Kami percaya bahwa kolaborasi adalah kunci kesuksesan. Hubungi kami hari ini, dan mari wujudkan masa depan bisnis Anda bersama Rekan AI!

- +
{/* Form Section */}
diff --git a/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx b/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx index 131cdf6..ba6cda8 100644 --- a/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx +++ b/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx @@ -83,4 +83,4 @@ export default function BusinessSolution() { )}
); -} \ No newline at end of file +} diff --git a/src/components/solusi/SolusiStartup/SolusiStartup.jsx b/src/components/solusi/SolusiStartup/SolusiStartup.jsx index 131cdf6..ba6cda8 100644 --- a/src/components/solusi/SolusiStartup/SolusiStartup.jsx +++ b/src/components/solusi/SolusiStartup/SolusiStartup.jsx @@ -83,4 +83,4 @@ export default function BusinessSolution() { )}
); -} \ No newline at end of file +} From 9d420f3b0585cc789dc39b2fd87e27812b4cb56e Mon Sep 17 00:00:00 2001 From: Carls2320 Date: Wed, 19 Feb 2025 10:40:00 +0700 Subject: [PATCH 7/8] animasi 90% --- src/components/beranda/Banner.jsx | 2 +- src/components/beranda/Hero.jsx | 70 +++++++-- src/components/beranda/Kenapa.jsx | 115 +++++++++----- src/components/beranda/MasaDepan.jsx | 68 ++++++--- src/components/beranda/Mendukung.jsx | 52 +++++-- src/components/beranda/Solusi.jsx | 112 ++++++++++---- src/components/contact/BottomCTA.jsx | 43 +++--- src/components/contact/FAQSection.jsx | 101 +++++++++---- src/components/contact/FormSection.jsx | 50 +++++- .../solusi/CardCorporate/CardCorporate.jsx | 75 +++++++-- .../solusi/CardPersonal/CardPersonal.jsx | 75 +++++++-- .../solusi/CardStartup/CardStartup.jsx | 74 +++++++-- .../solusi/HeadCorporate/HeadCorporate.jsx | 67 +++++--- .../solusi/HeadPersonal/HeadPersonal.jsx | 57 +++++-- .../solusi/HeadStartup/HeadStartup.jsx | 65 +++++--- .../MengapaCorporate/MengapaCorporate.jsx | 95 ++++++++---- .../solusi/MengapaStartup/MengapaStartup.jsx | 143 +++++++++++------- .../MengapapPersonal/MengapapPersonal.jsx | 99 ++++++++---- .../TransformasiCorpo/TransformasiCorpo.jsx | 41 +++-- .../TransformasiCorporate.jsx | 43 ------ .../TransformasiPersonal.jsx | 39 +++-- .../TransformasiStart/TransformasiStart.jsx | 37 +++-- 22 files changed, 1063 insertions(+), 460 deletions(-) delete mode 100644 src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx diff --git a/src/components/beranda/Banner.jsx b/src/components/beranda/Banner.jsx index f87256f..553c2a9 100644 --- a/src/components/beranda/Banner.jsx +++ b/src/components/beranda/Banner.jsx @@ -113,4 +113,4 @@ function Banner() { ) } -export default Banner +export default Banner \ No newline at end of file diff --git a/src/components/beranda/Hero.jsx b/src/components/beranda/Hero.jsx index c933578..3fb6105 100644 --- a/src/components/beranda/Hero.jsx +++ b/src/components/beranda/Hero.jsx @@ -1,14 +1,49 @@ import { homeLogo, waIcon, homeImg } from '../../assets'; -import { useNavigate, Link } from "react-router-dom" +import { useNavigate, Link } from "react-router-dom"; +import { motion } from "framer-motion"; +import { useEffect, useState } from "react"; function Hero() { + const [inView, setInView] = useState(false); const navigate = useNavigate(); + + useEffect(() => { + const observer = new IntersectionObserver( + (entries) => { + entries.forEach((entry) => { + if (entry.isIntersecting) { + setInView(true); + } else { + setInView(false); + } + }); + }, + { threshold: 0.2 } + ); + + const target = document.querySelector("#hero-section"); + if (target) { + observer.observe(target); + } + + return () => { + if (target) { + observer.unobserve(target); + } + }; + }, []); + return (
-
+
{/* Left Section */} -
+ Rekan AI Logo

Ciptakan Pengalaman Pelanggan yang Tak Terlupakan dengan Solusi AI dari Rekan AI. @@ -17,27 +52,36 @@ function Hero() { 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.

-

+ - {/* Right Section - Adjust order for mobile */} -
+ {/* Right Section */} + Rekan AI Illustration -
+ - {/* Buttons - Ensure they come last on mobile */} -
+ {/* Buttons */} + - - -
+
diff --git a/src/components/beranda/Kenapa.jsx b/src/components/beranda/Kenapa.jsx index 9514bbe..e0d22cd 100644 --- a/src/components/beranda/Kenapa.jsx +++ b/src/components/beranda/Kenapa.jsx @@ -1,67 +1,114 @@ -import { imgLeft, chek2, waIcon, circle1, circle2 } from '../../assets' -import { Link } from "react-router-dom" +import { imgLeft, chek2, waIcon, circle1, circle2 } from '../../assets'; +import { Link } from "react-router-dom"; +import { motion } from "framer-motion"; +import { useInView } from "react-intersection-observer"; function Kenapa() { + const options = { triggerOnce: false, threshold: 0.2 }; + const { ref: sectionRef, inView: sectionInView } = useInView(options); + const { ref: textRef, inView: textInView } = useInView(options); + const { ref: listRef, inView: listInView } = useInView(options); + const { ref: buttonRef, inView: buttonInView } = useInView(options); + return ( -
-
+
+ {/* Decorative Circles */}
- Circle 1 - Circle 2 + +
{/* Image Section */} -
+ Woman with Tablet -
+ {/* Text Section */} -
+

Kenapa Harus Rekan AI?

-

+

Rekan AI adalah mitra inovasi bisnis Anda dalam menghadapi era digital. Kami menghadirkan teknologi kecerdasan buatan yang dirancang untuk meningkatkan efisiensi operasional, mempercepat proses, dan memberikan wawasan berbasis data yang akurat.

    -
  • - Check - Automasi proses untuk mengurangi biaya dan meningkatkan produktivitas. -
    • -
  • - Check - Analisis data real-time untuk pengambilan keputusan yang lebih tepat. -
    • -
  • - Check - Menciptakan interaksi pelanggan yang lebih relevan dan berkesan. -
    • -
  • - Check - Verifikasi dan autentikasi berbasis AI yang memperkuat keamanan data. -
    • + {[ + "Automasi proses untuk mengurangi biaya dan meningkatkan produktivitas.", + "Analisis data real-time untuk pengambilan keputusan yang lebih tepat.", + "Menciptakan interaksi pelanggan yang lebih relevan dan berkesan.", + "Verifikasi dan autentikasi berbasis AI yang memperkuat keamanan data." + ].map((text, index) => ( + + Check + {text} + + ))}
-
- + - +
-
-
+ +
); } diff --git a/src/components/beranda/MasaDepan.jsx b/src/components/beranda/MasaDepan.jsx index 26fed31..f2097bc 100644 --- a/src/components/beranda/MasaDepan.jsx +++ b/src/components/beranda/MasaDepan.jsx @@ -1,46 +1,72 @@ import React from "react"; +import { motion } from "framer-motion"; import { waIcon } from "../../assets"; -import { Link } from "react-router-dom" - +import { Link } from "react-router-dom"; function MasaDepan() { return ( <> -
- {/* Tagline Section */} + {/* Tagline Section */} +
- + #Rekan AI - -

+ + Masa Depan Bisnis, Dimulai Hari Ini -

+
-

+ Bersama Rekan AI, bawa bisnis Anda menuju masa depan yang lebih cerdas, efisien, dan kompetitif. -

+
+ - -
{/* Button Section */} -
- + - + -
- + - ); } diff --git a/src/components/beranda/Mendukung.jsx b/src/components/beranda/Mendukung.jsx index f66cee6..e534dbd 100644 --- a/src/components/beranda/Mendukung.jsx +++ b/src/components/beranda/Mendukung.jsx @@ -1,7 +1,11 @@ import React from 'react'; +import { motion } from 'framer-motion'; +import { useInView } from 'react-intersection-observer'; import { imgLeft1, imgLeft2, imgLeft3, imgRight } from '../../assets'; function Mendukung() { + const { ref, inView } = useInView({ triggerOnce: false, threshold: 0.2 }); + const items = [ { id: 1, image: imgLeft1, title: 'Personal' }, { id: 2, image: imgLeft2, title: 'UMKM' }, @@ -9,9 +13,22 @@ function Mendukung() { ]; return ( -
+ {/* Left Content */} -
+

Solusi Mendukung Bisnis di Setiap
@@ -22,8 +39,15 @@ function Mendukung() {

- {items.map((item) => ( -
+ {items.map((item, index) => ( + {/* Image */} {item.title}

-
+ ))}
- -
+ {/* Right Content */} -
+ Image Right -
-
- + + ); } -export default Mendukung; +export default Mendukung; \ No newline at end of file diff --git a/src/components/beranda/Solusi.jsx b/src/components/beranda/Solusi.jsx index 7593145..238b001 100644 --- a/src/components/beranda/Solusi.jsx +++ b/src/components/beranda/Solusi.jsx @@ -1,4 +1,36 @@ import { card1, card2, card3, card4, chek } from "../../assets" +import { motion } from "framer-motion" +import { useState, useEffect, useRef } from "react" + +// Custom hook untuk menggunakan Intersection Observer +const useIntersectionObserver = (options = {}) => { + const [isIntersecting, setIsIntersecting] = useState(false) + const ref = useRef(null) + + useEffect(() => { + const observer = new IntersectionObserver( + ([entry]) => { + setIsIntersecting(entry.isIntersecting) + }, + { + threshold: 0.5, // Ketika 50% elemen terlihat + ...options, + } + ) + + if (ref.current) { + observer.observe(ref.current) + } + + return () => { + if (ref.current) { + observer.unobserve(ref.current) + } + } + }, [options]) + + return [ref, isIntersecting] +} function Solusi() { const cards = [ @@ -31,49 +63,67 @@ function Solusi() { return (
-
+

Ragam Solusi Terbaik Dari

#Rekan AI -
-

+ + Kami menyediakan berbagai produk berbasis AI yang dirancang khusus untuk mendukung bisnis Anda dari berbagai aspek. -

+
- {cards.map((card, index) => ( -
- {`Card -

- {card.description} -

-
    - {card.features.map((feature, i) => ( -
  • - Check {feature} -
    • - ))} -
- -
- - ))} + {cards.map((card, index) => { + const [ref, isIntersecting] = useIntersectionObserver({ + threshold: 0.5, // Set threshold when 50% of the element is visible + }) + + return ( + + {`Card +

+ {card.description} +

+
    + {card.features.map((feature, i) => ( +
  • + Check {feature} +
    • + ))} +
+ + + ) + })}
) } export default Solusi - diff --git a/src/components/contact/BottomCTA.jsx b/src/components/contact/BottomCTA.jsx index 61c716c..21dd9cd 100644 --- a/src/components/contact/BottomCTA.jsx +++ b/src/components/contact/BottomCTA.jsx @@ -1,40 +1,47 @@ import { wagreen } from "./asset"; // Import gambar WhatsApp untuk ikon +import { motion } from "framer-motion"; const BottomCTA = () => { return ( -
- {/* Bagian ini untuk menampilkan teks yang memberi tahu pengguna bahwa mereka bisa menghubungi jika masih ada pertanyaan */} +

Masih punya pertanyaan seputar

- -

- {/* Menampilkan tag #Rekan AI dengan background warna dan teks putih */} - +

+ #Rekan AI - ? + ?

- {/* Pesan yang memberi tahu pengguna untuk menghubungi jika pertanyaan belum terjawab */} -

- Jika pertanyaan Anda belum terjawab di atas, jangan ragu untuk menghubungi kami melalui formulir
kontak atau email. Kami dengan senang hati akan membantu! +

+ Jika pertanyaan Anda belum terjawab di atas, jangan ragu untuk menghubungi kami melalui formulir
+ kontak atau email. Kami dengan senang hati akan membantu!

- {/* Bagian tombol CTA */} -
- - +
- -
+ ); }; diff --git a/src/components/contact/FAQSection.jsx b/src/components/contact/FAQSection.jsx index 6b2883a..b0de029 100644 --- a/src/components/contact/FAQSection.jsx +++ b/src/components/contact/FAQSection.jsx @@ -1,30 +1,41 @@ -import { useState, useEffect } from "react"; -import { useLocation } from "react-router-dom"; +"use client" + +import { useState, useEffect } from "react" +import { useLocation } from "react-router-dom" +import { motion, useAnimation } from "framer-motion" +import { useInView } from "react-intersection-observer" const FAQ = () => { - const location = useLocation(); + const location = useLocation() + const controls = useAnimation() + const [ref, inView] = useInView({ + threshold: 0.1, + triggerOnce: false, + }) + + useEffect(() => { + if (inView) { + controls.start("visible") + } else { + controls.start("hidden") + } + }, [controls, inView]) useEffect(() => { if (location.hash) { - const element = document.querySelector(location.hash); + const element = document.querySelector(location.hash) if (element) { - element.scrollIntoView({ behavior: "smooth" }); + 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); + }, [location]) + + const [openQuestion, setOpenQuestion] = useState(null) - // Fungsi untuk membuka atau menutup pertanyaan berdasarkan indeks - // Jika pertanyaan yang sama diklik lagi, tutup pertanyaan tersebut const toggleQuestion = (index) => { - // Cek apakah pertanyaan yang sama diklik - // Jika iya, tutup (set openQuestion ke null), jika tidak, buka pertanyaan tersebut - setOpenQuestion(openQuestion === index ? null : index); - }; + setOpenQuestion(openQuestion === index ? null : index) + } - // Data FAQ yang berisi array objek dengan pertanyaan dan jawaban const faqData = [ { question: "Apa itu Rekan AI?", @@ -119,11 +130,33 @@ const FAQ = () => {

), }, - ]; + ] + + // Animation variants for the container + const containerVariants = { + hidden: { opacity: 0 }, + visible: { + opacity: 1, + transition: { + staggerChildren: 0.5, + }, + }, + } + + // Animation variants for each FAQ item + const itemVariants = { + hidden: { opacity: 0, y: 20 }, + visible: { + opacity: 1, + y: 0, + transition: { + duration: 1, + }, + }, + } return ( -
- {/* Judul halaman FAQ */} +

Frequently Asked Questions @@ -133,36 +166,38 @@ const FAQ = () => {

- {/* Bagian FAQ */} -
+ {faqData.map((item, index) => ( -
- {/* Bagian untuk menampilkan pertanyaan dan tanda buka/tutup */}
toggleQuestion(index)} // Ketika pertanyaan diklik, panggil toggleQuestion + onClick={() => toggleQuestion(index)} > {item.question} - {openQuestion === index ? "–" : "+"} {/* Tampilkan tanda buka atau tutup */} + {openQuestion === index ? "–" : "+"}
- {/* Bagian untuk menampilkan jawaban jika pertanyaan ini terbuka */} {openQuestion === index && (
{item.answer}
)} -
+ ))} -
+
- ); -}; + ) +} -export default FAQ; +export default FAQ diff --git a/src/components/contact/FormSection.jsx b/src/components/contact/FormSection.jsx index 7fdd515..72963db 100644 --- a/src/components/contact/FormSection.jsx +++ b/src/components/contact/FormSection.jsx @@ -1,13 +1,28 @@ +"use client" -import { img10 } from "./asset" -import ReCAPTCHA from "react-google-recaptcha" -import useRecaptcha from "./Recaptcha/useRecaptcha" -import { useLocation } from "react-router-dom" import { useEffect } from "react" +import { useLocation } from "react-router-dom" +import ReCAPTCHA from "react-google-recaptcha" +import { motion, useAnimation } from "framer-motion" +import { useInView } from "react-intersection-observer" +import useRecaptcha from "./Recaptcha/useRecaptcha" +import { img10 } from "./asset" const ContactForm = () => { const { capchaToken, handleRecaptcha } = useRecaptcha() const location = useLocation() + const controls = useAnimation() + const [ref, inView] = useInView({ + threshold: 0.1, // Trigger when 10% of the element is in view + }) + + useEffect(() => { + if (inView) { + controls.start("visible") + } else { + controls.start("hidden") + } + }, [controls, inView]) useEffect(() => { if (location.hash) { @@ -18,6 +33,16 @@ const ContactForm = () => { } }, [location]) + const textVariants = { + hidden: { opacity: 0, x: -50 }, + visible: { opacity: 1, x: 0, transition: { duration: 0.8, ease: "easeOut" } }, + } + + const formVariants = { + hidden: { opacity: 0, y: 50 }, + visible: { opacity: 1, y: 0, transition: { duration: 0.8, ease: "easeOut" } }, + } + return (
{ backgroundPosition: "center", backgroundRepeat: "no-repeat", }} + ref={ref} >
{/* Left Section */} -
+

Isi formulir di samping ini dan kami akan menghubungi Anda secepat mungkin

@@ -39,10 +70,10 @@ const ContactForm = () => { Kami percaya bahwa kolaborasi adalah kunci kesuksesan. Hubungi kami hari ini, dan mari wujudkan masa depan bisnis Anda bersama Rekan AI!

-
+ {/* Form Section */} -
+

Hubungi Tim Terbaik Kami @@ -56,6 +87,7 @@ const ContactForm = () => { type="text" placeholder="Masukkan nama Anda" required + maxLength={50} className="w-full mt-1 p-4 border border-[#5B59E8] rounded-lg focus:ring-2 focus:ring-[#5B59E8] 2xl:p-5" />

@@ -65,6 +97,7 @@ const ContactForm = () => { type="tel" placeholder="Masukkan nomor telepon Anda" required + maxLength={20} className="w-full mt-1 p-4 border border-[#5B59E8] rounded-lg focus:ring-2 focus:ring-[#5B59E8] 2xl:p-5" pattern="[0-9]*" onInput={(e) => { @@ -85,6 +118,7 @@ const ContactForm = () => { @@ -126,7 +160,7 @@ const ContactForm = () => {
-
+
) diff --git a/src/components/solusi/CardCorporate/CardCorporate.jsx b/src/components/solusi/CardCorporate/CardCorporate.jsx index 24cb5c6..0242b70 100644 --- a/src/components/solusi/CardCorporate/CardCorporate.jsx +++ b/src/components/solusi/CardCorporate/CardCorporate.jsx @@ -1,5 +1,36 @@ +import { motion } from "framer-motion"; +import { useEffect, useState, useRef } from "react"; import { CardCp1, CardCp2, CardCp3 } from "../asset"; +const useIntersectionObserver = (options = {}) => { + const [isIntersecting, setIsIntersecting] = useState(false); + const ref = useRef(null); + + useEffect(() => { + const observer = new IntersectionObserver( + ([entry]) => { + setIsIntersecting(entry.isIntersecting); + }, + { + threshold: 0.5, + ...options, + } + ); + + if (ref.current) { + observer.observe(ref.current); + } + + return () => { + if (ref.current) { + observer.unobserve(ref.current); + } + }; + }, [options]); + + return [ref, isIntersecting]; +}; + export default function FeatureCards() { const features = [ { @@ -24,22 +55,36 @@ export default function FeatureCards() { return (
-

- Dengan solusi terintegrasi, #Rekan AI, membantu perusahaan tetap unggul dan adaptif di tengah persaingan global. -

+ + Dengan solusi terintegrasi, #Rekan AI, membantu perusahaan tetap unggul dan adaptif di tengah persaingan global. + +
- {features.map((feature, index) => ( -
-
- {feature.title} -
-

{feature.title}

-

{feature.description}

-
- ))} + {features.map((feature, index) => { + const [ref, isIntersecting] = useIntersectionObserver(); + return ( + +
+ {feature.title} +
+

{feature.title}

+

{feature.description}

+ + ); + })}
); diff --git a/src/components/solusi/CardPersonal/CardPersonal.jsx b/src/components/solusi/CardPersonal/CardPersonal.jsx index 455451c..86e26c0 100644 --- a/src/components/solusi/CardPersonal/CardPersonal.jsx +++ b/src/components/solusi/CardPersonal/CardPersonal.jsx @@ -1,5 +1,36 @@ +import { motion } from "framer-motion"; +import { useEffect, useState, useRef } from "react"; import { card1, card2, card3 } from "../asset"; +const useIntersectionObserver = (options = {}) => { + const [isIntersecting, setIsIntersecting] = useState(false); + const ref = useRef(null); + + useEffect(() => { + const observer = new IntersectionObserver( + ([entry]) => { + setIsIntersecting(entry.isIntersecting); + }, + { + threshold: 0.5, + ...options, + } + ); + + if (ref.current) { + observer.observe(ref.current); + } + + return () => { + if (ref.current) { + observer.unobserve(ref.current); + } + }; + }, [options]); + + return [ref, isIntersecting]; +}; + export default function FeatureCards() { const features = [ { @@ -24,23 +55,37 @@ export default function FeatureCards() { return (
-

+ Dengan #Rekan AI, Anda bisa menghemat waktu, meningkatkan produktivitas, dan mendapatkan solusi yang benar-benar relevan dengan kebutuhan Anda. -

+ +
- {features.map((feature, index) => ( -
-
- {feature.title} -
-

{feature.title}

-

{feature.description}

-
- ))} + {features.map((feature, index) => { + const [ref, isIntersecting] = useIntersectionObserver(); + return ( + +
+ {feature.title} +
+

{feature.title}

+

{feature.description}

+ + ); + })}
); -} \ No newline at end of file +} diff --git a/src/components/solusi/CardStartup/CardStartup.jsx b/src/components/solusi/CardStartup/CardStartup.jsx index 4b58cc5..8488d31 100644 --- a/src/components/solusi/CardStartup/CardStartup.jsx +++ b/src/components/solusi/CardStartup/CardStartup.jsx @@ -1,5 +1,36 @@ +import { motion } from "framer-motion"; +import { useEffect, useState, useRef } from "react"; import { CardStart1, CardStart2, CardStart3 } from "../asset"; +const useIntersectionObserver = (options = {}) => { + const [isIntersecting, setIsIntersecting] = useState(false); + const ref = useRef(null); + + useEffect(() => { + const observer = new IntersectionObserver( + ([entry]) => { + setIsIntersecting(entry.isIntersecting); + }, + { + threshold: 0.5, + ...options, + } + ); + + if (ref.current) { + observer.observe(ref.current); + } + + return () => { + if (ref.current) { + observer.unobserve(ref.current); + } + }; + }, [options]); + + return [ref, isIntersecting]; +}; + export default function FeatureCards() { const features = [ { @@ -24,23 +55,36 @@ export default function FeatureCards() { return (
-

+ Bersama #Rekan AI, Startup lebih produktif, efisien, dan siap bersaing di era digital. -

+
- {features.map((feature, index) => ( -
-
- {feature.title} -
-

{feature.title}

-

{feature.description}

-
- ))} + {features.map((feature, index) => { + const [ref, isIntersecting] = useIntersectionObserver(); + return ( + +
+ {feature.title} +
+

{feature.title}

+

{feature.description}

+ + ); + })}
); -} \ No newline at end of file +} diff --git a/src/components/solusi/HeadCorporate/HeadCorporate.jsx b/src/components/solusi/HeadCorporate/HeadCorporate.jsx index b1a966b..bd6dc7b 100644 --- a/src/components/solusi/HeadCorporate/HeadCorporate.jsx +++ b/src/components/solusi/HeadCorporate/HeadCorporate.jsx @@ -1,34 +1,53 @@ import { Link } from "react-router-dom"; import { component11, wagreen, hc } from "../asset"; +import { motion } from "framer-motion"; +import { useInView } from "react-intersection-observer"; + export default function HeadCorporate() { + const options = { triggerOnce: false, threshold: 0.2 }; + const { ref: sectionRef, inView: sectionInView } = useInView(options); + const { ref: textRef, inView: textInView } = useInView(options); + const { ref: buttonRef, inView: buttonInView } = useInView(options); + return ( -
+
{/* Left Column */} -
- {/* Logo and Tagline */} -
+ + {/* Logo and Tagline */} +
Logo - # Solusi Corporate Business + # Solusi Corporate Business
{/* Header Text */}

- Inovasi Cerdas untuk Mendorong Transformasi Bisnis Skala Besar + Inovasi Cerdas untuk Mendorong Transformasi Bisnis Skala Besar

{/* Description */}

- Rekan AI hadir sebagai mitra strategis untuk perusahaan berskala besar, menghadirkan teknologi yang mampu mengoptimalkan proses bisnis, meningkatkan keamanan data, dan mempercepat pengambilan keputusan. + Rekan AI hadir sebagai mitra strategis untuk perusahaan berskala besar, menghadirkan teknologi yang mampu mengoptimalkan proses bisnis, meningkatkan keamanan data, dan mempercepat pengambilan keputusan.

-
+ {/* Right Column - Hero Image */} -
+ Hero Illustration -
+ {/* Buttons - Ensure they come last on mobile */} -
- - - -
+ + Coba Sekarang + + +
); diff --git a/src/components/solusi/HeadPersonal/HeadPersonal.jsx b/src/components/solusi/HeadPersonal/HeadPersonal.jsx index 40f2a55..21f2bb9 100644 --- a/src/components/solusi/HeadPersonal/HeadPersonal.jsx +++ b/src/components/solusi/HeadPersonal/HeadPersonal.jsx @@ -1,14 +1,27 @@ import { component11, wagreen, start22 } from "../asset"; import { Link } from "react-router-dom"; +import { motion } from "framer-motion"; +import { useInView } from "react-intersection-observer"; export default function HeadPersonal() { + const options = { triggerOnce: false, threshold: 0.2 }; + const { ref: sectionRef, inView: sectionInView } = useInView(options); + const { ref: textRef, inView: textInView } = useInView(options); + const { ref: buttonRef, inView: buttonInView } = useInView(options); + return ( -
+
{/* Left Column */} -
+ {/* Logo and Tagline */} -
+
Logo @@ -28,10 +41,15 @@ export default function HeadPersonal() { pelajar, atau individu yang mencari kemudahan dalam kehidupan sehari-hari, Rekan AI menawarkan teknologi yang mudah digunakan, efisien, dan dapat diandalkan.

-
+ {/* Right Column - Hero Image */} -
+ Hero Illustration -
+ {/* Buttons - Ensure they come last on mobile */} -
+ - - - - -
+ + + Coba Sekarang + + +
); diff --git a/src/components/solusi/HeadStartup/HeadStartup.jsx b/src/components/solusi/HeadStartup/HeadStartup.jsx index ec42ec6..f5bc80f 100644 --- a/src/components/solusi/HeadStartup/HeadStartup.jsx +++ b/src/components/solusi/HeadStartup/HeadStartup.jsx @@ -1,13 +1,27 @@ import { component11, wagreen, hs } from "../asset"; import { Link } from "react-router-dom"; +import { motion } from "framer-motion"; +import { useInView } from "react-intersection-observer"; + export default function HeadPersonal() { + const options = { triggerOnce: false, threshold: 0.2 }; + const { ref: sectionRef, inView: sectionInView } = useInView(options); + const { ref: textRef, inView: textInView } = useInView(options); + const { ref: buttonRef, inView: buttonInView } = useInView(options); + return ( -
+
{/* Left Column */} -
- {/* Logo and Tagline */} -
+ + {/* Logo and Tagline */} +
Logo @@ -18,17 +32,22 @@ export default function HeadPersonal() { {/* Header Text */}

- Tumbuh Lebih Cepat dengan Automasi dan Analisis yang Terjangkau + Tumbuh Lebih Cepat dengan Automasi dan Analisis yang Terjangkau

{/* Description */}

- Rekan AI hadir sebagai mitra terpercaya bagi Startup di seluruh Indonesia. Dengan solusi berbasis teknologi, kami membantu para pelaku pengembang Startup untuk bekerja lebih cerdas, mengurangi beban operasional, dan mencapai pertumbuhan yang berkelanjutan. + Rekan AI hadir sebagai mitra terpercaya bagi Startup di seluruh Indonesia. Dengan solusi berbasis teknologi, kami membantu para pelaku pengembang Startup untuk bekerja lebih cerdas, mengurangi beban operasional, dan mencapai pertumbuhan yang berkelanjutan.

-
+ {/* Right Column - Hero Image */} -
+ Hero Illustration -
+ {/* Buttons - Ensure they come last on mobile */} -
- - - -
+ + Coba Sekarang + + +
); diff --git a/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx b/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx index 39443fe..7d33fbc 100644 --- a/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx +++ b/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx @@ -1,57 +1,94 @@ -import { Link } from "react-router-dom" -import { chek2, wagreen, start33, start44, start55 } from "../asset" +import { motion } from "framer-motion"; +import { useEffect, useState } from "react"; +import { useInView } from "react-intersection-observer"; +import { Link } from "react-router-dom"; +import { chek2, wagreen, start55 } from "../asset"; + function Kenapa() { + const { ref, inView } = useInView({ triggerOnce: false, threshold: 0.2 }); + return ( -
-
+
+ {/* Image Section */} -
+ Woman with Tablet -
+ {/* Text Section */} -
+

Mengapa Rekan AI untuk Corporate Business?

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.

-
    -
  • - Check - Standar keamanan tinggi dengan enkripsi dan sertifikasi resmi yang melindungi data perusahaan. -
    • -
  • - Check - Solusi yang fleksibel dan dapat diimplementasikan di berbagai cabang perusahaan di seluruh dunia.
    • -
  • - Check - Automasi dan integrasi sistem yang mempercepat proses bisnis dan memangkas biaya operasional.
    • +
      + {["Standar keamanan tinggi dengan enkripsi dan sertifikasi resmi yang melindungi data perusahaan.", + "Solusi yang fleksibel dan dapat diimplementasikan di berbagai cabang perusahaan di seluruh dunia.", + "Automasi dan integrasi sistem yang mempercepat proses bisnis dan memangkas biaya operasional."].map((text, index) => ( + + Check + {text} + + ))}
    -
    - + - + -
    -
-
+ + +
- ) + ); } -export default Kenapa - +export default Kenapa; \ No newline at end of file diff --git a/src/components/solusi/MengapaStartup/MengapaStartup.jsx b/src/components/solusi/MengapaStartup/MengapaStartup.jsx index 6a86a2f..0ef8eb2 100644 --- a/src/components/solusi/MengapaStartup/MengapaStartup.jsx +++ b/src/components/solusi/MengapaStartup/MengapaStartup.jsx @@ -1,59 +1,94 @@ -import { Link } from "react-router-dom" -import { chek2, wagreen, start44 } from "../asset" +import { motion } from "framer-motion"; +import { useEffect, useState } from "react"; +import { useInView } from "react-intersection-observer"; +import { Link } from "react-router-dom"; +import { chek2, wagreen, start44 } from "../asset"; + function Kenapa() { - return ( -
-
- {/* Image Section */} -
- Woman with Tablet -
+ const { ref, inView } = useInView({ triggerOnce: false, threshold: 0.2 }); - {/* Text Section */} -
-

Kenapa Memilih Rekan AI untuk Startup Anda?

-

- 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. -

-
    -
  • - Check - Teknologi kami dirancang agar dapat diakses oleh siapa saja, tanpa memerlukan latar belakang teknis. -
    • -
  • - Check - Rekan AI menawarkan solusi dengan harga yang sesuai untuk Startup. -
    • -
  • - Check - Kami membantu Anda menciptakan peluang baru dengan teknologi yang mendukung setiap tahap perkembangan bisnis. -
    • -
+ return ( +
+ + {/* Image Section */} + + Woman with Tablet + -
- - - - -
-
-
-
- ) + {/* Text Section */} + +

Kenapa Memilih Rekan AI untuk Startup Anda?

+

+ 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. +

+
    + {["Teknologi kami dirancang agar dapat diakses oleh siapa saja, tanpa memerlukan latar belakang teknis.", + "Rekan AI menawarkan solusi dengan harga yang sesuai untuk Startup.", + "Kami membantu Anda menciptakan peluang baru dengan teknologi yang mendukung setiap tahap perkembangan bisnis."].map((text, index) => ( + + Check + {text} + + ))} +
+ + + + WhatsApp Icon + Konsultasi Gratis + + + + Coba Sekarang + + + + + +
+ ); } -export default Kenapa - +export default Kenapa; diff --git a/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx b/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx index ba0b6ff..50ad79f 100644 --- a/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx +++ b/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx @@ -1,62 +1,97 @@ -import { chek2, wagreen, start33 } from "../asset" -import { Link } from "react-router-dom" +import { motion } from "framer-motion"; +import { useEffect, useState } from "react"; +import { useInView } from "react-intersection-observer"; +import { chek2, wagreen, start33 } from "../asset"; +import { Link } from "react-router-dom"; + function Kenapa() { + const { ref, inView } = useInView({ triggerOnce: false, threshold: 0.2 }); + return ( -
-
+
+ {/* Image Section */} -
+ Woman with Tablet -
+ {/* Text Section */} -
+

Mengapa Memilih Rekan AI untuk Penggunaan Pribadi?

-

+

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 Anda.

-
    -
  • - Check - Teknologi yang ramah pengguna, cocok untuk semua kalangan tanpa memerlukan keahlian teknis. -
    • -
  • - Check - Data Anda aman dengan enkripsi tingkat tinggi, memastikan privasi Anda tetap terlindungi. -
    • -
  • - Check - Dapatkan manfaat maksimal dari solusi AI yang dapat disesuaikan dengan kebutuhan individu Anda. -
    • +
      + {["Teknologi yang ramah pengguna, cocok untuk semua kalangan tanpa memerlukan keahlian teknis.", + "Data Anda aman dengan enkripsi tingkat tinggi, memastikan privasi Anda tetap terlindungi.", + "Dapatkan manfaat maksimal dari solusi AI yang dapat disesuaikan dengan kebutuhan individu Anda."].map((text, index) => ( + + Check + {text} + + ))}
    -
    - + - + -
    -
-
+ + +
- ) + ); } -export default Kenapa - +export default Kenapa; \ No newline at end of file diff --git a/src/components/solusi/TransformasiCorpo/TransformasiCorpo.jsx b/src/components/solusi/TransformasiCorpo/TransformasiCorpo.jsx index a116ea7..c1afd99 100644 --- a/src/components/solusi/TransformasiCorpo/TransformasiCorpo.jsx +++ b/src/components/solusi/TransformasiCorpo/TransformasiCorpo.jsx @@ -1,9 +1,17 @@ import { Link } from "react-router-dom"; import { wagreen } from "../asset"; +import { motion } from "framer-motion"; + function Transformasi() { return ( <> -
+ {/* Tagline Section */}
@@ -15,26 +23,33 @@ function Transformasi() {

- Bersama Rekan AI, bawa bisnis Anda menuju masa depan yang lebih cerdas, efisien, dan kompetitif. - - + Bersama Rekan AI, bawa bisnis Anda menuju masa depan yang lebih cerdas, efisien, dan kompetitif.

+ -
-
- + - + + Coba Sekarang + -
+ - ); } diff --git a/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx b/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx deleted file mode 100644 index 1c57299..0000000 --- a/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx +++ /dev/null @@ -1,43 +0,0 @@ -import React from "react"; -import { wagreen } from "../asset"; -import { Link } from "react-router-dom"; -function MasaDepan() { - return ( - <> -
- {/* Tagline Section */} -
-
- - #Rekan AI - -

- Transformasi Digital Anda Dimulai di Sini -

-
-

- Bersama Rekan AI, bawa bisnis Anda menuju masa depan yang lebih cerdas, efisien, dan kompetitif. -

-
- - -
- {/* Button Section */} -
- - - - -
- - - - ); -} - -export default MasaDepan; diff --git a/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx b/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx index 569fce6..9289beb 100644 --- a/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx +++ b/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx @@ -1,9 +1,17 @@ import { wagreen } from "../asset"; import { Link } from "react-router-dom"; +import { motion } from "framer-motion"; + function Transformasi() { return ( <> -
+ {/* Tagline Section */}
@@ -24,22 +32,31 @@ function Transformasi() {

+ -
-
- + - + + Coba Sekarang + -
+ - ); } -export default Transformasi; +export default Transformasi; \ No newline at end of file diff --git a/src/components/solusi/TransformasiStart/TransformasiStart.jsx b/src/components/solusi/TransformasiStart/TransformasiStart.jsx index def22cc..a744c6c 100644 --- a/src/components/solusi/TransformasiStart/TransformasiStart.jsx +++ b/src/components/solusi/TransformasiStart/TransformasiStart.jsx @@ -1,9 +1,17 @@ import { Link } from "react-router-dom"; import { wagreen } from "../asset"; +import { motion } from "framer-motion"; + function Transformasi() { return ( <> -
+ {/* Tagline Section */}
@@ -24,21 +32,30 @@ function Transformasi() {

+ -
-
- + - + + Coba Sekarang + -
+ - ); } From b6687cf50023b446d0484c4595199baaf05bd0ad Mon Sep 17 00:00:00 2001 From: Carls2320 Date: Wed, 19 Feb 2025 13:26:57 +0700 Subject: [PATCH 8/8] sisa header --- src/components/contact/FormSection.jsx | 2 +- src/components/solusi/asset/Frame 8115681.png | Bin 0 -> 8853 bytes src/components/solusi/asset/Play Now (33) 1.png | Bin 9228 -> 0 bytes src/components/solusi/asset/index.js | 2 +- 4 files changed, 2 insertions(+), 2 deletions(-) create mode 100644 src/components/solusi/asset/Frame 8115681.png delete mode 100644 src/components/solusi/asset/Play Now (33) 1.png diff --git a/src/components/contact/FormSection.jsx b/src/components/contact/FormSection.jsx index 72963db..3a854fb 100644 --- a/src/components/contact/FormSection.jsx +++ b/src/components/contact/FormSection.jsx @@ -136,7 +136,7 @@ const ContactForm = () => {
nVffYG`g(!&)M4)L~iL(GioP~-I zIZy)lM~uXY*Myc67)nITqDes_X_2BRQWR%6B!`@R>7L%Z-+FKP)PCx|HzPH>r;P!+ zFt6`cw{G1!b-weRQ&o3>wX~Mj(pp+eYiTX5rL}bZC4p<09)9@Y#S z33FK~#WhUrcKhy;krBO5TBCnXP+VZH_e$Oj(J|YTzPWpz=da}M8WU?D!KwNb%aT_p z*FC%clS6rnjm3j6yzs(SIy{FJNY_+AS(Y7CjjwxZ9``oWI1Z(3v&iDsUX!jF`!tOe zWKkRVvv9R$wU_(f8=fmP3Wp9AYo5XAjNXYf2n2JxaXko#>OB}5+`L{ts54t52pJ?3 z?}ImXIPagu$}OIc4U>9^=+V}zyhErb;(ABVW_8Gg*n$;G*Hl2%7G=}DglTO5BH^X< zIoEzak&TLbt~=+2$KXr;Au!0pz*B0WW98z1) zj3j!AfXsRR!anQS_Ffq*w!M;H;o)x6ha~(MyA^3-&pWxoMQk(OK9xz#6)Tmltp)+Q zrXF>K{gcZcVVM`_+E8F%u(m^TffS+86wjd#?Ag*6rYq84I0en<%P@ULsr!dyh@kVY zV7k@<(n+uvaJ}wIL|GQm2HZBq+R`hKc%KzpsL+))q*$?-n6UB$leG*tT~`7M?8ic! z2pE$~8IVNA1mVi0K^6pHoY>$`#n126CJ}ZK1k8%#I^Fkzr`-PC`ea|h0Km0naSZfr zyd+!`jxU%-&vU7N!Qckt>l<1YfJPnr&dbX-zE_gi9&Pgo^Czlrxjyk9o%}Pjj_=Z z(lmi%W~MDIpA#I<3O32Xn7>-!fZk5U@1=xHPWW}ALAII(5)c_%_hL$me(=K-$6re^ zJ=2DIx1c>tb7V}(C5jN~&+1eMf7!O9Iih0DQd zVn2IlZP4{0Ag?X1y1woKwp0jcVnR~f&bETHO-dkn&@>K*kpP`$armR1HXWZh(ZT$D z2bD@naAzvvsC7>>dKm3}2UUMzHA=V_DoBTifvzW--M5?dG%|Bu1#75Wnh0^8Gn)hk zgUmj}1W(#B1;xg?Hc(6B9EtG2=%O1A8Ix~zmREd(fQe*9zUnR+(dYo-<0Xi4&O9~TCGm-mKbIi)rof> z$KnuJWAqlRW8ms)qXo2b2zTuT6wy=Gs5)sXEU|xIiqCwyg%@6!$J~5Z!;@=1RTYM8C&MrB$KXF7?_^BPa(;B2Wq)1#tGjAd-Qjz^EK-niFbM zR1{6AbtW^k9cf%KDq)$RuZ1or_eP(Ks#ou>_KwR-e=QnRJeNCPCs$)#E>0&A`8ZB% z%%*qWwyJ>Sio#?WH*s$yJJ=DIjPfbC6dER-4=M{lSWG2cr#7hA2+p@@w}F>lPH^;? z8q;@?1g;^hpL#kd;35nLnuI4LDu>cQ<@cniY1|mTu2!q?81)E6V#Y>0xb4<9Muw>A zZP=(7*Mn!N*Aa^gVV&OI8tf4X=SL;H`g#?!b1h`K^yWgk;HfJ^1}5m8U0xnH2}PeN z(l}QOr)dGW3T92GQkvr8r6xY{cXCuk+1MDRtuihrQq&bntE@pTaSZ}4T>_fT%nw22 zl0^NZ~=G6FEyb^M7Ud8XuZA$?E0NV@c4!M<$BxAZ0yYv2Ch9JI2zy%e&4}h{1_f=^P=gI zwe*CdSkDk7rLa*g4`tbF+6-A*$;CoM8!MGoWw?PiD2ETNIn)bx?`qUX+!rbCNEBj$mNeMs2wpEy)Od+ z;^fup%C*5VLlqU+zrT!w2WqHRD+G0-NZ45!s!mEe*UgBkHKVN8Il~=-rzR}3V@DlZ zwy219=I3yG3*unT9k}v61()$W5Dsbn7~tY@Gj_baVR<=TDT=P59BG{GQzQMD(tz?eGS?<$m6}Z zFdii1ssSu(9|y+4uoF=DMY*!_xz;pW{Fv)T5X~m= z?Wa?`b+U_g2R3LaVFTJ=qz*uDM8Kc5s}>Z^65%jY)QpU$Tr;ZTOpUs=P_^J0c zv3`9@wx|TFQ{g^Vu9?+?6-(DlKwtdQnFpn8nLbu*OzzjvpXXmFVd8QP4U&`(=_r4Q zYg`{cC=fVVDBB54oe?aL65W+FNA{_wxqD`&gsG_<_utn-y;igFI3`iRKT9FOkB;H~ zU-=i`fBZlG+uKiKnQ6rZ^u@27*^xEzd(*S>gFZ@NqXDu{*H`DKrlIMz(-P+h%FHyh zv;yM-3M5aWI6uM7rm{=K5V1H8j|_ojTq#5~%~btTv>FS>7gDN~h<-g!Bf{xZoqN-~ z{?xyE_~kGB#>4OY11ux0h=6|m*I(NtOWC_-r#pW$%{mXg@m6!>)Tzt(dw+Mcrp!sg zrpmI$@WOB;AaMam=?O)!_rgaFV1?tO2r>xLl-n<|5biVO0emb;f(fOkBbkXT-7ND< zId!x^1UNL$$|y3Q~7?RF@NT{1pU7T_*J%6VtfihB11wlZV;-X}YB|J;&3qgD?G1H3B`$fEE zx5U)NK8p!hGU!y0l@VtD%)M#?2}?4D13>WQI8AH8cHKVe$7fLiT#d2z8znlen45ctSP--Gq*I{41FpTUKT z6WF+ERMS+&e)MZQ;b^L3FlXT;xaTcdf zU(k)SZfpo?x#S(c5HmB>bmPV{)~#EoeW4KQF%Mw742mSPW!%^VOq0MFsg_g31oxY!}hX`n$U@ZO)g8|yb5pnFT0o9*cL z85^xoCzWWFT1yJ0E?YoUS2LYMeZ--gV|b`cOsAxK+tkcPqMVaxwI;BgqQRphgQ(T2 zY|tz5cE#EzJ7rZC%k$(S6d*V*N@1rXLkmfD zCiTwkR+sE;i~P7DT%6dC4b<7x0A!2YhP0eednC3jYVc-dbp@1*Tv*#}j_KtqREKqA z)MKc@7Z*3<`4>lV`s_GGgeS3SV-16YHOf=gu%~+^n~(wFqRD((6n6^ykb=JZE;9=W zIm}EXdZu$Z@?uYNQ^rY(+M0+538tNqAlf*2s)jdDZ6au^>FLY!^GyxmN;qD=!i1>O zG?Q3DTDE`^Z_I774W;bP(2xnwE1EqqxfSQ1YGUX1%Q&!ahTyD%fq^Q8@XG-{R5-h-G8C^dOe;k}!bAz){Pazb24PUEES@cz8FP1d0jvUj?0430so z0?iL`LS<`|)?B4lA@<1Up_iys z&4;ZNh9_baC(jJx#K}1v+&@XbhMq%Rt5qWCQ^GPIQW9nyEa(pSPS4PTzs&4YfhhQM z&L@+BRtG;Uw}Q#FW~g;cFa2nkA|J!rt~3@}nw_~0s-fCc$X70YVodOVlC*pcvdjJa zgmziS)l98Kp?J9eftW^xjE`ISLj8Xu;*kwe`gpJt+AM|ur}DJYYw zDRifDsG{1$ez3{*tv!f_JR z;hUxi{+bvVtZL{h6C*UxX9Q(tcv?;JLkZ}GKxW`MtK&i1Ucsne<~3$!h60~Q36{@~ zqE=0b1T=Bs+#IrY*ZOfV5UXcNntEv&xq8X)2^`n~zg34gZMtRLF3}F}FCv66-M}35 zH`a13fV8|GFaBtR@O>7C4o+kDt_B9`HB_}mrQSwqLFtBZ!jj&@FAja{4Rc1haAF(7 z1T(7yGl=sShEc94!L)IHf&|l1f}zMM<)It&B+H$nv$%EVYnW_p!1EVxrnf6;_n{=M zLu*Nl3mUJ!25Gg3x~S>7>~frXzzA;nd%GpIW|h+Q?VyGsOU)> zYDtNyuGUwk@X#G!#>ntlq(kd)Y2gU|;CuJs*z9g9KM8PZwMkWHbab^fND9epqVL6p zOpzf5(Bs`ZJEa;;IeEI_lXW=$#t2?}V;NprWI7VXtZWz(rAl^mtqwkYz)exW_t@>el^3($Ebe}FJSY=MT&c={mcr=IlO}TGdYEu1kvL%F|jIbhp^C4^W0KR z3Kkcd6hmu=IG|tQ7ihPZk5uR;@!`Ygaqp4;k8+JdIYXmJ2gX!Gpt~@I4*eu$T%Vl9 zFYWpy9-nv+&o+OaGw&s(R4_&kXEEnV=@)e6cs<~Qd#pe4NVLbe3<}f z5De_G{xX-gQz~MevMDzSv49@-`(!ntZwL*RNJhH_Z%1aPP93riaU}$g{ zAK&s#w2mLZvDTeRe;Q)d!wI5ba*x?1W&8%=>#v1f>%5Q8>h7Icle)hgm4Ttik zU%*`Uag3e$O<>_=bmlK>wx@>aMY)EgGEC)AsHYi-GF0MQ7;UULIM zbX_R8>vomuB5$Z*ws<0BXtqddD65dv4phjY2K25AiP&4SiZ28{c`tcmJb7?SSWMUZ7I_G9L}I?qi!Pt zxo3~|;dYT2bo7Hqs#yne!s&Df4%^sR9>*td{3^B_|A(lb{#|n~)lGfrcV_F~$K@k` zgl@W>gfmROT8%DO$Y|a`B;g3Yec~p(O%t?y0SU9+AL zQBhn&{qrrgmb@c)U4@<0WtY0x=Qx|A?M|kJlaX+$`8XK#KM z+i!RU<$8wl=mxSYb(ESXF!;1OwlH5S7k^_Q6zn?d^AC zeDCM+&Ep5X1MZf0l*{$i77&;gAhI=1V1fxJ7;1^wMmhKq!M13bv3!z+EBpgRREED` z_d~Qt`uccskmupNUeT9Z*48DbwT07XS|UxyM=h#yxnOOe{ho^Qu+ zd*VVE68#G_mziBc9y$VNahgzM+U^J?9E!8GC|dA^5B&u;Z8(O?V1n|zE4~`%-A){QxHXTpYYEtLa5&NxMyvT`@o!|*=lS@%^W4$qoC~*H+>&B z?s$$^*#fF#+sUt~6S7f|bbcHia!8fk5lMwYJY#yoi>B1|-FW8NI{xIvIn?SE_+=}w z@GBJWSY?tBy}YT3e{a@09(AJWRFGk~n&G45{!CFZtem;M0i(zIoZ$8aQKt!%8;rFX z?U5v$E@{r*;fuKMmdA+{Ttao-dTVzG`5Fe=R6Z50F4cxfNLA9LvZmA*=WfQM-@7q< z{>-l_5^s-VV+90c`l07nkw$neaYqrQvztDeAs{2BCRy43c213CLGjq7pv56{6WCgA z&S%!{5VV!$96tBH$B0s&MrEW%v9=8aZKNTsc?#!TqC5?)fk|bMoX}yqpFpUzjw08G z@W^BDr_PZ;*sl$nA#kQa^cx#nWk=Ptf%Q4uzU;Tpp-Dz0g4u6tuYedgZ4%s01>5Jg z2xkk=u+O(nD_GrNg`+5StJTK+hrf&M8;Md6v{4z|j3lj)#g+zZ}orwP&-XzLhC{o&oOP^9`hB%Ddq)@?#k9e|EfFJ9JB>Rd$@ zD1=k0kLXa2lvSX*4bL7wfbwm>cDQJK$-+|x$)*YB?*S%oeT!|zSPWT30rL)R5 zNXSG6b|%9BoeaIzLtFvgf`N$bmG^z3X}i69uHhZjdH7;XMHX$8eU{LpqnU=bpE>XX zc5ix-h`~In>$i|^Q-c~e=xAu0HkwA1x>Q#Kb0xZ;uBTh^$KQQ7Ub(!<&LB>XU@7hXP)Ez$Tqr!W7YO*TB}@gpXS} zB$Beg%3|RZn?DHL--Ke%b#+t&r%lp|PaS>^Th<>XyQ3&IK~<@uLp~}H+Fh72Ge?PL zmq>e5)Ls$?%fvSP(KGMHWOJB7nq_YOQ!(%m2j{Ee?WL7qapvWj;WtEp!yEI9SZqy3 zKkiF$L8#Q{^_&2T{jmUjQFaK+DuMmmGrVulGZf0XjM{n{La5gDJ>AB%4TN^+IMx1+ z`Y-8ZPIjlf4Nv^=7JT!qeV(x;!or(yD>FEIv!d~_xFso%PAg%9q+8VFMvG&rZSzTH zDR+`hGZMSBwnV4udY9YxIu-LhvC^EZ7G@GPRp07L9ft?}8pD@Ak1Jy^WuztHIC z1_N#Lm&qxewUoL}wrAAXon!=gvIk%Ji=W0^w{D@Wqy^>uorL>7@bo&0X47`Mv&sW@ z1m#U7n9MSy%uYJg!m*!N&MirBRm&v`j7|oaD>$k88Sou2Mmr00ocVFv)Az4^_NEOb z?Gkj?y$93#{tepMpr+Jn{xwO5g>ne`s=M(g&)tqUXVzKmDFwFXq0asi5wSQvr9$o3 zvY{51ke1Klax9q1=jNB|$$xg4pgQjamNPFtFHmhq1Q_b+#9+|x@~KkHW^s{n)8*n} z?pQT>m4eTkZ%`0r%4vvoIKSgxV{YVbt(j@nQff8vqp}sJClBL~e{e_(#>`-~+fwj- z4779e2zIOg~erh>1N68yKVRgx|znzo}ZxoSpZ=DADZ(MnQDP{<6C!Uz%_sAx0-_Wq?SS=DtiiL%at!JiNv9aZ2kelwrz{NkqKyw2B`&+kSsyV2q z6+3My*|kdQqe@OlYOz^rzXxH2Wwc0tu30s-;u)3Xdst$6yY!qTDc<+ffBu)Xf#LVo zYZX*$W*NR-L|bIRlG}+s4INI0eHh`n4@krr5y>#RT{4?yq0W7fX?x`y{=rATfySYq zGo3~a*ePpMtD~+a!lz}7Pe^?2YcqKDcosB7*%qfYb`hGJw6BB}&ROADbywd<*t#X{ zZrN1%8xK6N`3G1+T7fwULVovYdB>64{@-V3O35!!#coSV>3~_f82bb!^llnaPi|+@ z=-X2Y(E-oXnC0afBl_ISZID|(ba=xnSbyq2VKN)XZc~zKl;@vJo~-2 zHu`!pzGbFKDm1ZBi=*AA1N0}Q6T#j>+Ew0A^T1`TDozdz;p-d6I$wFUO>$Y5G)zebx}?7vrN3lO7CXtQ zNm7kW3GL_loVr~6Z!eXdqig7Dvv2;XW0fzFK94RhvAw`tS0?gTj(quVe{lD=-`{Ca zM4`4Dlkfg_&4F!)8}sw{pa1?#XQrp8spqOSw3WpEmpQQ8ima%Hua)vzwUkxLNw-o< z+XP(;1GUm3$#nA9z00000NkvXXu0mjf%jAT75$+Ez*>~vvdW8>hcIG8|6ig~pq#*QNhC0S0L@>p3VG;RxI zg#yV61zMYeyW$5ep*VzK8*pPA6EzrH#wIeBuq9d2j7A!1UU%-?$GKi;v%SXm-t*XJpKt&B`@jF+`y2tQWwor9)v{Vv%W7FI|34Lm&P#CW)T!Sb931>$ zE|*&ejvf}UkhX_W6rD?b|6ocG1mYv+oJaH*GsY(8=jWdu85wyi6jmHvC>?`TsZ>6) zw6yd`VHnC5Qsd;G`ECn0E#!0&M*n|__Hy&F!sFAY+iRz=;b^-{b8PxLYP&mM-&;(e zw|aYf3+Pe_Iy@fK`|qX(1cgEYWa$Wl5Yz$EN@$<`6K$6t`g^*V&hr0a`x$5Mm-}M# z7bpJQG0E+5`nPv%`Z}szv2CBh=;+a-`Q5vB=g_6naYY31cF}OtF!>*SwpuOMP_8W2 ze5%dvQ=MyS^eoL-dCKAv#k1UHk2BZLD1IBVi#VCtQ7TTT*Xy|AiYwMV{P4ra(1mg? zy_ajF6Mrz9VvYnG`dn<~tW5y?3<@G)mS&RnB?)QCC)qR*L`nLN5wItHD1 zyv+|dYgRz{ztw(Zes|})FWln~2bxbo?i}GRRsyUzMmf#)Yp0G(wn=lopwk_{@N=~E zX0wTWKIzC42JV6Few**^=;WyI$R#~ol7}TMy$x^ASlcM+EMRB)7w$%y5Ces{(2p*a zjzL#WH0`*OKqV;!%YWxSfWG9@_2^@iMJKlUmy@UXqvfpSEFI(8#}oG=)Y)Tu9}Cf? z(z$vGmcRB(f~>zggXbAs&(B(Ka)+trr76Z1kCL+VQP%Z^r8k?kt_6M_>-2=?ZUeU6 z;tj_;eJ!XmmU>vI5bkN^ICdi>OQR>Ki31%#tF5}2I0j;@n=o{s!L2vk%{(4Jw z-1MF*8jS+cT%bCGC9!ahmU)3z`W|3A(~bbO_pxSMg@ITbHcItINJx9Fs^pO(vU9DH8fNL>OWI57~wi)M>~Apu~r6POtt zR#Bun!W$utMhh<-s-xa$5^d!Pj8Il6pqJHJdvL~(WWRQ+H+nz2=q{uKgo5c-IR|=q z=}ihI?j^k-T{epaILd*xS_;mD^?Q{iEZylv6iXqRjV0<>;U@y9i|FgwoQWzr#FC&b ztLXtO7hsvKBAK_exbzQ1y_ikuZDe*!OHK6k=gB%bnvt^7Ml(XxY)Qban&BL6fsElO zW%5?8i1UYsitc#dFLJa2&b@uEKK4p=#}@?T|2JC=~2&+844!#ALlP+y~~XY*G_emqNkoh4@Z|u$Dk`~RfAHus;$k! z`ozRiu~;C9w~3;;NNaUVu>sM28p}68n&{J9$8AsEGuO0}5yWPG zS9NgjJJL7ieWa-eA}r`yIma|WyZ%aOWWn1pbYx23TPhWR&`3j`2!!NW8P@Nr=Z?dse+n=H6u%S z*V~&EXyv7kP=~a4I8Ss;cgi^hM@hhqMB@p+^uTw4g~cKCmFIL2q<3+p&6Qr}R*H)n z)aY;&=JvU5%_f&>DAATI#)Idm^9uRvp8Cyn5jK8VpbA7bx>I6>V6X-2bM36!M{rkOSe61EuYmP3tmSXLm6N@7&U3p1Iu)LH$vy zH8DI~#8Ry#&k>X&9V$1D)+{c9r3slRj=AM^=VXy`hCpgSv{8(ow`cx*pDq!lCVG1m zu$tujyK#MH0gup)a_O$$zu+7qQdr5iTxm8LZhUu)_x<*9Y}%N!7Hs1w-Enr*aA4Vm zbk^LQGO@#+aqH*;Ek9L?R}qA72!1dnzBL*FuDN=GRLp?h$FeVK8`Yf!UTcRg+i`A= zv<)2>ql#TZA@ucy`0AgR@wKm?K%*YnOk!*xv8e!+YnK|Dy9m@?4DcdZ4J_3kMJ+lf z&_{7g1M&!+J~ocjW+9oH_z=fjeN_Q##s)}b6=-vy9A@G+eV&4pyWJ>LQ%?-OY@Kc$ zo%4Ds4UiMlYk9owt?LP(h%74h9HL9-n(wye%*ZskFZ=iMD#klO?iWf$%sho+EoKZSf`3+F^Heo4njg zGwT}|^XpHh5whCL%v^Q?bdOLNl4O!%7V*1Yt)m-dayl-YgHHF08-htK4I2se^yn46 zv09q!?^oa5N!04W^Gt``Q zX*~shhF=Wlul@xonEpWw4$Ntl;Z4tRW;Hjr3Pw9ZZe*m^B(}3+kG7cA@vg%>4)$43 zZ}1n8ifs!EIehdFoA}u8lNF-`^_YuhL=`NK9l)6tQ*?KHl3{XkQ6{K@Kv`uFGM!(C-sb)3`*fNcGE!6)$h~8= z1Qhi!caGT}`1Qg3W`39;_t#0r_LT>SW@>IR6nx`}?PrVjzi{Zx_CNjHDgHaZ^W$B3 z83J-Duz2eB+xh#7{px6@=kB%aIOv-{QUDA37jn zeVAQ^L3b{eWZ3XudQzT{k?K$T0V4?$Y@+$wGtk)kZGkim^GS<7Na{;}6No>}^(K8` z?oSjE6a47${o%-(5LaC}{DY5w;`H9fzJL3BYPBIe{O|`}gqKQssdC==rM@iC+1uWB z=<=I>W9)A$)f#)?!58@-{QDW4m^>6rO&mvM;a!v?kEO-BHHbiZ7HEFHhE1D#aH<-? zj10E|0BSuW6zC?JNrGfywIFG40uOcf!5!_GjqOphldGcr$6lQG+KhzX5r5{Hq?wr| zOiUifqmLZG4}bXTaOci#SKn~sdk;0E7JuzEd-i?uKNfZ+8@7CzKiON#0-ZNnr~liN zKQ1#d>|T4-diK~OPhe`|QQ9?*Q`0l(=^aE*si+^E;@TR`0#HuQiQz;4hT)(7%5&I$ zVcAE~1yDf32^t3*AU%`s9Hs%?_y}2@7)d4~W+pQB9ij)Mu1^5@!VB~G=pQVSwXa1% z*Bk4#b;g)PKqvktC+AVER4B539*0O6{M%cvWCwoM6#Ll0pG{l_MK>!-&eZt+Owh%$ zV6xN(Uipe496nOPZ|wOsJoV%{eBTh1<&XeGEln zSkZ~mN1p51ix!&pfv z25-n#FZp~w7Akeh5H@ka1^qO<>ezbWtMDH_c{iSY_FMLm!r|e5nJ-TUCJH>Uo!W{m zTSld|n1=~m6q=+XgQ#KN*n+RQ-0-&%73R0Qsv8`fCzOh;&o0B}lDh+$3J9g)sE&1= zF4`JJF_x-Lx`!&|-ly@aZ@HOrHJdRvSH;3ygU;jFw4qOT(84m2S$i27oyfNI-g23# z#xg7}Hc&3-ux0ZAPM%uA^z3z*TOb*T1Jsyx7#Qf2Nuy9dilm=9mgtBFsaY7?ZGN6y zV}iEaqOnScE)o+bK+<`qfwpy;bK$IA4Jj3sauX^0fGav_65x$G{WWHB_;5d7IPw;Z zuHiJ>R1@k0gM&r8U{#^L@|6NJb3r~6bjk`c9_N&`c{BIpW29$;IyGh(-~QgKvEjTE zxax`{)G1^1SE3OT$_IL-B?ZZLC`rgH@22)R$LX&}l&rzw=5e^CA{)Eg(^HnN7)PJO zb^gV*NrKIhuxL9Sj>)X zIdvmT`68zCDnmm>In^bGRlT_Zcm2;XT(aXRc3pOw8Z}Jd7m+XIk@KFS4)ko11KE!_ zH3T*%V)7rF!=WNV)h7&K-Y9?@Da>=t%!u;X<$TnsY0EZXb4e$yR-J;T7QXrI%`}2b z7#^Zr$;3Q3Ny;!E%6h^;yXnB;(ut)rmdge`;7$YhLtOzMLp;?uM6*H*VVERiTkQb-AgAWj-p&9 z=w_{pTGGCsROZ2ohAu-3Lf~Ov=kaj zHi~4{%2Or9K+Y9pE&xfMs;$`g2S1iDG@`7#N!yli@Bdnh79YZS=Y<6JJWfwFY~&2< z<2lkxvD@0Yg3>=Q94-SooJlb^jQrq)8!+gjR0`!yEK(qJ$t)@NCo&e#QjaalZ4k1dOPPHpKJN*0y7m;DBczpT*ZBVHHPUk zo5*1DI8I<6c(!WO2J)UMWLA$jacL;2h9Hq!SYcVJH?z|Kf#z>jy(Suc9sfp|?h%cf zw0z-+>h%_OUOa@y_YLCMU(MhhZ#_y*SS%>*rw%G0NB&za1PyhnmATm)t}8PaN!zt2 z2VI-Er_H(5+P)%@s)T0#!*CG~d}oxj_6A(^$|9=OdF+2?T8%i-F%kfsbqv*INPkiE z6KhP|3Wntd>Dh|#ZrQmP87%0kQ^P0WU=v{2EGSttqnl~U8^7qH5&Z4rLpX8b4BqyZ zW5k!Cj01|~PQ)WDlJCXTneG5fJImaS>vXOuPq)NSiB2{6oZY19!Z4`fyAO@x;Gy-n zn7|$$tl*iarj?Hoqe3KN=r~3R#M$~VZr=3+{A6ky_MSQ)=M7ZpzC!KP^|g(Y@37E# ziL=#9Ow(*~;UO%a89C!-hO+6v>=6zomxttgs*chDYq0l6qc}M=gX>;@lypBwH5ec{ zmM687%LHH14$A!n4b8df+ox(m`{a)nkkETD+Z;OrSa^z$e<-vbl`YvpaC-T{Vmhox)YG znI`HHhxW)9KG?5QrDWsFD4xWBy06*Hdi9+@sj1iSZ6AQ%IXT%t= zlF#N>L|tMkkw9Nqit(R+`F@JPpFw%77eRr7y}n_@jU_baPhjWxUHI19zl`^N_y3|N z5Rby-JS$vzX)GLjG~3bz$03)X7307>O4VQd6BX>t)5?|uy(ms3oJ4w|HP10Rnxla0 zd_4Zt21=&YF*-bhojYc+X=7DJe`0Z`Tx-ZeFPatYilmj!(qP^H(*ZnxXq@P*g!Sw5 zlv0i`bz&YTCmXI2+yNdNS`r;bhF-14*pxqk*X{ZmT1|>WddtZ5jY!{CpPN9maE1(} zg}I31&o0`8FTZ#Pp2aVtz*1?A6_lyDL-%KbF0*bPy_gQQnu2?>(c9LBzy0oy7x!HR z9!-*OC#RZn``WQQP4R8Ok>l&J@0k{AwMeENO2sB+16%U>)Ou4qu@{m;>XE)+XfTuu zo7Sz1h*D~J{%3P~alFY~`V%91fm7@rt85UEm%pwLzxBIs#Pl;Kv3~YHA?zC^YUx39 z<_KEVIh9wZQ}ewPq7Dt>x3=Gn&;6evOySk?-a6s*7xv%w;xe2rv{9ImV}P}0_uc4t z9S!=D&cf_g>}GM3O3{+VEj3YDtjkW%QHKaXi={rbFep^cxu{?0&>)Kx>m@}3>eR`W z({_m=fCeLHZ;zre}j`!W918xYoK(U_kS z5u|uxS$0BD8kXQkwI$r}OHbevKe$plV|2plSZ0A{L}cIF_dm0k45y3joE9hd%P-|W``z_8y~~^(q8ob z%`eh)TAl_%Lyat&K|As5^Qe`spzjnQ1r$+l+JQZ{zZc{Eb2yhYfGEN8(7@)R-Oa($ zj=zrF>@yNRt#Ei^L$aZ^6B1(uel2!{nUTU1l_J4ovF33*<77IE)CVJ45mr7&Iik=1 z%6(YOA3?svP#j)Q7F?nnQ5hrO9LLggG&`0bkYlpcIE}?CzJOCZ?<6TZht+@*~JNN^YFB ziI}z3%bdD&p2Bf9$%<<@zcho(cRoT6`ZP)->%fZQooFr6&?itQFxMWs6@B;Z1{>U_ zQX9=B@PW;U-gpo0+qX`3hM~Q%)8GipfNl*3Xq!N`Us9Ztj81umo_E%4JJLVE_&}aQ zHFh4tci{F|o}??K!F6g{;;sOf&XZ{4;E6JBzv0i&Q7_Y z&OG&Yo^X8j{51c%D9b?R>QB%PZ?DVy<}4k0r5I0c7usDskU+E|mVxZK?gyW zL(kY22`#_C!Ra77Qgqw<1_)0vuSL_FqBs!;5)>8 z8G1>n0(<|QdwSWQ)M$&IT*p{nkPU1iIcBd9v?&wMftos)+3wMr+$nPDLLO4~P)I~U zD~psax#4wRqq)ur^p0;tQ0$Wxv=&bjt(>ADs3qwl*E>wWk~|a>7`btT{jbDr-+mQF z2HiWu>p0ya9xql=8r!VqZsMlm@ui9cnT3?u zBwC4^g7A8gAHEQu`0}+_GgK3+BjCRmUS3OoiZ!xbQ7@vj;&vXDY6fsCZ8_4u)!e=# z6UGv9(HvttGK*SF5jh!6+Pv-j*n18&MdD$U9? z(aN-<6@npGUL)V^#wj@BrHy$0@HRX$u>tCtslZJs+GmuMIgr-ro_aAak>sA$B6gG# z$Ig)&3byoOk#m;aPCZHbNcxWqp7M*w>(+5UZUp`1aolkCTQFFPW%5l~d0+t#9RHG~2VK(XCShc6 zOqJMs_LEyW;m*>$PEhqY#F?cQ-e%?Yx`|Kb`i%LV#}l3Gx1lBHIn|`Z;WGt%=e?gt zr9Mq+Btk(%oq|@PhUD>9ZPCd?N@j_SBPh(zk8H;EpLsX7(6k-`W!Y-Yqk5ZCpq(k0 zi@m$#NCWuU#P*vsouGk73Ob*6y|w42_V&ZtE!&JRn~LzNPZwqAT+Vw6wX#%i;`d&? zm#p>x0eTv}>$VeT=cTT0R!*X+Cndo0(y4O!YLp_)hi<`N{`F;O5QkmEdo-nAqT1&);zcs+P@5UT zXZBr*oSfYXrBVqDkLypD>sIZTKf4kf0qrkdunXqloR`^UUtnxDm=Tifm_&8F-TfLL zV)kb}IBu`112{8BAuLlYpm=V&AAf!GpP<2~DUn60~V#{YUV*7esU;GupniWzFrbG5Km56ytQJC-hb)Ig%v|IsYF(Zre)j8aSI zO1Njy+NABiIOQie+G(Rb%wnm|WGU`fpDhCYbiIgsum37eHAo)z&QsL6nE=hpBN_`+ z6m`xjIUERixJD`$4$|!dTkydzU5^dJRjBs|sJ}ozOqTp7gpj=7bc$jHB@^@p<(qBV z*1NMfHrc#5q2KLV7@nkDwNIylc{ZT#yD6-FWO!=9Ztyxl)GbyZl>1BAHt;PJijx%B zY?Inspw_C=)Z5&Ya+Z=-#^@wcF>wK$@+(h2y%qcB#u4jB>RA}*r}qN&vIeHVd;gi{ zu+A~h20foIaL47`OKQOa?0)Oa9z%lblW2Ox;O|R2Q0@g`DSv=;mCQJ22mGrpZs5hM z@1Tk7NQL==A}B3epFOUUS#(T}CYOU;ua<|S=qrq4&wc+4eR-~553XdO)a9XD{=xK1 z!~EP!vOy~^nV{F}v+~~U zdUIY6SpPQM^^L2D`^D*MMHve;;99K&`p>)%#$3}XFBr~zV#UvqE(<#2Y@wwsIo9h# zyqB%2~Z9-%>L}>1dPt`ko;LzMt$(tq12w_m^E_9Y-<5i=V?#ffy~E z#KG4b#8T@bvLc3poXw{YUvN2P4=cgN_~Mg0WZ)wn*pVK?zeey1f9^qHk6|2$v3^oFUa zYEUeSRkeYAN0vVVxc80#`$DvYQ5){%PG0&Uy*$B3SwSBA!vx;3s#5u#>Gc?L2{{41 zX>9?u2Blz$M(W~ON|-f{HALkLaQMx$So73}Fi@JqEr0q3Y&|cM5vfUL1seEJ11}e{ zhGG;@_(UT?EPfKp0cGbjLy{FJ&Sx)eQs9rMz75Z=Sy~91Vsx zoo>N~|K17pKmUbm%2F6IBPXQTopaY$26XuTf^>Mjgg^fEJ21E9Jv1ciYOa$wucxO+ zzHnZwg&!U%;+79DVrgz(KDJ|CB^By$U)-D6CLdCxd(DMzyQG^$dW7=}w)U~&z)v^q z`B%R<31G!0zwE0=9(`!*`d93@@5XZfnopAzj0J(x?!Fgins$V>7+|tcQ-09r1b09p z*T`6E0!1H_IMr-(`^4WX%gST9h4U%fi?~d^ACvHufFE7S@Br<;6M|Ltq`x+7>e0E`CMpB zq+HAwTgP9#AnGsYoAv04`j*YbXyVv;l~Uh+3Q;j1^2WmAVm!NM&E(wex8GJxVb?jS z|6?f++=QJo9|wQ_Be}ToH}8D(Huo>(cK+{vtdE diff --git a/src/components/solusi/asset/index.js b/src/components/solusi/asset/index.js index 5831db3..cd816b6 100644 --- a/src/components/solusi/asset/index.js +++ b/src/components/solusi/asset/index.js @@ -21,7 +21,7 @@ import x from "./x.png"; import chek2 from "./Frame 811480.png"; import start22 from "./Frame 811554.png"; import maskcek from "./Mask group (1).png"; -import card1 from "./Play Now (33) 1.png"; +import card1 from "./Frame 8115681.png"; import card2 from "./Play Now (32) 1.png"; import card3 from "./Play Now (30) 2.png"; import rekan1 from "./Play Now (34) 1.png";