Skip to content

Commit b3e585b

Browse files
authored
Merge pull request #7 from siddharth-narayan-mishra/main
deployment
2 parents 7541551 + 563b074 commit b3e585b

27 files changed

Lines changed: 1491 additions & 145 deletions

.eslintrc.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,11 +19,12 @@
1919
"plugins": ["react", "react-hooks"],
2020
"rules": {
2121
"react/react-in-jsx-scope": "off",
22-
"no-unused-vars": "warn"
22+
"no-unused-vars": "warn",
23+
"react/prop-types": "off"
2324
},
2425
"settings": {
2526
"react": {
2627
"version": "detect"
2728
}
2829
}
29-
}
30+
}

eslint.config.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ export default [
3838
'warn',
3939
{ allowConstantExport: true },
4040
],
41+
'react/prop-types': 'off',
4142
},
4243
},
4344
];

index.html

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,12 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8" />
5-
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
5+
<link rel="icon" type="image/svg+xml" href="https://res.cloudinary.com/dqcrkrtyr/image/upload/v1734800561/oc_logo_yig1u4.png" />
6+
<link rel="preconnect" href="https://fonts.googleapis.com" />
7+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
8+
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap" rel="stylesheet">
69
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7-
<title>Project Athena</title>
10+
<title>OpenCode</title>
811
</head>
912
<body>
1013
<div id="root"></div>

package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,9 @@
2121
"@babel/core": "^7.0.0",
2222
"@emotion/react": "^11.14.0",
2323
"@emotion/styled": "^11.14.0",
24+
"@gsap/react": "^2.1.1",
25+
"gsap": "^3.12.5",
26+
"lenis": "^1.1.18",
2427
"lucide-react": "^0.468.0",
2528
"react": "^19.0.0",
2629
"react-dom": "^19.0.0",

src/App.jsx

Lines changed: 23 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,28 @@
1-
function App() {
1+
import Lenis from 'lenis';
2+
import Gallery from './components/Gallery/Gallery';
3+
import MeetTheTeam from './components/MeetTheTeam/MeetTheTeam';
4+
import Hero from './components/Hero/hero.jsx';
5+
import Navbar from './components/Navbar/navbar.jsx';
6+
import Footer from './components/Footer/footer.jsx';
7+
import AboutUs from './components/AboutUs/AboutUs.jsx';
8+
9+
// Initialize Lenis
10+
// eslint-disable-next-line no-unused-vars
11+
const lenis = new Lenis({
12+
autoRaf: true,
13+
});
14+
15+
const App = () => {
216
return (
3-
<div className="min-h-screen bg-slate-800 flex justify-center items-center text-white text-7xl flex-col gap-4">
4-
OpenCode
5-
<button className="bg-black rounded-lg text-2xl px-4 py-2 hover:scale-110">
6-
Click me!
7-
</button>
17+
<div>
18+
<Navbar />
19+
<Hero />
20+
<AboutUs />
21+
<Gallery />
22+
<MeetTheTeam />
23+
<Footer />
824
</div>
925
);
10-
}
26+
};
1127

1228
export default App;

src/Playground.jsx

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,28 @@
1-
import Hero from './components/hero.jsx';
2-
import Navbar from './components/navbar.jsx';
3-
import Footer from './components/footer.jsx';
1+
import Lenis from 'lenis';
2+
import Gallery from './components/Gallery/Gallery';
3+
import MeetTheTeam from './components/MeetTheTeam/MeetTheTeam';
4+
import Hero from './components/Hero/hero.jsx';
5+
import Navbar from './components/Navbar/navbar.jsx';
6+
import Footer from './components/Footer/footer.jsx';
7+
import AboutUs from './components/AboutUs/AboutUs.jsx';
48

