Compare commits
	
		
			No commits in common. "15ec2fb8047f92eaf8c6d042eba8f545608fa1de" and "bcd1c05bec3b90ef60797d2aaa4d462a11eb177e" have entirely different histories.
		
	
	
		
			15ec2fb804
			...
			bcd1c05bec
		
	
		
@ -27,11 +27,11 @@ function Banner() {
 | 
				
			|||||||
        {/* Teks dan tombol */}
 | 
					        {/* Teks dan tombol */}
 | 
				
			||||||
        <div className="container mx-auto px-4 text-center w-full mt-8 md:mt-0 z-10">
 | 
					        <div className="container mx-auto px-4 text-center w-full mt-8 md:mt-0 z-10">
 | 
				
			||||||
          <div className="text-customWhite max-w-[90%] md:max-w-[45%] mx-auto">
 | 
					          <div className="text-customWhite max-w-[90%] md:max-w-[45%] mx-auto">
 | 
				
			||||||
            <h1 className="text-xl md:text-[25px] lg:text-[24px] 2xl:text-[30px] font-semibold text-center leading-10">
 | 
					            <h1 className="text-xl md:text-[30px] font-semibold text-center leading-10">
 | 
				
			||||||
              Bersama Rekan AI, Wujudkan Masa Depan Bisnis yang Lebih Inovatif dan Kompetitif.
 | 
					              Bersama Rekan AI, Wujudkan Masa Depan Bisnis yang Lebih Inovatif dan Kompetitif.
 | 
				
			||||||
            </h1>
 | 
					            </h1>
 | 
				
			||||||
          </div>
 | 
					          </div>
 | 
				
			||||||
          <p className="mt-4 md:mt-14 max-w-[90%] md:max-w-[500px] 2xl:max-w-[700px]  mx-auto text-customWhite text-sm 2xl:text-[18px] md:font-extralight md:leading-7">
 | 
					          <p className="mt-4 md:mt-14 max-w-[90%] md:max-w-[700px] mx-auto text-customWhite text-sm md:text-[18px] md:font-extralight md:leading-7">
 | 
				
			||||||
            Dari autentikasi dokumen hingga analisis data dan automasi HR, Rekan AI menawarkan produk-produk cerdas yang
 | 
					            Dari autentikasi dokumen hingga analisis data dan automasi HR, Rekan AI menawarkan produk-produk cerdas yang
 | 
				
			||||||
            siap membantu bisnis Anda tumbuh dan bersaing di pasar yang dinamis.
 | 
					            siap membantu bisnis Anda tumbuh dan bersaing di pasar yang dinamis.
 | 
				
			||||||
          </p>
 | 
					          </p>
 | 
				
			||||||
@ -58,22 +58,22 @@ function Banner() {
 | 
				
			|||||||
          <img
 | 
					          <img
 | 
				
			||||||
            src={L1}
 | 
					            src={L1}
 | 
				
			||||||
            alt="image 1"
 | 
					            alt="image 1"
 | 
				
			||||||
            className="w-[15vw] max-w-[170px] 2xl:max-w-[200px] rounded-lg shadow-lg object-cover"
 | 
					            className="w-[15vw] max-w-[200px] rounded-lg shadow-lg object-cover"
 | 
				
			||||||
          />
 | 
					          />
 | 
				
			||||||
          <img
 | 
					          <img
 | 
				
			||||||
            src={L2}
 | 
					            src={L2}
 | 
				
			||||||
            alt="image 2"
 | 
					            alt="image 2"
 | 
				
			||||||
            className="w-[11vw] max-w-[135px] 2xl:max-w-[150px] md:-translate-x-9 2xl:-translate-x-0 rounded-lg shadow-lg object-cover mt-16"
 | 
					            className="w-[11vw] max-w-[150px] rounded-lg shadow-lg object-cover mt-16"
 | 
				
			||||||
          />
 | 
					          />
 | 
				
			||||||
          <img
 | 
					          <img
 | 
				
			||||||
            src={L3}
 | 
					            src={L3}
 | 
				
			||||||
            alt="image 3"
 | 
					            alt="image 3"
 | 
				
			||||||
            className="w-[16vw] max-w-[180px] 2xl:max-w-[210px] rounded-lg shadow-lg object-cover"
 | 
					            className="w-[16vw] max-w-[210px] rounded-lg shadow-lg object-cover"
 | 
				
			||||||
          />
 | 
					          />
 | 
				
			||||||
          <img
 | 
					          <img
 | 
				
			||||||
            src={L4}
 | 
					            src={L4}
 | 
				
			||||||
            alt="image 4"
 | 
					            alt="image 4"
 | 
				
			||||||
            className="w-[11vw] max-w-[120px] 2xl:max-w-[150px] md:-translate-x-5 2xl:-translate-x-0 rounded-lg shadow-lg object-cover -mt-1 2xl:-mt-11"
 | 
					            className="w-[11vw] max-w-[150px] rounded-lg shadow-lg object-cover -mt-11"
 | 
				
			||||||
          />
 | 
					          />
 | 
				
			||||||
        </div>
 | 
					        </div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -82,22 +82,22 @@ function Banner() {
 | 
				
			|||||||
          <img
 | 
					          <img
 | 
				
			||||||
            src={R1}
 | 
					            src={R1}
 | 
				
			||||||
            alt="image 1"
 | 
					            alt="image 1"
 | 
				
			||||||
            className="w-[11vw] max-w-[135px] 2xl:max-w-[150px] rounded-lg shadow-lg object-cover mt-28 2xl:mt-20 ml-24 2xl:ml-9"
 | 
					            className="w-[11vw] max-w-[150px] rounded-lg shadow-lg object-cover mt-20 ml-9"
 | 
				
			||||||
          />
 | 
					          />
 | 
				
			||||||
          <img
 | 
					          <img
 | 
				
			||||||
            src={R2}
 | 
					            src={R2}
 | 
				
			||||||
            alt="image 2"
 | 
					            alt="image 2"
 | 
				
			||||||
            className="w-[15vw] max-w-[170px] 2xl:max-w-[200px] rounded-lg shadow-lg object-cover 2xl:-ml-4 md:ml-8 md:mt-14 2xl:mt-0"
 | 
					            className="w-[15vw] max-w-[200px] rounded-lg shadow-lg object-cover -ml-4"
 | 
				
			||||||
          />
 | 
					          />
 | 
				
			||||||
          <img
 | 
					          <img
 | 
				
			||||||
            src={R3}
 | 
					            src={R3}
 | 
				
			||||||
            alt="image 3"
 | 
					            alt="image 3"
 | 
				
			||||||
            className="w-[13vw] max-w-[145px] 2xl:max-w-[180px] rounded-lg shadow-lg object-cover ml-24 2xl:ml-7"
 | 
					            className="w-[13vw] max-w-[180px] rounded-lg shadow-lg object-cover ml-7"
 | 
				
			||||||
          />
 | 
					          />
 | 
				
			||||||
          <img
 | 
					          <img
 | 
				
			||||||
            src={R4}
 | 
					            src={R4}
 | 
				
			||||||
            alt="image 4"
 | 
					            alt="image 4"
 | 
				
			||||||
            className="w-[15vw] max-w-[170px] 2xl:max-w-[206px] rounded-lg shadow-lg object-cover ml-8 2xl:ml-0"
 | 
					            className="w-[15vw] max-w-[206px] rounded-lg shadow-lg object-cover"
 | 
				
			||||||
          />
 | 
					          />
 | 
				
			||||||
        </div>
 | 
					        </div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
				
			|||||||
@ -15,11 +15,10 @@ function Footer() {
 | 
				
			|||||||
  const navigate = useNavigate();
 | 
					  const navigate = useNavigate();
 | 
				
			||||||
  return (
 | 
					  return (
 | 
				
			||||||
    <footer className="bg-customGrey py-10 text-[#212121]">
 | 
					    <footer className="bg-customGrey py-10 text-[#212121]">
 | 
				
			||||||
      <div className="container mx-auto">
 | 
					 | 
				
			||||||
      {/* Kontainer utama footer */}
 | 
					      {/* Kontainer utama footer */}
 | 
				
			||||||
      <div className="flex flex-col sm:flex-row sm:flex-wrap justify-between gap-5 mx-5 sm:mx-28 mt-20 text-sm">
 | 
					      <div className="flex flex-col sm:flex-row sm:flex-wrap justify-between gap-5 mx-5 sm:mx-28 mt-20 text-sm">
 | 
				
			||||||
        {/* Kolom 1: Logo perusahaan */}
 | 
					        {/* Kolom 1: Logo perusahaan */}
 | 
				
			||||||
          <div className="mb-5 sm:mb-0 md:-ml-16">
 | 
					        <div className="mb-5 sm:mb-0">
 | 
				
			||||||
          <img
 | 
					          <img
 | 
				
			||||||
            src={component11} // Gambar logo perusahaan
 | 
					            src={component11} // Gambar logo perusahaan
 | 
				
			||||||
            alt="Logo"
 | 
					            alt="Logo"
 | 
				
			||||||
@ -151,8 +150,6 @@ function Footer() {
 | 
				
			|||||||
          © Copyright 2025 Rekan AI. Seluruh hak cipta dilindungi undang-undang
 | 
					          © Copyright 2025 Rekan AI. Seluruh hak cipta dilindungi undang-undang
 | 
				
			||||||
        </p>
 | 
					        </p>
 | 
				
			||||||
      </div>
 | 
					      </div>
 | 
				
			||||||
      </div>
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    </footer>
 | 
					    </footer>
 | 
				
			||||||
  );
 | 
					  );
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
				
			|||||||
@ -7,28 +7,6 @@ const Header = () => {
 | 
				
			|||||||
  const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
 | 
					  const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
 | 
				
			||||||
  const [isSolusiOpen, setIsSolusiOpen] = useState(false);
 | 
					  const [isSolusiOpen, setIsSolusiOpen] = useState(false);
 | 
				
			||||||
  const [isProdukOpen, setIsProdukOpen] = useState(false);
 | 
					  const [isProdukOpen, setIsProdukOpen] = useState(false);
 | 
				
			||||||
  const [searchQuery, setSearchQuery] = useState("")
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  const handleSearch = (e) => {
 | 
					 | 
				
			||||||
    setSearchQuery(e.target.value)
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  const handleSearchSubmit = (e) => {
 | 
					 | 
				
			||||||
    e.preventDefault()
 | 
					 | 
				
			||||||
    const query = searchQuery.toLowerCase()
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    // Solutions mapping
 | 
					 | 
				
			||||||
    if (query.includes("solusi personal") || query.includes("personal")) {
 | 
					 | 
				
			||||||
      navigate("/SolusiPersonal")
 | 
					 | 
				
			||||||
    } else if (query.includes("solusi startup") || query.includes("startup")) {
 | 
					 | 
				
			||||||
      navigate("/SolusiStartup")
 | 
					 | 
				
			||||||
    } else if (query.includes("solusi corporate") || query.includes("corporate") || query.includes("business")) {
 | 
					 | 
				
			||||||
      navigate("/SolusiCorporate")
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    window.scrollTo({ top: 0, behavior: "smooth" })
 | 
					 | 
				
			||||||
    setSearchQuery("") // Clear search after submission
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
  // Referensi untuk mendeteksi klik di luar dropdown
 | 
					  // Referensi untuk mendeteksi klik di luar dropdown
 | 
				
			||||||
  const solusiRef = useRef(null);
 | 
					  const solusiRef = useRef(null);
 | 
				
			||||||
@ -45,7 +23,6 @@ const Header = () => {
 | 
				
			|||||||
      }
 | 
					      }
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					 | 
				
			||||||
    // Tambahkan event listener saat dropdown terbuka
 | 
					    // Tambahkan event listener saat dropdown terbuka
 | 
				
			||||||
    document.addEventListener("mousedown", handleClickOutside);
 | 
					    document.addEventListener("mousedown", handleClickOutside);
 | 
				
			||||||
    return () => {
 | 
					    return () => {
 | 
				
			||||||
@ -95,7 +72,7 @@ const Header = () => {
 | 
				
			|||||||
            </button>
 | 
					            </button>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
            {isProdukOpen && (
 | 
					            {isProdukOpen && (
 | 
				
			||||||
              <div className="absolute left-[448px] -translate-x-1/2 top-full md:top-11 mt-2 w-[1450px]">
 | 
					              <div className="absolute left-[500px] -translate-x-1/2 top-full md:top-11 mt-2 w-[5000px]">
 | 
				
			||||||
                <div className="bg-customRed bg-opacity-80 rounded-xl p-8">
 | 
					                <div className="bg-customRed bg-opacity-80 rounded-xl p-8">
 | 
				
			||||||
                  <div className="flex justify-center gap-8">
 | 
					                  <div className="flex justify-center gap-8">
 | 
				
			||||||
                    {/* HR */}
 | 
					                    {/* HR */}
 | 
				
			||||||
@ -188,7 +165,7 @@ const Header = () => {
 | 
				
			|||||||
            </button>
 | 
					            </button>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
            {isSolusiOpen && (
 | 
					            {isSolusiOpen && (
 | 
				
			||||||
              <div className="absolute left-[340px] -translate-x-1/2 top-full md:top-11 mt-2 w-[1450px]">
 | 
					              <div className="absolute left-64 -translate-x-1/2 top-full md:top-11 mt-2 w-[5000px]">
 | 
				
			||||||
                <div className="bg-customRed bg-opacity-80 rounded-xl p-8">
 | 
					                <div className="bg-customRed bg-opacity-80 rounded-xl p-8">
 | 
				
			||||||
                  <div className="flex justify-center gap-8">
 | 
					                  <div className="flex justify-center gap-8">
 | 
				
			||||||
                    {/* Personal */}
 | 
					                    {/* Personal */}
 | 
				
			||||||
@ -258,21 +235,16 @@ const Header = () => {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
        {/* Search Bar */}
 | 
					        {/* Search Bar */}
 | 
				
			||||||
        <div className="hidden lg:flex items-center flex-1 max-w-xl mx-8">
 | 
					        <div className="hidden lg:flex items-center flex-1 max-w-xl mx-8">
 | 
				
			||||||
          <form onSubmit={handleSearchSubmit} className="relative w-full">
 | 
					          <div className="relative w-full">
 | 
				
			||||||
            <input
 | 
					            <input
 | 
				
			||||||
              type="text"
 | 
					              type="text"
 | 
				
			||||||
              placeholder="Pencarian..."
 | 
					              placeholder="Pencarian..."
 | 
				
			||||||
              value={searchQuery}
 | 
					 | 
				
			||||||
              onChange={handleSearch}
 | 
					 | 
				
			||||||
              className="w-full h-12 px-4 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-[#5a55ff]"
 | 
					              className="w-full h-12 px-4 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-[#5a55ff]"
 | 
				
			||||||
            />
 | 
					            />
 | 
				
			||||||
            <button
 | 
					            <button className="absolute right-4 top-1/2 -translate-y-1/2 text-gray-500 hover:text-[#5a55ff]">
 | 
				
			||||||
              type="submit"
 | 
					 | 
				
			||||||
              className="absolute right-4 top-1/2 -translate-y-1/2 text-gray-500 hover:text-[#5a55ff]"
 | 
					 | 
				
			||||||
            >
 | 
					 | 
				
			||||||
              <img src={search || "/placeholder.svg"} alt="search" className="w-5 h-5" />
 | 
					              <img src={search || "/placeholder.svg"} alt="search" className="w-5 h-5" />
 | 
				
			||||||
            </button>
 | 
					            </button>
 | 
				
			||||||
          </form>
 | 
					          </div>
 | 
				
			||||||
        </div>
 | 
					        </div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        {/* Konsultasi Button */}
 | 
					        {/* Konsultasi Button */}
 | 
				
			||||||
 | 
				
			|||||||
@ -54,7 +54,7 @@ function Kenapa() {
 | 
				
			|||||||
        {/* Text Section */}
 | 
					        {/* Text Section */}
 | 
				
			||||||
        <motion.div 
 | 
					        <motion.div 
 | 
				
			||||||
          ref={listRef}
 | 
					          ref={listRef}
 | 
				
			||||||
          className="w-full md:w-[40%] p-6 md:p-10 flex flex-col items-center md:items-start md:mr-28 text-center md:text-left"
 | 
					          className="w-full md:w-1/2 p-6 md:p-10 flex flex-col items-center md:items-start md:mr-28 text-center md:text-left"
 | 
				
			||||||
          initial={{ opacity: 0, x: 50 }}
 | 
					          initial={{ opacity: 0, x: 50 }}
 | 
				
			||||||
          animate={listInView ? { opacity: 1, x: 0 } : {}}
 | 
					          animate={listInView ? { opacity: 1, x: 0 } : {}}
 | 
				
			||||||
          transition={{ duration: 0.8, delay: 0.3 }}
 | 
					          transition={{ duration: 0.8, delay: 0.3 }}
 | 
				
			||||||
 | 
				
			|||||||
@ -21,7 +21,7 @@ const CustomerService = () => {
 | 
				
			|||||||
            {/* LEFT SECTION - Informasi */}
 | 
					            {/* LEFT SECTION - Informasi */}
 | 
				
			||||||
            <motion.div
 | 
					            <motion.div
 | 
				
			||||||
                ref={leftRef}
 | 
					                ref={leftRef}
 | 
				
			||||||
                className="w-full md:w-[650px] 2xl:w-[750px] h-auto gap-[29px] text-left md:mt-0 lg: 2xl:ml-[-90px]"
 | 
					                className="w-full md:w-[55%] h-auto text-left"
 | 
				
			||||||
                initial="hidden"
 | 
					                initial="hidden"
 | 
				
			||||||
                animate={leftInView ? "visible" : "hidden"}
 | 
					                animate={leftInView ? "visible" : "hidden"}
 | 
				
			||||||
                variants={fadeInLeft}
 | 
					                variants={fadeInLeft}
 | 
				
			||||||
 | 
				
			|||||||
@ -1,43 +1,25 @@
 | 
				
			|||||||
import row from "./arrow.png";
 | 
					import row from './arrow.png';
 | 
				
			||||||
import component11 from "./Component 11.png";
 | 
					import component11 from './Component 11.png';
 | 
				
			||||||
import customer from "./customer.png";
 | 
					import customer from './customer.png';
 | 
				
			||||||
import email from "./email.png";
 | 
					import email from './email.png';
 | 
				
			||||||
import facebook from "./facebook.png";
 | 
					import facebook from './facebook.png';
 | 
				
			||||||
import frame from "./Frame.png";
 | 
					import frame from './Frame.png';
 | 
				
			||||||
import frame27 from "./Frame27.png";
 | 
					import frame27 from './Frame27.png';
 | 
				
			||||||
import img10 from "./image 10.png";
 | 
					import img10 from './image 10.png';
 | 
				
			||||||
import instagram from "./instagram.png";
 | 
					import instagram from './instagram.png';
 | 
				
			||||||
import kmn from "./Dukcapil PNG Pic.png";
 | 
					import kmn from './Dukcapil PNG Pic.png';
 | 
				
			||||||
import kominfo from "./Kominfo PNG Pic.png";
 | 
					import kominfo from './Kominfo PNG Pic.png';
 | 
				
			||||||
import Logo1 from "./logo.png";
 | 
					import Logo1 from './logo.png';
 | 
				
			||||||
import nvidia from "./NVIDIA PNG Pic.png";
 | 
					import nvidia from './NVIDIA PNG Pic.png';
 | 
				
			||||||
import ojk from "./OJK-Rilis-Roadmap-Pasar-Modal-Indonesia-2023-2027.webp";
 | 
					import ojk from './OJK-Rilis-Roadmap-Pasar-Modal-Indonesia-2023-2027.webp';
 | 
				
			||||||
import phone from "./phone.png";
 | 
					import phone from './phone.png';
 | 
				
			||||||
import search from "./search.png";
 | 
					import search from './search.png';
 | 
				
			||||||
import telephone from "./telephone.png";
 | 
					import telephone from './telephone.png';
 | 
				
			||||||
import wagreen from "./whatsapp-color_svgrepo.com.png";
 | 
					import wagreen from './whatsapp-color_svgrepo.com.png';
 | 
				
			||||||
import wabutton from "./Whatsapp22.png";
 | 
					import wabutton from './Whatsapp22.png';
 | 
				
			||||||
import x from "./x.png";
 | 
					import x from './x.png';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export {
 | 
					
 | 
				
			||||||
  row,
 | 
					export{
 | 
				
			||||||
  component11,
 | 
					    row,component11,customer,email,facebook,frame,frame27,img10,instagram,kmn,kominfo,Logo1,nvidia,ojk,phone,search,telephone,wagreen,wabutton,x
 | 
				
			||||||
  customer,
 | 
					}
 | 
				
			||||||
  email,
 | 
					 | 
				
			||||||
  facebook,
 | 
					 | 
				
			||||||
  frame,
 | 
					 | 
				
			||||||
  frame27,
 | 
					 | 
				
			||||||
  img10,
 | 
					 | 
				
			||||||
  instagram,
 | 
					 | 
				
			||||||
  kmn,
 | 
					 | 
				
			||||||
  kominfo,
 | 
					 | 
				
			||||||
  Logo1,
 | 
					 | 
				
			||||||
  nvidia,
 | 
					 | 
				
			||||||
  ojk,
 | 
					 | 
				
			||||||
  phone,
 | 
					 | 
				
			||||||
  search,
 | 
					 | 
				
			||||||
  telephone,
 | 
					 | 
				
			||||||
  wagreen,
 | 
					 | 
				
			||||||
  wabutton,
 | 
					 | 
				
			||||||
  x,
 | 
					 | 
				
			||||||
};
 | 
					 | 
				
			||||||
@ -87,7 +87,7 @@ export const data = {
 | 
				
			|||||||
          {
 | 
					          {
 | 
				
			||||||
            title: "Pengurangan Risiko Fraud",
 | 
					            title: "Pengurangan Risiko Fraud",
 | 
				
			||||||
            description:
 | 
					            description:
 | 
				
			||||||
              "Cegah potensi penipuan dengan verifikasi data yang komprehensif dan terintegrasi.3",
 | 
					              "Cegah potensi penipuan dengan verifikasi data yang komprehensif dan terintegrasi.",
 | 
				
			||||||
            icon: maskcek
 | 
					            icon: maskcek
 | 
				
			||||||
          }
 | 
					          }
 | 
				
			||||||
        ]
 | 
					        ]
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user