Skip to content

Commit e7009f8

Browse files
CykotechCykotech
authored
Merge pull request #35 from CodeCafeCommunity/experimental-merge-of-designs
Experimental merge of designs
2 parents 697518d + 411a11c commit e7009f8

File tree

16 files changed

+398
-5
lines changed

16 files changed

+398
-5
lines changed

‎index.html‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,13 @@
44
<meta charset="UTF-8" />
55
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
66
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7-
<title>Vite + React + TS</title>
7+
<title>Code Café Community</title>
8+
<link rel="preconnect" href="https://fonts.googleapis.com" />
9+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
10+
<link
11+
href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
12+
rel="stylesheet"
13+
/>
814
</head>
915
<body>
1016
<div id="root"></div>

‎package-lock.json‎

Lines changed: 10 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
"format": "prettier --write ."
1313
},
1414
"dependencies": {
15+
"lucide-react": "^0.469.0",
1516
"react": "19.0.0",
1617
"react-dom": "19.0.0",
1718
"react-router": "^7.1.1"

‎public/images/coffee_cup.jpg‎

141 KB
Loading

‎src/components/CTA.tsx‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
export default function CTA() {
2+
return (
3+
<section
4+
id="cta"
5+
className="bg-primary flex justify-center items-center p-6 md:py-20"
6+
>
7+
<div className="cta-container bg-gradient-to-r from-accent to-secondary shadow-md rounded-3xl p-10 md:px-60 md:py-20 flex flex-col justify-evenly items-center text-primary">
8+
<h2 className="text-3xl font-bold mb-4 text-center">
9+
Ready to Join Our Community?
10+
</h2>
11+
<p className="text-center text-lg mb-6">
12+
Start your journey with Code Cafe today and become part of a thriving
13+
developer community.
14+
</p>
15+
<a
16+
className="discord-button bg-primary px-8 py-4 rounded-lg border-2 border-primary text-secondary hover:bg-secondary hover:text-primary transition-all hover:no-underline"
17+
href="https://discord.gg/code-cafe"
18+
>
19+
Join Code Cafe
20+
</a>
21+
</div>
22+
</section>
23+
);
24+
}

‎src/components/Features.tsx‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import { Users, CircleHelp, BookOpen } from "lucide-react";
2+
3+
export default function Features() {
4+
return (
5+
<section className="bg-background py-20">
6+
<div className="outer">
7+
<div className="inner">
8+
<div className="flex-1 flex flex-col items-center text-center py-6">
9+
<Users size={48} className="text-accent mb-2" />
10+
<h3 className="text-secondary text-xl mb-2 font-mono">
11+
Active Community
12+
</h3>
13+
<p className="text-secondary text-sm">
14+
Connect with like-minded developers and build lasting
15+
relationships.
16+
</p>
17+
</div>
18+
<div className="self-center bg-[rgba(255,255,255,0.1)] bg-clip-border bg-origin-padding bg-scroll bg-repeat shadow-[0px_0px_70px_15px_rgba(0,0,0,0.75)] box-border text-white font-sans font-[cv05_ss01_ss03_zero] text-base leading-6 h-[100px] w-[1px] text-left hidden lg:block"></div>
19+
20+
<div className="flex-1 flex flex-col items-center text-center py-6 font-mono">
21+
<CircleHelp size={48} className="text-accent mb-2" />
22+
<h3 className="text-secondary text-xl mb-2">Some other thing</h3>
23+
<p className="text-secondary text-sm">
24+
Description about that other thing.
25+
</p>
26+
</div>
27+
<div className="self-center bg-[rgba(255,255,255,0.1)] bg-clip-border bg-origin-padding bg-scroll bg-repeat shadow-[0px_0px_70px_15px_rgba(0,0,0,0.75)] box-border text-white font-sans font-[cv05_ss01_ss03_zero] text-base leading-6 h-[100px] w-[1px] text-left hidden lg:block"></div>
28+
29+
<div className="flex-1 flex flex-col items-center text-center py-6">
30+
<BookOpen size={48} className="text-accent mb-2" />
31+
<h3 className="text-secondary text-xl mb-2 font-mono">
32+
Learning Resources
33+
</h3>
34+
<p className="text-secondary text-sm">
35+
Access curated learning materials and documentation.
36+
</p>
37+
</div>
38+
</div>
39+
</div>
40+
</section>
41+
);
42+
}

‎src/components/Footer.tsx‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import { Link } from "react-router";
2+
import { Code } from "lucide-react";
3+
4+
export default function Footer() {
5+
return (
6+
<footer className="py-16 bg-background flex justify-around">
7+
<div className="footer-container text-primary">
8+
<h4 className="text-xl font-bold flex items-center gap-2">
9+
<Code size={48} className="text-primary" />
10+
Code Cafe
11+
</h4>
12+
<p className="text-sm">Your home for coding and community</p>
13+
</div>
14+
<div className="footer-container text-primary">
15+
<h4 className="text-xl font-bold mb-4">Community</h4>
16+
<ul className="list-none">
17+
<li className="mb-3 text-sm">
18+
<Link to="/events">Events</Link>
19+
</li>
20+
<li className="mb-3 text-sm">
21+
<a href="https://discord.gg/code-cafe">Discord</a>
22+
</li>
23+
</ul>
24+
</div>
25+
<div className="footer-container text-primary">
26+
<h4 className="text-xl font-bold mb-4">Resources</h4>
27+
<ul className="list-none">
28+
<li className="mb-3 text-sm">Documentation</li>
29+
<li className="mb-3 text-sm">Blog</li>
30+
<li className="mb-3 text-sm">GitHub</li>
31+
</ul>
32+
</div>
33+
</footer>
34+
);
35+
}

‎src/components/Header.tsx‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import { NavLink } from "react-router";
2+
3+
export default function Header() {
4+
return (
5+
<header className="sticky top-0 bg-primary/80 backdrop-blur-lg py-4 flex justify-around items-center">
6+
<div className="flex gap-2 items-center">
7+
<img
8+
className="w-16"
9+
src={"/images/coffee_cup.jpg"}
10+
alt="Code Cafe Logo"
11+
/>
12+
<h1 className="text-secondary text-3xl">Code Cafe</h1>
13+
</div>
14+
<nav>
15+
<ul className="flex list-none gap-3 text-secondary">
16+
<li>
17+
<NavLink className="hover:text-accent" to="/">
18+
Home
19+
</NavLink>
20+
</li>
21+
<li>
22+
<NavLink className="hover:text-accent" to="/about">
23+
About Us
24+
</NavLink>
25+
</li>
26+
<li>
27+
<NavLink className="hover:text-accent" to="/events">
28+
Events
29+
</NavLink>
30+
</li>
31+
</ul>
32+
</nav>
33+
</header>
34+
);
35+
}

‎src/components/Hero.tsx‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
export default function Hero() {
2+
return (
3+
<section
4+
id="hero"
5+
className="min-h-[8vh] bg-primary flex flex-col justify-evenly items-center text-accent py-8"
6+
>
7+
<div className="text-center flex items-center justify-center flex-wrap xl:flex-nowrap p-8 lg:p-5">
8+
<div className="flex flex-col items-center">
9+
<h2 className="text-xl md:text-xl lg:text-4xl mb-2">
10+
Where Code Meets Community
11+
</h2>
12+
<p className="font-mono text-lg max-w-prose">
13+
Join our vibrant community of developers, share knowledge and grow
14+
together in a welcoming environment.
15+
</p>
16+
</div>
17+
</div>
18+
<div className="flex gap-10 my-6">
19+
<button className="px-8 py-4 text-primary rounded-lg border-2 border-secondary hover:border-secondary bg-secondary hover:text-secondary hover:bg-primary transition-all">
20+
Join us
21+
</button>
22+
</div>
23+
</section>
24+
);
25+
}

‎src/components/Layout.tsx‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import Header from "./Header";
2+
import Footer from "./Footer";
3+
import { Outlet } from "react-router";
4+
5+
export default function Layout() {
6+
return (
7+
<>
8+
<Header />
9+
<Outlet />
10+
<Footer />
11+
</>
12+
);
13+
}

0 commit comments

Comments
 (0)