5-
const Playground = () => {
9+
// Initialize Lenis
10+
// eslint-disable-next-line no-unused-vars
11+
const lenis = new Lenis({
12+
autoRaf: true,
13+
});
14+
15+
const App = () => {
616
return (
717
<div>
818
<Navbar />
919
<Hero />
20+
<AboutUs />
21+
<Gallery />
22+
<MeetTheTeam />
1023
<Footer />
1124
</div>
1225
);
1326
};
1427

15-
export default Playground;
28+
export default App;

src/components/AboutUs/AboutUs.jsx

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
import Heading from '../shared/Heading';
2+
import AnimatedButton from './AnimatedButton';
3+
import TextWithModal from './TextWithModal';
4+
5+
const topics = ['AI/ML', 'Web Dev', 'App Dev', 'Cybersecurity', 'Open-Source'];
6+
7+
const AboutUs = () => {
8+
return (
9+
<div className="h-screen bg-[#060714] sticky top-0 grid place-items-center text-white -z-10 bg-[linear-gradient(180deg,_#0C0C1D_0%,_#070614FA_10%)]">
10+
<img
11+
src="https://res.cloudinary.com/dqcrkrtyr/image/upload/v1733829420/dots_rqtxh8.png"
12+
alt=""
13+
className="absolute h-screen"
14+
/>
15+
<div
16+
id="about-us"
17+
className="relative w-[80%] h-[80%] rounded-xl inset-shadow overflow-hidden border-gradient grid place-items-center"
18+
>
19+
<img
20+
src="https://res.cloudinary.com/dqcrkrtyr/image/upload/v1733829425/light1_l6gwo2.png"
21+
alt=""
22+
className="absolute top-0 h-3/5 -z-10 left-4"
23+
/>
24+
<img
25+
src="https://res.cloudinary.com/dqcrkrtyr/image/upload/v1733829427/light2_zuok5s.png"
26+
alt=""
27+
className="absolute top-0 h-3/5 -z-10 -left-8"
28+
/>
29+
<img
30+
src="https://res.cloudinary.com/dqcrkrtyr/image/upload/v1733829428/light3_etmaya.png"
31+
alt=""
32+
className="absolute top-0 h-3/5 -z-10 left-0"
33+
/>
34+
35+
<div className="flex flex-col items-center gap-8 justify-center basis-1 py-6">
36+
<Heading extraCSS={{ color: '#A546FF', fontFamily: 'Montserrat' }}>
37+
About us.
38+
</Heading>
39+
<TextWithModal />
40+
</div>
41+
<div className="h-full w-full flex flex-wrap gap-2 items-center justify-center pb-12 md:gap-0">
42+
{topics.map((item, idx) => {
43+
return (
44+
<div
45+
className="w-fit md:w-1/3 flex justify-center items-center"
46+
key={idx}
47+
>
48+
<AnimatedButton text={item} />
49+
</div>
50+
);
51+
})}
52+
</div>
53+
</div>
54+
</div>
55+
);
56+
};
57+
58+
export default AboutUs;
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import { useGSAP } from '@gsap/react';
2+
import gsap from 'gsap';
3+
4+
const AnimatedButton = ({ text }) => {
5+
gsap.registerPlugin(useGSAP);
6+
useGSAP(() => {
7+
gsap.to('#rotate-this', {
8+
rotate: '720deg',
9+
duration: 4,
10+
repeat: -1,
11+
ease: 'linear',
12+
});
13+
gsap.to('#rotate-that', {
14+
rotate: '720deg',
15+
duration: 4,
16+
repeat: -1,
17+
ease: 'linear',
18+
});
19+
});
20+
return (
21+
<div
22+
id="container"
23+
className="rounded-lg relative overflow-hidden p-[2px] md:w-52 h-fit"
24+
>
25+
<div
26+
id="rotate-this"
27+
className="absolute bg-gradient-to-br from-[#BC01FE9C] to-[#00000033] w-[110%] aspect-square top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-10"
28+
></div>
29+
<div
30+
id="black-box"
31+
className="bg-[#060714] h-full relative rounded-lg z-20 p-[1.2px]"
32+
>
33+
<div
34+
id="inner-container"
35+
className="h-full rounded-lg relative overflow-hidden p-[1px]"
36+
>
37+
<div
38+
id="rotate-that"
39+
className="absolute bg-gradient-to-br from-[#BC01FE9C] to-[#00000033] w-[110%] aspect-square top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-10"
40+
></div>
41+
<div className="bg-[#060714] h-full rounded-lg relative z-10 inner-shadow">
42+
<div className="inner-shadow w-full h-full rounded-lg justify-center items-center flex bg-gradient-to-b from-[#0E0D20] to-[#482568] font-robotoMono px-6 py-2 md:text-xl text-xs">
43+
{text}
44+
</div>
45+
</div>
46+
</div>
47+
</div>
48+
</div>
49+
);
50+
};
51+
52+
export default AnimatedButton;
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import { useState, useEffect } from 'react';
2+
3+
const TextWithModal = () => {
4+
const [isTruncated, setIsTruncated] = useState(false);
5+
6+
const fullText = `At our core, we are a passionate collective of innovators,
7+
developers, and tech enthusiasts dedicated to pushing the boundaries of
8+
technology. Our mission is to create cutting-edge solutions that solve
9+
real-world problems and drive digital transformation. With a diverse team
10+
of experts spanning multiple domains, we blend creativity, technical
11+
expertise, and a relentless pursuit of excellence to deliver impactful
12+
technological solutions.`;
13+
14+
useEffect(() => {
15+
const checkTextTruncation = () => {
16+
// Adjust this breakpoint as needed
17+
setIsTruncated(window.innerWidth < 768);
18+
};
19+
20+
// Check on mount
21+
checkTextTruncation();
22+
23+
// Add event listener for window resize
24+
window.addEventListener('resize', checkTextTruncation);
25+
26+
// Cleanup listener
27+
return () => {
28+
window.removeEventListener('resize', checkTextTruncation);
29+
};
30+
}, []);
31+
32+
// Function to truncate text
33+
const getTruncatedText = () => {
34+
return fullText.slice(0, 201) + '...';
35+
};
36+
37+
const handleCLick = () => {
38+
console.log('clicked!');
39+
};
40+
41+
return (
42+
<div
43+
className="w-full md:w-4/5 text-center font-robotoMono relative z-10"
44+
onClick={handleCLick}
45+
>
46+
<div className="text-sm md:text-base text-gray-300 px-4">
47+
{isTruncated ? <>{getTruncatedText()}</> : fullText}
48+
</div>
49+
</div>
50+
);
51+
};
52+
53+
export default TextWithModal;
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import Navbar from '../Navbar/navbar';
2+
3+
export default function ComingSoon() {
4+
return (
5+
<main className="min-h-screen bg-[url('/src/assets/hero.png')] bg-cover bg-center flex items-center justify-center px-4 sm:px-6 md:px-8 relative">
6+
<Navbar />
7+
<div className="relative z-10 text-center max-w-4xl mt-20 mx-auto">
8+
<h1 className="text-4xl sm:text-6xl md:text-7xl lg:text-8xl font-montserrat font-bold bg-gradient-to-b from-white to-[#222121] bg-clip-text text-transparent mb-6 sm:mb-8">
9+
COMING SOON
10+
</h1>
11+
<div className="flex flex-col sm:flex-row items-center justify-center gap-4 sm:gap-6">
12+
<a href="https://github.com/OpencodeNIT-R">
13+
<button className="px-4 py-2 shadow-inner-white rounded-[10px] font-medium duration-200 w-[200px] sm:w-auto bg-transparent border border-purple-500/30 text-[#A546FF] hover:bg-[rgb(165,70,255)] hover:text-[#070614] hover:border-[#C3C3C3] transition-colors backdrop-blur-sm text-sm sm:text-base">
14+
<div className="flex flex-row items-center justify-center space-x-2 sm:space-x-3 font-robotoMono">
15+
<svg
16+
xmlns="http://www.w3.org/2000/svg"
17+
viewBox="0 0 24 24"
18+
className="w-4 h-4 sm:w-5 sm:h-5 fill-current"
19+
>
20+
<path d="M10.9,2.1c-4.6,0.5-8.3,4.2-8.8,8.7c-0.5,4.7,2.2,8.9,6.3,10.5C8.7,21.4,9,21.2,9,20.8v-1.6c0,0-0.4,0.1-0.9,0.1 c-1.4,0-2-1.2-2.1-1.9c-0.1-0.4-0.3-0.7-0.6-1C5.1,16.3,5,16.3,5,16.2C5,16,5.3,16,5.4,16c0.6,0,1.1,0.7,1.3,1c0.5,0.8,1.1,1,1.4,1 c0.4,0,0.7-0.1,0.9-0.2c0.1-0.7,0.4-1.4,1-1.8c-2.3-0.5-4-1.8-4-4c0-1.1,0.5-2.2,1.2-3C7.1,8.8,7,8.3,7,7.6c0-0.4,0-0.9,0.2-1.3 C7.2,6.1,7.4,6,7.5,6c0,0,0.1,0,0.1,0C8.1,6.1,9.1,6.4,10,7.3C10.6,7.1,11.3,7,12,7s1.4,0.1,2,0.3c0.9-0.9,2-1.2,2.5-1.3 c0,0,0.1,0,0.1,0c0.2,0,0.3,0.1,0.4,0.3C17,6.7,17,7.2,17,7.6c0,0.8-0.1,1.2-0.2,1.4c0.7,0.8,1.2,1.8,1.2,3c0,2.2-1.7,3.5-4,4 c0.6,0.5,1,1.4,1,2.3v2.6c0,0.3,0.3,0.6,0.7,0.5c3.7-1.5,6.3-5.1,6.3-9.3C22,6.1,16.9,1.4,10.9,2.1z" />
21+
</svg>
22+
<span>GitHub</span>
23+
</div>
24+
</button>
25+
</a>
26+
<a href="https://resourcesopencode.notion.site/A-Z-Resources-Opencode-a5750981094c46b4b07f2f85dea6e6e3">
27+
<button className="px-4 py-2 shadow-inner-white rounded-[10px] font-medium duration-200 w-[200px] sm:w-auto bg-[rgb(165,70,255)] border border-[#C3C3C3] hover:bg-transparent hover:text-[#A546FF] hover:shadow-inner-white text-sm sm:text-base hover:border-purple-500/30 transition-colors font-robotoMono">
28+
Resources
29+
</button>
30+
</a>
31+
</div>
32+
</div>
33+
</main>
34+
);
35+
}

0 commit comments

Comments
 (0)