diff --git a/package-lock.json b/package-lock.json index 306499a..e495e05 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,8 @@ "name": "orus", "version": "0.1.0", "dependencies": { + "framer-motion": "^12.23.24", + "lucide-react": "^0.555.0", "next": "16.0.6", "react": "19.2.0", "react-dom": "19.2.0" @@ -1061,6 +1063,33 @@ "node": ">=10.13.0" } }, + "node_modules/framer-motion": { + "version": "12.23.24", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-12.23.24.tgz", + "integrity": "sha512-HMi5HRoRCTou+3fb3h9oTLyJGBxHfW+HnNE25tAXOvVx/IvwMHK0cx7IR4a2ZU6sh3IX1Z+4ts32PcYBOqka8w==", + "license": "MIT", + "dependencies": { + "motion-dom": "^12.23.23", + "motion-utils": "^12.23.6", + "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/graceful-fs": { "version": "4.2.11", "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz", @@ -1339,6 +1368,15 @@ "url": "https://opencollective.com/parcel" } }, + "node_modules/lucide-react": { + "version": "0.555.0", + "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.555.0.tgz", + "integrity": "sha512-D8FvHUGbxWBRQM90NZeIyhAvkFfsh3u9ekrMvJ30Z6gnpBHS6HC6ldLg7tL45hwiIz/u66eKDtdA23gwwGsAHA==", + "license": "ISC", + "peerDependencies": { + "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0" + } + }, "node_modules/magic-string": { "version": "0.30.21", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz", @@ -1349,6 +1387,21 @@ "@jridgewell/sourcemap-codec": "^1.5.5" } }, + "node_modules/motion-dom": { + "version": "12.23.23", + "resolved": "https://registry.npmjs.org/motion-dom/-/motion-dom-12.23.23.tgz", + "integrity": "sha512-n5yolOs0TQQBRUFImrRfs/+6X4p3Q4n1dUEqt/H58Vx7OW6RF+foWEgmTVDhIWJIMXOuNNL0apKH2S16en9eiA==", + "license": "MIT", + "dependencies": { + "motion-utils": "^12.23.6" + } + }, + "node_modules/motion-utils": { + "version": "12.23.6", + "resolved": "https://registry.npmjs.org/motion-utils/-/motion-utils-12.23.6.tgz", + "integrity": "sha512-eAWoPgr4eFEOFfg2WjIsMoqJTW6Z8MTUCgn/GZ3VRpClWBdnbjryiA3ZSNLyxCTmCQx4RmYX6jX1iWHbenUPNQ==", + "license": "MIT" + }, "node_modules/nanoid": { "version": "3.3.11", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz", diff --git a/package.json b/package.json index e5e4c62..6a93590 100644 --- a/package.json +++ b/package.json @@ -8,6 +8,8 @@ "start": "next start" }, "dependencies": { + "framer-motion": "^12.23.24", + "lucide-react": "^0.555.0", "next": "16.0.6", "react": "19.2.0", "react-dom": "19.2.0" diff --git a/public/file.svg b/public/file.svg deleted file mode 100644 index 004145c..0000000 --- a/public/file.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/globe.svg b/public/globe.svg deleted file mode 100644 index 567f17b..0000000 --- a/public/globe.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/next.svg b/public/next.svg deleted file mode 100644 index 5174b28..0000000 --- a/public/next.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/orus-logo.svg b/public/orus-logo.svg new file mode 100644 index 0000000..4455a3a --- /dev/null +++ b/public/orus-logo.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/orus.svg b/public/orus.svg new file mode 100644 index 0000000..c668cc1 --- /dev/null +++ b/public/orus.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/vercel.svg b/public/vercel.svg deleted file mode 100644 index 7705396..0000000 --- a/public/vercel.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/window.svg b/public/window.svg deleted file mode 100644 index b2b2a44..0000000 --- a/public/window.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/app/page.tsx b/src/app/page.tsx index 295f8fd..8165a61 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,65 +1,403 @@ -import Image from "next/image"; +"use client"; + +import React, { useState, useEffect } from "react"; +import { motion } from "framer-motion"; +import { + Github, + MessageSquare, + Shield, + Code2, + Rocket, + Users, + Heart, + ArrowRight, + ExternalLink, + Lock, + Terminal, + Sparkles, +} from "lucide-react"; + +export default function HomePage() { + const [mounted, setMounted] = useState(false); + + useEffect(() => { + setMounted(true); + }, []); + + const features = [ + { + icon: Heart, + title: "Open Source First", + description: + "We love the open source community and all our projects are completely open source for everyone to use and contribute.", + }, + { + icon: Users, + title: "Growing Community", + description: + "Join our thriving community full of beginners and pros. Learn, collaborate, and grow together.", + }, + { + icon: Shield, + title: "Cybersecurity & Dev", + description: + "Building tools for developers and cybersecurity enthusiasts. Security-first approach to everything we create.", + }, + ]; + + const values = [ + { + icon: Rocket, + title: "For Startups", + description: + "Empowering startups with the tools and community they need to succeed", + }, + { + icon: Code2, + title: "Developer Tools", + description: + "Creating powerful, intuitive tools that make developers' lives easier", + }, + { + icon: Lock, + title: "Security Focused", + description: + "Building with security in mind from day one, every single time", + }, + ]; + + const containerVariants = { + hidden: { opacity: 0 }, + visible: { + opacity: 1, + transition: { + staggerChildren: 0.1, + }, + }, + }; + + const itemVariants = { + hidden: { y: 20, opacity: 0 }, + visible: { + y: 0, + opacity: 1, + transition: { + duration: 0.5, + }, + }, + }; -export default function Home() { return ( -
-
- Next.js logo + {/* Animated background */} +
+
-
-

- To get started, edit the page.tsx file. -

-

- Looking for a starting point or more instructions? Head over to{" "} - + + {/* Gradient orbs */} +

+ + {/* Navigation */} + + + Logo + + + + + + {/* Hero Section */} + + + + + {/* Features Section */} + +
+ {features.map((feature, i) => ( + +
+
+
+ +
+ +

+ {feature.title} +

+ +

+ {feature.description} +

+
+ + ))} +
+ + + {/* What We Do Section */} + + +

+ Empowering Startups +

+

+ ORUS is an organization dedicated to supporting startups with + cutting-edge tools, security expertise, and a collaborative + community

+
+ +
+ {values.map((value, i) => ( + + +

{value.title}

+

{value.description}

+
+ ))}
-
- - Vercel logomark - Deploy Now - - - Documentation - + + + {/* CTA Section */} + + +
+ +
+

+ Ready to Join ORUS? +

+

+ Whether you're a beginner or a pro, there's a place for you in our + community. Let's build something amazing together. +

+ +
+ + + Join Discord Community + + + + + Explore on GitHub + +
+
+ + + + {/* Footer */} +
+
); }