Skip to content

Commit f65aec8

Browse files
SmitkhobragadeSmitkhobragade
committed
2 parents 21af744 + 3a75ee1 commit f65aec8

File tree

7 files changed

+179
-147
lines changed

7 files changed

+179
-147
lines changed

‎src/App.js‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,11 @@ import React from 'react';
22
import { BrowserRouter, Route, Routes } from 'react-router-dom';
33
import { Helmet } from 'react-helmet';
44
import Homepage from './Homepage';
5-
import TechDisplay from './Page/TechDisplay.jsx';
65
import Home from './Page/Home.jsx';
76
import Opportunities from './Page/Opportunities.jsx';
87
import IdeaSubmission from './Page/IdeaSubmission.jsx';
98
import PortfolioBuilder from './Page/PortfolioBuilder.jsx';
10-
import Projects from './Page/Projects.jsx';
9+
import ProjectShowcase from './Page/ProjectShowcase.jsx';
1110
import ResumeBuilder from './Page/ResumeBuilder.jsx';
1211
import Resources from './Page/Resources.jsx';
1312
import Discussions from './Page/Discussions.jsx';
@@ -16,7 +15,7 @@ function App() {
1615
return (
1716
<BrowserRouter>
1817
<Helmet>
19-
<title>DevDisplay - Global Open Source Tech Platform</title>
18+
<title>DevDisplay - Global Tech Hub</title>
2019
<meta
2120
name="description"
2221
content="DevDisplay brings together all your tech needs in one place. Showcase your skills, connect globally, collaborate, build and promote."
@@ -28,7 +27,7 @@ function App() {
2827
<meta charSet="UTF-8" />
2928
<meta name="viewport" content="width=device-width, initial-scale=1" />
3029

31-
<meta property="og:title" content="DevDisplay - Global Open Source Tech Platform" />
30+
<meta property="og:title" content="DevDisplay - Global Tech Hub" />
3231
<meta
3332
property="og:description"
3433
content="Join DevDisplay to Showcase your skills, connect globally, collaborate, build and promote."
@@ -39,7 +38,7 @@ function App() {
3938
<meta property="og:site_name" content="DevDisplay" />
4039

4140
<meta name="twitter:card" content="summary_large_image" />
42-
<meta name="twitter:title" content="DevDisplay - Global Open Source Tech Platform" />
41+
<meta name="twitter:title" content="DevDisplay - Global Tech Hub" />
4342
<meta
4443
name="twitter:description"
4544
content="Showcase your skills, connect globally, collaborate, build and promote."
@@ -51,8 +50,8 @@ function App() {
5150

5251
<link rel="canonical" href="https://www.devdisplay.org" />
5352

54-
<link rel="icon" href="/devDisplayLOGO.png" />
55-
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
53+
<link rel="icon" href="/DevDisplay ICON.png" />
54+
<link rel="apple-touch-icon" sizes="180x180" href="/DevDisplay ICON.png" />
5655

5756
<meta name="theme-color" content="#317EFB" />
5857

@@ -63,12 +62,11 @@ function App() {
6362

6463
<Routes>
6564
<Route index element={<Homepage />} />
66-
<Route path="/TechDisplay" element={<TechDisplay />} />
6765
<Route path="/Home" element={<Home />} />
6866
<Route path="/Opportunities" element={<Opportunities />} />
6967
<Route path="/IdeaSubmission" element={<IdeaSubmission />} />
7068
<Route path="/PortfolioBuilder" element={<PortfolioBuilder />} />
71-
<Route path="/Projects" element={<Projects />} />
69+
<Route path="/ProjectShowcase" element={<ProjectShowcase />} />
7270
<Route path="/ResumeBuilder" element={<ResumeBuilder />} />
7371
<Route path="/Resources" element={<Resources />} />
7472
<Route path="/Discussions" element={<Discussions />} />

‎src/Page/Discussions.jsx‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -4,18 +4,18 @@ const DiscussionsPage = () => {
44
return (
55
<div className="min-h-screen bg-gray-100 p-4">
66
<header className="bg-blue-600 p-4 text-white">
7-
<h1 className="text-2xl font-bold">Discussions</h1>
7+
<h1 className="text-2xl font-bold">This is the Discussions page - Want to Build this page as a contributer</h1>
88
</header>
9-
<main className="mt-4">
10-
<section className="mb-8">
11-
<h2 className="text-xl font-bold">Discussion Threads</h2>
12-
{/* Add discussion threads here */}
13-
</section>
14-
<section>
15-
<h2 className="text-xl font-bold">Inbox</h2>
16-
{/* Add inbox messages here */}
17-
</section>
18-
</main>
9+
<h1 className="text-2xl font-bold">Features</h1>
10+
<h1>
11+
Add a features in this page where all the devdisplay user can discuss with each other and react on each other's
12+
messages.
13+
</h1>
14+
<hr />
15+
<h1 className="text-2xl font-bold">
16+
Apart from that if you able then add also features like this website where user can post or write article on
17+
this website - https://peerlist.io/scroll
18+
</h1>
1919
</div>
2020
);
2121
};

‎src/Page/Home.jsx‎

Lines changed: 126 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -1,103 +1,141 @@
11
import React from 'react';
2+
import Navbar from '../components/Navbar';
3+
import Globe from '../components/Globe';
24

3-
const HomePage = () => {
5+
const Hero = () => {
46
return (
5-
<div className="min-h-screen bg-black font-sans text-white">
6-
{/* Navbar */}
7-
<header className="flex items-center justify-between p-6">
8-
<div className="text-2xl font-bold">DevDisplay</div>
9-
<nav className="flex gap-4">
10-
<a href="#" className="hover:underline">
11-
Home
12-
</a>
13-
<a href="#" className="hover:underline">
14-
Contests
15-
</a>
16-
<a href="#" className="hover:underline">
17-
Blogs
18-
</a>
19-
<a href="#" className="hover:underline">
20-
Leaderboard
21-
</a>
22-
</nav>
23-
<button className="rounded bg-blue-600 px-4 py-2 text-white">Login</button>
24-
</header>
7+
<section className="hero-section mt-20 flex min-h-screen flex-col items-center justify-center text-white ">
8+
<div className="flex w-full flex-col items-center justify-center px-8 text-center">
9+
<p className="text-md mx-auto mb-10 w-fit rounded-full bg-[#ffffff36] p-2 text-center">
10+
We're Open Source {'>'} Star Now🌟
11+
</p>
12+
<h1 className="my-4 text-4xl font-bold tracking-widest md:text-4xl">One Place for all your Tech Needs</h1>
13+
<h2 className="my-4 text-6xl font-bold">
14+
Dev <span className="text-[#00a6fb]">Display</span>
15+
</h2>
16+
<p className="text-md md:text-md mx-auto my-8 max-w-2xl">Global platform that fulfills all your tech needs</p>
17+
</div>
18+
<div className="relative -top-20 left-20 flex h-[400px] w-full max-w-[600px] items-center justify-center md:h-[500px] lg:h-[600px]">
19+
<Globe />
20+
</div>
21+
</section>
22+
);
23+
};
2524

26-
{/* Main Section */}
27-
<main className="p-8 text-center">
28-
<h1 className="mt-8 text-5xl font-bold">
29-
One place for all your <span className="text-blue-500">coding platforms</span> needs
30-
</h1>
31-
<p className="mt-4 text-lg">Elevate your coding and development journey with DevDisplay</p>
32-
<button className="mt-6 rounded-lg bg-blue-500 px-6 py-3 text-white">Register Now</button>
25+
const TechFeatures = () => {
26+
return (
27+
<section className="tech-features-section max-w-[80%] px-4 py-16 text-white">
28+
<div className="mx-auto my-12 max-w-[80%] text-center">
29+
<h2 className="my-6 text-4xl font-bold text-[#00a6fb]">All Tech Features in One Place</h2>
30+
<p className="mx-auto my-12 mb-8 max-w-3xl text-xl">
31+
Discover a range of tools, resources, and opportunities to enhance your tech journey and skills.
32+
</p>
33+
</div>
34+
35+
{/* Grid Layout for Features */}
36+
<div className="grid grid-cols-1 gap-6 text-center md:grid-cols-2 lg:grid-cols-4">
37+
<a
38+
href="/opportunities"
39+
className="feature-card block rounded-lg bg-gray-800 p-6 shadow-lg transition duration-300 hover:scale-105 hover:transform hover:bg-gray-700"
40+
>
41+
<div className="border border-transparent transition duration-300 hover:border-blue-500">
42+
<h3 className="mb-4 text-2xl font-semibold">Opportunities</h3>
43+
<p>Explore various career and learning opportunities in the tech industry.</p>
44+
</div>
45+
</a>
3346

34-
{/* Profile Section */}
35-
<section className="mt-12 rounded-lg bg-blue-800 p-8 text-left">
36-
<h2 className="mb-4 text-3xl font-bold">
37-
Build your <span className="text-blue-300">Dynamic</span> Profile
38-
</h2>
39-
<p className="mb-4 text-lg">
40-
Showcase your ratings, GitHub stats, personal info, skills, education, and more. Climb the leaderboard while
41-
enjoying friendly competition within the coding community.
42-
</p>
43-
<button className="rounded-lg bg-blue-500 px-4 py-2">Create Now</button>
44-
</section>
47+
<a
48+
href="/resources"
49+
className="feature-card block rounded-lg bg-gray-800 p-6 shadow-lg transition duration-300 hover:scale-105 hover:transform hover:bg-gray-700"
50+
>
51+
<div className="border border-transparent transition duration-300 hover:border-blue-500">
52+
<h3 className="mb-4 text-2xl font-semibold">Resources</h3>
53+
<p>Access a wide range of learning resources, tools, and libraries to boost your skills.</p>
54+
</div>
55+
</a>
4556

46-
{/* Features Section */}
47-
<section className="mt-16 grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-3">
48-
<div className="rounded-lg bg-blue-900 p-6 text-center">
49-
<h3 className="text-2xl font-bold">Leetcode</h3>
50-
<p className="mt-2">Platform for honing coding skills through a variety of algorithmic challenges.</p>
51-
<button className="mt-4 rounded-lg bg-blue-500 px-4 py-2">Check out</button>
57+
<a
58+
href="/ProjectShowcase"
59+
className="feature-card block rounded-lg bg-gray-800 p-6 shadow-lg transition duration-300 hover:scale-105 hover:transform hover:bg-gray-700"
60+
>
61+
<div className="border border-transparent transition duration-300 hover:border-blue-500">
62+
<h3 className="mb-4 text-2xl font-semibold">Project Showcase</h3>
63+
<p>Showcase your projects, get feedback, and inspire others to collaborate.</p>
5264
</div>
53-
<div className="rounded-lg bg-blue-900 p-6 text-center">
54-
<h3 className="text-2xl font-bold">Atcoder</h3>
55-
<p className="mt-2">Competitive programming platform that hosts contests and offers practice problems.</p>
56-
<button className="mt-4 rounded-lg bg-blue-500 px-4 py-2">Check out</button>
65+
</a>
66+
67+
<a
68+
href="/Discussions"
69+
className="feature-card block rounded-lg bg-gray-800 p-6 shadow-lg transition duration-300 hover:scale-105 hover:transform hover:bg-gray-700"
70+
>
71+
<div className="border border-transparent transition duration-300 hover:border-blue-500">
72+
<h3 className="mb-4 text-2xl font-semibold">Tech Discussion</h3>
73+
<p>Engage in tech discussions, share ideas, and stay updated on the latest trends.</p>
5774
</div>
58-
<div className="rounded-lg bg-blue-900 p-6 text-center">
59-
<h3 className="text-2xl font-bold">Codeforces</h3>
60-
<p className="mt-2">Online competitive programming platform that hosts contests and regular challenges.</p>
61-
<button className="mt-4 rounded-lg bg-blue-500 px-4 py-2">Check out</button>
75+
</a>
76+
77+
<a
78+
href="/ideas-submission"
79+
className="feature-card block rounded-lg bg-gray-800 p-6 shadow-lg transition duration-300 hover:scale-105 hover:transform hover:bg-gray-700"
80+
>
81+
<div className="border border-transparent transition duration-300 hover:border-blue-500">
82+
<h3 className="mb-4 text-2xl font-semibold">Ideas Submission</h3>
83+
<p>Submit your innovative ideas, get feedback, and explore collaborations.</p>
6284
</div>
63-
</section>
64-
</main>
85+
</a>
6586

66-
{/* Footer */}
67-
<footer className="mt-12 bg-gray-800 p-8 text-center">
68-
<p className="text-white">&copy; 2024 DevDisplay. All rights reserved.</p>
69-
<div className="mt-4 flex justify-center gap-8">
70-
<a href="#" className="text-white">
71-
Feedback
72-
</a>
73-
<a href="#" className="text-white">
74-
Contact Us
75-
</a>
76-
<a href="#" className="text-white">
77-
About DevDisplay
78-
</a>
79-
<a href="#" className="text-white">
80-
Join our Discord
81-
</a>
82-
</div>
83-
<div className="mt-4 flex justify-center gap-8">
84-
{/* Social Icons */}
85-
<a href="#" className="text-white">
86-
LinkedIn
87-
</a>
88-
<a href="#" className="text-white">
89-
Twitter
90-
</a>
91-
<a href="#" className="text-white">
92-
GitHub
93-
</a>
94-
<a href="#" className="text-white">
95-
Instagram
96-
</a>
87+
<a
88+
href="/portfolio-ideas"
89+
className="feature-card block rounded-lg bg-gray-800 p-6 shadow-lg transition duration-300 hover:scale-105 hover:transform hover:bg-gray-700"
90+
>
91+
<div className="border border-transparent transition duration-300 hover:border-blue-500">
92+
<h3 className="mb-4 text-2xl font-semibold">Portfolio Ideas</h3>
93+
<p>Get inspired with creative ideas to enhance your portfolio and make an impact.</p>
94+
</div>
95+
</a>
96+
97+
<a
98+
href="/portfolio-building"
99+
className="feature-card block rounded-lg bg-gray-800 p-6 shadow-lg transition duration-300 hover:scale-105 hover:transform hover:bg-gray-700"
100+
>
101+
<div className="border border-transparent transition duration-300 hover:border-blue-500">
102+
<h3 className="mb-4 text-2xl font-semibold">Portfolio Building</h3>
103+
<p>Learn the best practices to build a standout portfolio that impresses recruiters.</p>
104+
</div>
105+
</a>
106+
107+
<a
108+
href="/resume-building"
109+
className="feature-card block rounded-lg bg-gray-800 p-6 shadow-lg transition duration-300 hover:scale-105 hover:transform hover:bg-gray-700"
110+
>
111+
<div className="border border-transparent transition duration-300 hover:border-blue-500">
112+
<h3 className="mb-4 text-2xl font-semibold">Resume Building</h3>
113+
<p>Create a professional resume with tips and templates tailored to the tech industry.</p>
114+
</div>
115+
</a>
116+
</div>
117+
118+
<a
119+
href="/add-features"
120+
className="feature-card mt-6 block rounded-lg bg-gray-800 p-6 text-center shadow-lg transition duration-300 hover:scale-105 hover:transform hover:bg-gray-700"
121+
>
122+
<div className="border border-transparent transition duration-300 hover:border-blue-500">
123+
<h3 className="mb-4 text-2xl font-semibold">Want to Add Features?</h3>
124+
<p>Suggest new features you'd love to see and help shape the tech community.</p>
97125
</div>
98-
</footer>
126+
</a>
127+
</section>
128+
);
129+
};
130+
131+
const Home = () => {
132+
return (
133+
<div className="background-wrapper bg-gray-400">
134+
<Navbar />
135+
<Hero />
136+
<TechFeatures />
99137
</div>
100138
);
101139
};
102140

103-
export default HomePage;
141+
export default Home;

‎src/Page/ProjectShowcase.jsx‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import React from 'react';
2+
3+
const ProjectsPage = () => {
4+
return (
5+
<div className="min-h-screen bg-gray-100 p-4">
6+
<header className="bg-blue-600 p-4 text-white">
7+
<h1 className="text-2xl font-bold">
8+
This is the Project Showcase page - Want to Build this page as a contributer
9+
</h1>
10+
</header>
11+
<h1 className="text-2xl font-bold">Features</h1>
12+
<h1>
13+
Add a features in this page where developer can showcase their project - Develoepr first add their project
14+
through the open source contribution and then the project are showcasing here
15+
</h1>
16+
<hr />
17+
<h1>
18+
After that add a voting or liking on every project where user can like and vote for trending the project - like
19+
this website (https://peerlist.io/projects){' '}
20+
</h1>
21+
<hr />
22+
<h1 className="text-2xl font-bold">Take help by this 👇🏻</h1>
23+
<h1>
24+
Project adding inspiration --- https://www.projectshut.tech/ --- and thier source code ---
25+
https://github.com/priyankarpal/projectshut
26+
</h1>
27+
</div>
28+
);
29+
};
30+
31+
export default ProjectsPage;

‎src/Page/Projects.jsx‎

Lines changed: 0 additions & 35 deletions
This file was deleted.

0 commit comments

Comments
 (0)