Compare commits
No commits in common. "main" and "b0c0bdedd187937c21376c8428c8858492646136" have entirely different histories.
main
...
b0c0bdedd1
|
|
@ -1,8 +0,0 @@
|
||||||
# React + Vite
|
|
||||||
|
|
||||||
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
|
|
||||||
|
|
||||||
Currently, two official plugins are available:
|
|
||||||
|
|
||||||
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
|
|
||||||
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
|
|
||||||
39
index.html
|
|
@ -1,20 +1,23 @@
|
||||||
<!doctype html>
|
<!doctype html> <!-- Menandakan bahwa ini adalah dokumen HTML5 -->
|
||||||
<html lang="en">
|
<html lang="en"> <!-- Menentukan bahasa utama dari halaman adalah bahasa Inggris -->
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" /> <!-- Menentukan karakter encoding untuk halaman ini (UTF-8 mencakup banyak karakter internasional) -->
|
||||||
|
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <!-- Menentukan favicon halaman (ikon kecil di tab browser) -->
|
||||||
|
|
||||||
|
<!-- Mengimpor font 'Montserrat' dari Google Fonts untuk digunakan di seluruh halaman -->
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
|
||||||
|
|
||||||
<head>
|
<!-- Menentukan viewport untuk memastikan aplikasi responsif pada perangkat mobile (agar skalanya sesuai dengan lebar layar perangkat) -->
|
||||||
<meta charset="UTF-8" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<!-- Menentukan judul halaman yang akan ditampilkan di tab browser -->
|
||||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
<title>Vite + React</title>
|
||||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
</head>
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap"
|
<body>
|
||||||
rel="stylesheet">
|
<!-- Elemen dengan id 'root' adalah tempat di mana aplikasi React akan di-render -->
|
||||||
<title>REKAN AI</title>
|
<div id="root"></div>
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
<!-- Menyisipkan script utama aplikasi React. Menggunakan 'type="module"' karena kita menggunakan ES Modules -->
|
||||||
<div id="root"></div>
|
<script type="module" src="/src/main.jsx"></script>
|
||||||
<script type="module" src="/src/main.jsx"></script>
|
</body>
|
||||||
</body>
|
</html>
|
||||||
|
|
||||||
</html>
|
|
||||||
|
|
|
||||||
|
|
@ -1,19 +1,15 @@
|
||||||
{
|
{
|
||||||
"name": "rekan-ai-tailwind",
|
"name": "rekanaiv3",
|
||||||
"version": "0.0.0",
|
"version": "0.0.0",
|
||||||
"lockfileVersion": 3,
|
"lockfileVersion": 3,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
"name": "rekan-ai-tailwind",
|
"name": "rekanaiv3",
|
||||||
"version": "0.0.0",
|
"version": "0.0.0",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"framer-motion": "^12.4.3",
|
|
||||||
"react": "^18.3.1",
|
"react": "^18.3.1",
|
||||||
"react-dom": "^18.3.1",
|
"react-dom": "^18.3.1"
|
||||||
"react-google-recaptcha": "^3.1.0",
|
|
||||||
"react-intersection-observer": "^9.15.1",
|
|
||||||
"react-router-dom": "^7.1.3"
|
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@eslint/js": "^9.17.0",
|
"@eslint/js": "^9.17.0",
|
||||||
|
|
@ -1403,12 +1399,6 @@
|
||||||
"@babel/types": "^7.20.7"
|
"@babel/types": "^7.20.7"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@types/cookie": {
|
|
||||||
"version": "0.6.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.6.0.tgz",
|
|
||||||
"integrity": "sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==",
|
|
||||||
"license": "MIT"
|
|
||||||
},
|
|
||||||
"node_modules/@types/estree": {
|
"node_modules/@types/estree": {
|
||||||
"version": "1.0.6",
|
"version": "1.0.6",
|
||||||
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz",
|
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz",
|
||||||
|
|
@ -2032,15 +2022,6 @@
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
"node_modules/cookie": {
|
|
||||||
"version": "1.0.2",
|
|
||||||
"resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz",
|
|
||||||
"integrity": "sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==",
|
|
||||||
"license": "MIT",
|
|
||||||
"engines": {
|
|
||||||
"node": ">=18"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/cross-spawn": {
|
"node_modules/cross-spawn": {
|
||||||
"version": "7.0.6",
|
"version": "7.0.6",
|
||||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
|
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
|
||||||
|
|
@ -2865,33 +2846,6 @@
|
||||||
"url": "https://github.com/sponsors/rawify"
|
"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": {
|
"node_modules/fsevents": {
|
||||||
"version": "2.3.3",
|
"version": "2.3.3",
|
||||||
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
|
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
|
||||||
|
|
@ -3212,15 +3166,6 @@
|
||||||
"node": ">= 0.4"
|
"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": {
|
"node_modules/ignore": {
|
||||||
"version": "5.3.2",
|
"version": "5.3.2",
|
||||||
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
|
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
|
||||||
|
|
@ -3959,21 +3904,6 @@
|
||||||
"node": ">=16 || 14 >=14.17"
|
"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": {
|
"node_modules/ms": {
|
||||||
"version": "2.1.3",
|
"version": "2.1.3",
|
||||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
|
||||||
|
|
@ -4050,6 +3980,7 @@
|
||||||
"version": "4.1.1",
|
"version": "4.1.1",
|
||||||
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
|
||||||
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
|
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
|
||||||
|
"dev": true,
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=0.10.0"
|
"node": ">=0.10.0"
|
||||||
|
|
@ -4536,6 +4467,7 @@
|
||||||
"version": "15.8.1",
|
"version": "15.8.1",
|
||||||
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
|
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
|
||||||
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
|
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
|
||||||
|
"dev": true,
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"loose-envify": "^1.4.0",
|
"loose-envify": "^1.4.0",
|
||||||
|
|
@ -4586,19 +4518,6 @@
|
||||||
"node": ">=0.10.0"
|
"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": {
|
"node_modules/react-dom": {
|
||||||
"version": "18.3.1",
|
"version": "18.3.1",
|
||||||
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
|
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
|
||||||
|
|
@ -4612,38 +4531,11 @@
|
||||||
"react": "^18.3.1"
|
"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-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": {
|
"node_modules/react-is": {
|
||||||
"version": "16.13.1",
|
"version": "16.13.1",
|
||||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||||
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
|
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
|
||||||
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
"node_modules/react-refresh": {
|
"node_modules/react-refresh": {
|
||||||
|
|
@ -4656,46 +4548,6 @@
|
||||||
"node": ">=0.10.0"
|
"node": ">=0.10.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"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==",
|
|
||||||
"license": "MIT",
|
|
||||||
"dependencies": {
|
|
||||||
"@types/cookie": "^0.6.0",
|
|
||||||
"cookie": "^1.0.1",
|
|
||||||
"set-cookie-parser": "^2.6.0",
|
|
||||||
"turbo-stream": "2.4.0"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=20.0.0"
|
|
||||||
},
|
|
||||||
"peerDependencies": {
|
|
||||||
"react": ">=18",
|
|
||||||
"react-dom": ">=18"
|
|
||||||
},
|
|
||||||
"peerDependenciesMeta": {
|
|
||||||
"react-dom": {
|
|
||||||
"optional": true
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"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==",
|
|
||||||
"license": "MIT",
|
|
||||||
"dependencies": {
|
|
||||||
"react-router": "7.1.3"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=20.0.0"
|
|
||||||
},
|
|
||||||
"peerDependencies": {
|
|
||||||
"react": ">=18",
|
|
||||||
"react-dom": ">=18"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/read-cache": {
|
"node_modules/read-cache": {
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
|
||||||
|
|
@ -4939,12 +4791,6 @@
|
||||||
"semver": "bin/semver.js"
|
"semver": "bin/semver.js"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/set-cookie-parser": {
|
|
||||||
"version": "2.7.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz",
|
|
||||||
"integrity": "sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==",
|
|
||||||
"license": "MIT"
|
|
||||||
},
|
|
||||||
"node_modules/set-function-length": {
|
"node_modules/set-function-length": {
|
||||||
"version": "1.2.2",
|
"version": "1.2.2",
|
||||||
"resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
|
"resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
|
||||||
|
|
@ -5482,18 +5328,6 @@
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "Apache-2.0"
|
"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",
|
|
||||||
"integrity": "sha512-FHncC10WpBd2eOmGwpmQsWLDoK4cqsA/UT/GqNoaKOQnT8uzhtCbg3EoUDMvqpOSAI0S26mr0rkjzbOO6S3v1g==",
|
|
||||||
"license": "ISC"
|
|
||||||
},
|
|
||||||
"node_modules/type-check": {
|
"node_modules/type-check": {
|
||||||
"version": "0.4.0",
|
"version": "0.4.0",
|
||||||
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
|
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"name": "rekan-ai-tailwind",
|
"name": "rekanaiv3",
|
||||||
"private": true,
|
"private": true,
|
||||||
"version": "0.0.0",
|
"version": "0.0.0",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
|
|
@ -10,12 +10,8 @@
|
||||||
"preview": "vite preview"
|
"preview": "vite preview"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"framer-motion": "^12.4.3",
|
|
||||||
"react": "^18.3.1",
|
"react": "^18.3.1",
|
||||||
"react-dom": "^18.3.1",
|
"react-dom": "^18.3.1"
|
||||||
"react-google-recaptcha": "^3.1.0",
|
|
||||||
"react-intersection-observer": "^9.15.1",
|
|
||||||
"react-router-dom": "^7.1.3"
|
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@eslint/js": "^9.17.0",
|
"@eslint/js": "^9.17.0",
|
||||||
|
|
|
||||||
36
src/App.jsx
|
|
@ -1,25 +1,23 @@
|
||||||
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
|
import Header from "./componen/Header/Header"; // Mengimpor komponen Header untuk ditampilkan di bagian atas halaman
|
||||||
import Contact from "./pages/Contact"
|
import CustomerService from "./componen/customer/CustomerService"; // Mengimpor komponen CustomerService untuk menampilkan informasi layanan pelanggan
|
||||||
import Home from "./pages/Home"
|
import FormSection from "./componen/form/FormSection"; // Mengimpor komponen FormSection yang berisi form
|
||||||
import FormSection from "./components/contact/FormSection"
|
import FAQ from "./componen/faq/FAQSection"; // Mengimpor komponen FAQ untuk menampilkan bagian pertanyaan yang sering diajukan
|
||||||
import SolusiPersonal from "./pages/SolusiPersonal"
|
import BottomCTA from "./componen/bottom/BottomCTA"; // Mengimpor komponen BottomCTA untuk panggilan aksi di bagian bawah halaman
|
||||||
import SolusiStartup from "./pages/SolusiStartup"
|
import Footer from "./componen/footer/Footer"; // Mengimpor komponen Footer untuk menampilkan bagian footer
|
||||||
import SolusiCorporate from "./pages/SolusiCorporate"
|
import WhatsAppButton from "./componen/whatsappbutton/whatsappbutton"; // Mengimpor komponen WhatsAppButton untuk menampilkan tombol WhatsApp
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
return (
|
return (
|
||||||
<Router>
|
<>
|
||||||
<Routes>
|
<Header /> {/* Menampilkan komponen Header */}
|
||||||
<Route path='/' element={<Home/>}/>
|
<CustomerService /> {/* Menampilkan komponen CustomerService */}
|
||||||
<Route path='/Contact' element={<Contact/>}/>
|
<FormSection /> {/* Menampilkan komponen FormSection */}
|
||||||
<Route path='/FormSection' element={<FormSection/>}/>
|
<FAQ /> {/* Menampilkan komponen FAQ */}
|
||||||
<Route path='/SolusiPersonal' element={<SolusiPersonal/>}/>
|
<BottomCTA /> {/* Menampilkan komponen BottomCTA */}
|
||||||
<Route path='/SolusiStartup' element={<SolusiStartup/>}/>
|
<Footer /> {/* Menampilkan komponen Footer */}
|
||||||
<Route path='/SolusiCorporate' element={<SolusiCorporate/>}/>
|
<WhatsAppButton /> {/* Menampilkan komponen WhatsAppButton */}
|
||||||
</Routes>
|
</>
|
||||||
</Router>
|
|
||||||
|
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
export default App
|
export default App;
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 9.7 KiB |
|
Before Width: | Height: | Size: 331 KiB |
|
Before Width: | Height: | Size: 328 KiB |
|
Before Width: | Height: | Size: 577 KiB |
|
Before Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 782 B |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 2.4 KiB |
|
Before Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 2.2 KiB |
|
Before Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 4.1 KiB |
|
Before Width: | Height: | Size: 7.5 KiB |
|
Before Width: | Height: | Size: 2.4 KiB |
|
Before Width: | Height: | Size: 307 KiB |
|
Before Width: | Height: | Size: 307 KiB |
|
Before Width: | Height: | Size: 307 KiB |
|
Before Width: | Height: | Size: 102 KiB |
|
Before Width: | Height: | Size: 67 KiB |
|
Before Width: | Height: | Size: 81 KiB |
|
Before Width: | Height: | Size: 68 KiB |
|
Before Width: | Height: | Size: 124 KiB |
|
Before Width: | Height: | Size: 57 KiB |
|
Before Width: | Height: | Size: 58 KiB |
|
Before Width: | Height: | Size: 65 KiB |
|
Before Width: | Height: | Size: 70 KiB |
|
Before Width: | Height: | Size: 81 KiB |
|
Before Width: | Height: | Size: 94 KiB |
|
Before Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 69 KiB |
|
Before Width: | Height: | Size: 8.8 KiB |
|
Before Width: | Height: | Size: 56 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 5.3 KiB |
|
Before Width: | Height: | Size: 1.4 MiB |
|
Before Width: | Height: | Size: 1.4 MiB |
|
Before Width: | Height: | Size: 576 B |
|
Before Width: | Height: | Size: 833 B |
|
Before Width: | Height: | Size: 715 B |
|
Before Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 930 B |
|
Before Width: | Height: | Size: 130 KiB |
|
Before Width: | Height: | Size: 629 KiB |
|
Before Width: | Height: | Size: 4.2 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 16 KiB |
|
Before Width: | Height: | Size: 3.5 KiB |
|
Before Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 4.2 KiB |
|
Before Width: | Height: | Size: 8.8 KiB |
|
Before Width: | Height: | Size: 5.2 KiB |
|
Before Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 8.5 KiB |
|
Before Width: | Height: | Size: 5.3 KiB |
|
Before Width: | Height: | Size: 6.4 KiB |
|
Before Width: | Height: | Size: 8.3 KiB |
|
Before Width: | Height: | Size: 8.9 KiB |
|
Before Width: | Height: | Size: 5.3 KiB |
|
Before Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 6.2 KiB |
|
Before Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 4.2 KiB |
|
Before Width: | Height: | Size: 7.8 KiB |
|
Before Width: | Height: | Size: 4.5 KiB |
|
Before Width: | Height: | Size: 4.7 KiB |
|
Before Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 846 B |
|
Before Width: | Height: | Size: 862 B |
|
Before Width: | Height: | Size: 653 B |
|
Before Width: | Height: | Size: 265 B |
|
Before Width: | Height: | Size: 881 B |
|
Before Width: | Height: | Size: 576 B |
|
|
@ -1,88 +0,0 @@
|
||||||
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 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';
|
|
||||||
import waButton from './image/Frame 27.png';
|
|
||||||
import waIcon from './image/whatsapp-color_svgrepo.com (1).png';
|
|
||||||
import homeImg from './image/Pic Beranda Rekan AI.png';
|
|
||||||
import card1 from './image/rekan hr.png';
|
|
||||||
import card2 from './image/rekan doku.png';
|
|
||||||
import card3 from './image/rekan llm.png';
|
|
||||||
import card4 from './image/rekan veri.png';
|
|
||||||
import chek from './image/cheklist.png';
|
|
||||||
import waIcon2 from './image/whatsapp-color_svgrepo.com.png'
|
|
||||||
import L1 from './image/Frame 811520.png'
|
|
||||||
import L3 from './image/Frame 811523.png'
|
|
||||||
import L2 from './image/Frame 811521.png'
|
|
||||||
import L4 from './image/Frame 811522.png'
|
|
||||||
import R1 from './image/Frame 811517.png'
|
|
||||||
import R3 from './image/Frame 811518.png'
|
|
||||||
import R2 from './image/Frame 811516.png'
|
|
||||||
import R4 from './image/Frame 811519.png'
|
|
||||||
import bgcBanner from './image/image 10.png'
|
|
||||||
import imgLeft from './image/Component 4.png';
|
|
||||||
import chek2 from './image/cheklist.png';
|
|
||||||
import circle1 from './image/Ellipse 2.png';
|
|
||||||
import circle2 from './image/Ellipse 3.png';
|
|
||||||
import mitraImg from "./image/Frame 811516 (3).png";
|
|
||||||
import arrow1 from "./image/slider/Vector (1).png";
|
|
||||||
import arrow2 from "./image/slider/Vector.png";
|
|
||||||
import swipper1 from "./image/slider/1.png";
|
|
||||||
import swipper2 from "./image/slider/2.png";
|
|
||||||
import swipper3 from "./image/slider/3.png";
|
|
||||||
import swipper4 from "./image/slider/4.png";
|
|
||||||
import swipper5 from "./image/slider/5.png";
|
|
||||||
import swipper6 from "./image/slider/6.png";
|
|
||||||
import swipper7 from "./image/slider/7.png";
|
|
||||||
import swipper8 from "./image/slider/8.png";
|
|
||||||
import swipper9 from "./image/slider/9.png";
|
|
||||||
import swipper10 from "./image/slider/10.png";
|
|
||||||
import swipper11 from "./image/slider/11.png";
|
|
||||||
import swipper12 from "./image/slider/12.png";
|
|
||||||
import swipper13 from "./image/slider/13.png";
|
|
||||||
import swipper14 from "./image/slider/14.png";
|
|
||||||
import swipper15 from "./image/slider/15.png";
|
|
||||||
import swipper16 from "./image/slider/16.png";
|
|
||||||
import swipper17 from "./image/slider/17.png";
|
|
||||||
import swipper18 from "./image/slider/18.png";
|
|
||||||
import swipper19 from "./image/slider/19.png";
|
|
||||||
import swipper20 from "./image/slider/20.png";
|
|
||||||
import swipper21 from "./image/slider/21.png";
|
|
||||||
import swipper22 from "./image/slider/22.png";
|
|
||||||
import swipper23 from "./image/slider/23.png";
|
|
||||||
import swipper24 from "./image/slider/24.png";
|
|
||||||
import bgSwiper from "./image/image 16.png";
|
|
||||||
import imgLeft2 from './image/Frame 811531.png';
|
|
||||||
import imgLeft1 from './image/Frame 811530.png';
|
|
||||||
import imgLeft3 from './image/Frame 811533.png';
|
|
||||||
import imgRight from './image/Component 6.png';
|
|
||||||
import nvdia from "./image/NVIDIA PNG Pic.png";
|
|
||||||
import kmn from "./image/Dukcapil PNG Pic.png";
|
|
||||||
import kominfo from "./image/Kominfo PNG Pic.png";
|
|
||||||
import ojk from "./image/OJK-Rilis-Roadmap-Pasar-Modal-Indonesia-2023-2027.webp";
|
|
||||||
import facebook from "./image/fb.png";
|
|
||||||
import x from "./image/twitter.png";
|
|
||||||
import instagram from "./image/ig.png";
|
|
||||||
import frame from "./image/Component 11.png";
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export{
|
|
||||||
Logo1, search,row,row2,homeLogo,waIcon,homeImg,card1,card2,card3,card4,chek,
|
|
||||||
waIcon2,waButton,L1,L2,L3,L4,R1,R2,R3,R4,bgcBanner,imgLeft,chek2,circle1,circle2,
|
|
||||||
mitraImg,arrow1,arrow2,swipper1,swipper2,swipper3,swipper4,swipper5,swipper6,
|
|
||||||
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,ProdukDoku,ProdukHr,ProdukVeri,ProdukLlm
|
|
||||||
}
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z"></path></svg>
|
|
||||||
|
Before Width: | Height: | Size: 4.0 KiB |
|
|
@ -0,0 +1,102 @@
|
||||||
|
import { useState } from 'react';
|
||||||
|
import { Logo1,search,row } from '../asset'; // Mengimpor logo
|
||||||
|
|
||||||
|
const Header = () => {
|
||||||
|
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); // Menyimpan status menu mobile (terbuka atau tertutup)
|
||||||
|
|
||||||
|
return (
|
||||||
|
<header className="fixed top-0 left-0 w-full z-50 font-montserrat bg-white shadow-md">
|
||||||
|
<nav className="flex items-center justify-between px-5 sm:px-10 md:px-20 py-3 gap-4 flex-wrap relative">
|
||||||
|
{/* Logo */}
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<img src={Logo1} alt="Logo" className="w-[203px] h-[36.05px]" /> {/* Menampilkan logo dengan ukuran spesifik */}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Tombol Hamburger (Responsive) */}
|
||||||
|
<div className="sm:hidden flex items-center">
|
||||||
|
<button
|
||||||
|
onClick={() => setIsMobileMenuOpen(!isMobileMenuOpen)} // Mengubah status menu mobile saat tombol ditekan
|
||||||
|
className="text-[#212121]"
|
||||||
|
>
|
||||||
|
{/* Icon hamburger (menu mobile) */}
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||||
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M4 6h16M4 12h16M4 18h16" />
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Menu Navigasi */}
|
||||||
|
<ul
|
||||||
|
className={`${
|
||||||
|
isMobileMenuOpen ? 'flex' : 'hidden' // Menampilkan menu jika isMobileMenuOpen true, jika tidak disembunyikan
|
||||||
|
} sm:flex flex-col sm:flex-row list-none gap-5 sm:gap-10 absolute sm:relative top-full left-0 sm:top-auto sm:left-auto w-full sm:w-auto bg-white sm:bg-transparent p-5 sm:p-0 shadow-md sm:shadow-none z-40`}
|
||||||
|
>
|
||||||
|
{/* Menu Item Beranda */}
|
||||||
|
<li className="relative group">
|
||||||
|
<a href="#home" className="text-[#212121] text-base transition-colors hover:text-[#5a55ff]">
|
||||||
|
Beranda
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
{/* Menu Item Produk */}
|
||||||
|
<li className="relative group">
|
||||||
|
<a href="#produk" className="text-[#212121] text-base transition-colors hover:text-[#5a55ff] flex items-center">
|
||||||
|
Produk
|
||||||
|
<img src={row} alt="arrow" className="ml-1" /> {/* Ikon panah untuk dropdown Produk */}
|
||||||
|
</a>
|
||||||
|
{/* Dropdown menu untuk Produk */}
|
||||||
|
<ul className="absolute left-0 top-full hidden w-40 bg-white list-none py-2 shadow-lg group-hover:block z-50">
|
||||||
|
<li className="px-5 py-2 hover:text-[#5a55ff]">
|
||||||
|
<a href="#produk1" className="text-[#212121]">Produk 1</a>
|
||||||
|
</li>
|
||||||
|
<li className="px-5 py-2 hover:text-[#5a55ff]">
|
||||||
|
<a href="#produk2" className="text-[#212121]">Produk 2</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
{/* Menu Item Solusi */}
|
||||||
|
<li className="relative group">
|
||||||
|
<a href="#solusi" className="text-[#212121] text-base transition-colors hover:text-[#5a55ff] flex items-center">
|
||||||
|
Solusi
|
||||||
|
<img src={row} alt="arrow" className="ml-1" /> {/* Ikon panah untuk dropdown Solusi */}
|
||||||
|
</a>
|
||||||
|
{/* Dropdown menu untuk Solusi */}
|
||||||
|
<ul className="absolute left-0 top-full hidden w-40 bg-white list-none py-2 shadow-lg group-hover:block z-50">
|
||||||
|
<li className="px-5 py-2 hover:text-[#5a55ff]">
|
||||||
|
<a href="#solusi1" className="text-[#212121]">Solusi 1</a>
|
||||||
|
</li>
|
||||||
|
<li className="px-5 py-2 hover:text-[#5a55ff]">
|
||||||
|
<a href="#solusi2" className="text-[#212121]">Solusi 2</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
{/* Menu Item Hubungi Kami */}
|
||||||
|
<li>
|
||||||
|
<a href="#hubungi" className="text-[#212121] text-base transition-colors hover:text-[#5a55ff]">
|
||||||
|
Hubungi Kami
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
{/* Pencarian */}
|
||||||
|
<div className="relative flex items-center gap-2 w-full sm:w-auto order-2 sm:order-none">
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Pencarian..."
|
||||||
|
className="w-full sm:w-[592px] h-12 px-4 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-[#5a55ff]" // Field input pencarian
|
||||||
|
/>
|
||||||
|
{/* Tombol Pencarian */}
|
||||||
|
<button className="absolute right-4 sm:right-2 text-gray-500 hover:text-[#5a55ff]">
|
||||||
|
<img src={search} alt="search" className="w-5 h-5" /> {/* Menampilkan ikon pencarian */}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Tombol Konsultasi */}
|
||||||
|
<button className="bg-[#DC0168] text-white px-5 py-2 text-sm font-bold rounded-md hover:bg-[#e6006e] transition order-3 sm:order-none w-full sm:w-auto mt-3 sm:mt-0">
|
||||||
|
Konsultasi Gratis
|
||||||
|
</button>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Header;
|
||||||
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 3.0 KiB |
|
Before Width: | Height: | Size: 9.1 KiB After Width: | Height: | Size: 9.1 KiB |
|
Before Width: | Height: | Size: 7.5 KiB After Width: | Height: | Size: 7.5 KiB |
|
Before Width: | Height: | Size: 958 B After Width: | Height: | Size: 958 B |
|
Before Width: | Height: | Size: 266 B After Width: | Height: | Size: 266 B |
|
Before Width: | Height: | Size: 285 KiB After Width: | Height: | Size: 285 KiB |
|
Before Width: | Height: | Size: 4.5 KiB After Width: | Height: | Size: 4.5 KiB |
|
Before Width: | Height: | Size: 715 B After Width: | Height: | Size: 715 B |
|
Before Width: | Height: | Size: 206 KiB After Width: | Height: | Size: 206 KiB |
|
|
@ -7,11 +7,11 @@ 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 './kementerian.png';
|
||||||
import kominfo from './Kominfo PNG Pic.png';
|
import kominfo from './kominfo.png';
|
||||||
import Logo1 from './logo.png';
|
import Logo1 from './logo.png';
|
||||||
import nvidia from './NVIDIA PNG Pic.png';
|
import nvidia from './nvidia.png';
|
||||||
import ojk from './OJK-Rilis-Roadmap-Pasar-Modal-Indonesia-2023-2027.webp';
|
import ojk from './ojk.png';
|
||||||
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';
|
||||||
|
Before Width: | Height: | Size: 930 B After Width: | Height: | Size: 930 B |