From a883076c67c5066365b9336ea9ff2a0085bd7592 Mon Sep 17 00:00:00 2001 From: Mohammed Muntasir Rahman Joy Date: Thu, 16 Jul 2026 20:47:40 +0600 Subject: [PATCH 1/2] feat: scaffold initial frontend project structure and marketing layout components --- frontend/package-lock.json | 57 +- frontend/package.json | 1 + .../components/layouts/MarketingLayout.tsx | 15 +- frontend/src/components/ui/Lightfall.tsx | 387 +++++++++++++ frontend/src/components/ui/globe.tsx | 2 +- frontend/src/components/ui/particles.tsx | 2 +- frontend/src/pages/LandingPage.tsx | 507 ++++++++++++------ frontend/src/styles/index.css | 26 + 8 files changed, 809 insertions(+), 188 deletions(-) create mode 100644 frontend/src/components/ui/Lightfall.tsx diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 064e8e5..29c7c48 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -23,6 +23,7 @@ "framer-motion": "^12.40.0", "gsap": "^3.15.0", "lucide-react": "^1.17.0", + "ogl": "^1.0.11", "react": "^19.2.6", "react-dom": "^19.2.6", "react-hook-form": "^7.77.0", @@ -4515,6 +4516,30 @@ "integrity": "sha512-dMW4CWBTUK1AEEDeZc1g4xpPGIrSf9fJF960qbTZmN/QwZIWY5wgliS6JWl9/25fpTGJrMRtSjGtOmPnfjZB+A==", "license": "Standard 'no charge' license: https://gsap.com/standard-license." }, + "node_modules/has-symbols": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz", + "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==", + "license": "MIT", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/hasown": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.4.tgz", + "integrity": "sha512-T2UbfbBEF32wiepXIsMlTW9+dDYC6wMh/t/vYA4tuOMKqWz/n3vr1NFSxQiyP+zk2mXsoMA/i/7qV6LKut1t1A==", + "license": "MIT", + "dependencies": { + "function-bind": "^1.1.2" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/hermes-estree": { "version": "0.25.1", "resolved": "https://registry.npmjs.org/hermes-estree/-/hermes-estree-0.25.1.tgz", @@ -5521,32 +5546,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/motion": { - "version": "12.42.2", - "resolved": "https://registry.npmjs.org/motion/-/motion-12.42.2.tgz", - "integrity": "sha512-Atvv11yUKIid41cVrRBDVX5m8tF8kNpExRSlbpt6APClhDjtwQssgFHhQzejxw7/7YYbjHSPKBVbHo05BuJT5Q==", - "license": "MIT", - "dependencies": { - "framer-motion": "^12.42.2", - "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/motion-dom": { "version": "12.42.2", "resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-12.42.2.tgz", @@ -5675,6 +5674,12 @@ "node": ">= 10" } }, + "node_modules/ogl": { + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/ogl/-/ogl-1.0.11.tgz", + "integrity": "sha512-kUpC154AFfxi16pmZUK4jk3J+8zxwTWGPo03EoYA8QPbzikHoaC82n6pNTbd+oEaJonaE8aPWBlX7ad9zrqLsA==", + "license": "Unlicense" + }, "node_modules/on-finished": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz", diff --git a/frontend/package.json b/frontend/package.json index c244595..f9ecc91 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -25,6 +25,7 @@ "framer-motion": "^12.40.0", "gsap": "^3.15.0", "lucide-react": "^1.17.0", + "ogl": "^1.0.11", "react": "^19.2.6", "react-dom": "^19.2.6", "react-hook-form": "^7.77.0", diff --git a/frontend/src/components/layouts/MarketingLayout.tsx b/frontend/src/components/layouts/MarketingLayout.tsx index 19ff61f..a268430 100644 --- a/frontend/src/components/layouts/MarketingLayout.tsx +++ b/frontend/src/components/layouts/MarketingLayout.tsx @@ -71,8 +71,7 @@ function MarketingNavBar() { }, [location.pathname, location.hash]); const linkClass = (active?: boolean) => - `font-body-ui text-[13px] sm:text-sm transition-colors duration-150 no-underline px-1 ${ - active ? "text-white" : "text-white/65 hover:text-white" + `font-body-ui text-[13px] sm:text-sm transition-colors duration-150 no-underline px-1 ${active ? "text-white" : "text-white/65 hover:text-white" }`; return ( @@ -123,14 +122,12 @@ function MarketingNavBar() { Menu