Skip to content

Commit 0d69294

Browse files
Abh1noobAbh1noob
authored
Merge pull request #133 from CodeChefVIT/samya/homepage
homepage done
2 parents a953b33 + 9a67ff5 commit 0d69294

24 files changed

+511
-128
lines changed

‎public/Vipnagorgialla.otf

60.8 KB
Binary file not shown.

‎public/VipnagorgiallaBd.otf

56 KB
Binary file not shown.

‎public/play.ttf

180 KB
Binary file not shown.

‎src/app/page.tsx

+13-32
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,34 @@
1+
import SearchBar from "@/components/searchbar";
12
import Navbar from "@/components/Navbar";
23
import StoredPapers from "@/components/StoredPapers";
34
import Footer from "@/components/Footer";
4-
import SearchBar from "@/components/Searchbar/searchbar";
5+
import Hero from "@/components/Hero";
6+
import Faq from "@/components/Faq";
57

68
const HomePage = () => {
79
return (
8-
<div className="flex min-h-screen flex-col">
10+
<div className="flex min-h-screen w-full flex-col vipna dark:bg-[#070114] bg-[#F3F5FF]">
911
<div>
1012
<Navbar />
1113
</div>
1214
<div className="mt-2 flex flex-grow flex-col items-center justify-center gap-y-10">
1315
<div className="w-full max-w-2xl space-y-10 text-center">
14-
<h1 className="phonk mx-auto text-2xl md:text-3xl">
16+
<h1 className="vipnabd font-extrabold text-3xl md:text-3xl mx-auto mt-14 mb-6">
1517
Built by Students for Students
1618
</h1>
17-
18-
<p className="text-md mx-auto w-[90%] font-sans font-semibold md:w-full">
19-
Prepare to excel in your CATs and FATs with CodeChef-VIT&apos;s
20-
dedicated repository of past exam papers. Access key resources to
21-
review concepts, tackle challenging questions, and familiarize
22-
yourself with exam patterns. Boost your confidence, sharpen your
23-
strategy, and get ready to ace your exams!
24-
</p>
25-
26-
<div className="flex flex-wrap justify-center gap-4 text-sm font-bold">
27-
{[
28-
"NO SIGN UP REQUIRED",
29-
"FILTERED SEARCH",
30-
"FLEXIBLE DOWNLOAD",
31-
].map((text) => (
32-
<div
33-
key={text}
34-
className="rounded-full bg-gradient-to-r from-[#562EE7] to-[#bd21b4] p-[2px]"
35-
>
36-
<div className="rounded-full bg-white px-6 py-3 font-sans tracking-wider text-black dark:bg-black dark:text-white">
37-
{text}
38-
</div>
39-
</div>
40-
))}
41-
</div>
4219
</div>
43-
44-
<div className="z-20 w-full max-w-xl">
20+
<div className="z-20 w-full max-w-xl mb-6">
4521
<SearchBar />
4622
</div>
47-
48-
<div className="max-3xl w-full">
23+
<div className="w-full max-w-7xl">
4924
<StoredPapers />
5025
</div>
26+
<div className="w-full max-w-7xl">
27+
<Hero />
28+
</div>
29+
<div className="w-full max-w-7xl mb-10">
30+
<Faq />
31+
</div>
5132
</div>
5233

5334
<Footer />

‎src/assets/download.svg

+4
Loading

‎src/assets/downloadd.svg

+4
Loading

‎src/assets/filter.svg

+3
Loading

‎src/assets/filterd.svg

+3
Loading

‎src/assets/man.svg

+21
Loading

‎src/assets/man1.svg

+20
Loading

‎src/assets/sign.svg

+4
Loading

‎src/assets/signd.svg

+4
Loading

‎src/assets/tick.svg

+3
Loading

‎src/assets/tickd.svg

+3
Loading

‎src/components/Faq.tsx

+49
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
"use client";
2+
import { useState } from "react";
3+
4+
function Faq() {
5+
const faqs = [
6+
{ question: "What makes papers unique?", answer: "Lorem ipsum" },
7+
{ question: "What makes papers unique?", answer: "Lorem ipsum" },
8+
{ question: "What makes papers unique?", answer: "Lorem ipsum" },
9+
{ question: "What makes papers unique?", answer: "Lorem ipsum" },
10+
{ question: "What makes papers unique?", answer: "Lorem ipsum" }
11+
];
12+
const [faqActive, setFaqActive] = useState<number | null>(null);
13+
14+
const handleClick = (index: number) => {
15+
setFaqActive(faqActive === index ? null : index);
16+
};
17+
18+
return (
19+
<div className="w-full mt-12 px-6 md:px-12 py-12">
20+
<div className="text-center lg:text-left text-4xl lg:text-5xl font-bold text-[#120020] dark:text-white mb-8 w-full">
21+
Frequently Asked Questions
22+
</div>
23+
<div className="max-w-7xl play mx-auto space-y-6">
24+
{faqs.map((faq, index) => (
25+
<div key={index} className="p-4 border-b-2 border-[#453D60]">
26+
<div className="flex items-center">
27+
<h2
28+
className={`text-lg play font-semibold ${faqActive === index ? "dark:text-[#A47DE5] text-[#6F2DA6]" : "dark:text-[#C0BACE] text-black"} w-full pr-15`}
29+
>
30+
{faq.question}
31+
</h2>
32+
<button
33+
onClick={() => handleClick(index)}
34+
className={`text-md font-bold w-11 h-6 flex items-center justify-center rounded-full transition-all duration-200 ${faqActive === index ? "text-white dark:bg-[#A47DE5] bg-[#6F2DA6]" : "dark:bg-white bg-[#EDEFF0] text-[#99979F]"}`}
35+
>
36+
{faqActive === index ? "−" : "+"}
37+
</button>
38+
</div>
39+
{faqActive === index && (
40+
<p className="mt-2 play text-black dark:text-[#C0BACE]">{faq.answer}</p>
41+
)}
42+
</div>
43+
))}
44+
</div>
45+
</div>
46+
);
47+
}
48+
49+
export default Faq;

‎src/components/Footer.tsx

+74-71
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import { useEffect, useState } from "react";
1313
import { Button } from "./ui/button";
1414

1515
export default function Footer() {
16-
const { theme, setTheme } = useTheme();
16+
const { theme } = useTheme();
1717
const [isDarkMode, setIsDarkMode] = useState<boolean | null>(true);
1818

1919
useEffect(() => {
@@ -23,78 +23,81 @@ export default function Footer() {
2323
}, [theme]);
2424

2525
return (
26-
<div className="mx-auto flex flex-col items-center justify-between gap-y-12 pt-12 md:pt-8 lg:w-full lg:flex-row lg:justify-around lg:px-12 mb-4">
27-
<div className="flex items-center">
28-
<h1 className="jost bg-gradient-to-r from-[#562EE7] to-[rgba(116,128,255,0.8)] bg-clip-text text-center text-3xl font-bold text-transparent lg:text-5xl 2xl:text-6xl dark:from-[#562EE7] dark:to-[#FFC6E8]">
29-
Papers
30-
</h1>
31-
<Separator orientation="vertical" className="mx-3 h-full min-h-20" />
32-
<div className="flex items-center">
33-
<Image
34-
src={ccLogo as HTMLImageElement}
35-
alt="codechef-logo"
36-
height={70}
37-
width={70}
38-
/>
39-
<p className="jost text-2xl font-bold lg:text-4xl">CodeChef-VIT</p>
26+
<footer className="w-full overflow-hidden font-sans bg-gradient-to-b dark:from-[#070114] dark:to-[#1F0234] from-[#F3F5FF] to-[#A599CE] px-6 py-12 text-white">
27+
<div className="max-w-7xl mx-auto flex flex-col gap-y-10 lg:flex-row lg:justify-between">
28+
<div className="flex flex-col items-center lg:items-start gap-4 text-center lg:text-left">
29+
<h1 className="jost tracking-wide bg-gradient-to-r from-[#562EE7] to-[rgba(116,128,255,0.8)] bg-clip-text font-bold text-xl text-transparent mb-5 dark:from-[#562EE7] dark:to-[#FFC6E8] text-left md:text-7xl">
30+
Papers
31+
</h1>
32+
<p className="text-md text-black dark:text-white">Made with ❤️ by Codechef-VIT</p>
33+
<div className="flex items-center gap-4 flex-wrap justify-center lg:justify-start">
34+
<Link href="https://www.instagram.com/codechefvit/">
35+
<Button variant="ghost" size="icon">
36+
<Instagram className="text-black dark:text-white" />
37+
</Button>
38+
</Link>
39+
<Link href="https://www.linkedin.com/company/codechefvit/">
40+
<Button variant="ghost" size="icon">
41+
<Linkedin className="text-black dark:text-white" />
42+
</Button>
43+
</Link>
44+
<Link href="https://www.youtube.com/@CodeChefVIT">
45+
<Button variant="ghost" size="icon">
46+
<Youtube className="text-black dark:text-white" />
47+
</Button>
48+
</Link>
49+
<Link href="https://github.com/CodeChefVIT">
50+
<Button variant="ghost" size="icon">
51+
<Github className="text-black dark:text-white" />
52+
</Button>
53+
</Link>
54+
<Link href="https://www.facebook.com/codechefvit/">
55+
<Button variant="ghost" size="icon">
56+
<Image
57+
src={
58+
isDarkMode
59+
? (meta_icon_dark as HTMLInputElement)
60+
: (meta_icon as HTMLInputElement)
61+
}
62+
alt="meta-icon"
63+
height={24}
64+
width={24}
65+
/>
66+
</Button>
67+
</Link>
68+
<Link href="https://x.com/codechefvit" className="pb-1.5">
69+
<Button variant="ghost" size="icon">
70+
<Image
71+
src={
72+
isDarkMode
73+
? (x_twitter_icon_dark as HTMLInputElement)
74+
: (x_twitter_icon as HTMLInputElement)
75+
}
76+
alt="x_twitter_icon"
77+
height={24}
78+
width={24}
79+
/>
80+
</Button>
81+
</Link>
82+
</div>
4083
</div>
41-
</div>
42-
<div>
43-
<div className="flex items-center gap-x-8">
44-
<Link href="https://www.instagram.com/codechefvit/">
45-
<Button variant="ghost" size="icon">
46-
<Instagram />
47-
</Button>
48-
</Link>
49-
<Link href="https://www.linkedin.com/company/codechefvit/">
50-
<Button variant="ghost" size="icon">
51-
<Linkedin />
52-
</Button>
53-
</Link>
54-
<Link href="https://www.youtube.com/@CodeChefVIT">
55-
<Button variant="ghost" size="icon">
56-
<Youtube />
57-
</Button>
58-
</Link>
59-
<Link href="https://github.com/CodeChefVIT">
60-
<Button variant="ghost" size="icon">
61-
<Github />
62-
</Button>
63-
</Link>
64-
<Link href="https://www.facebook.com/codechefvit/">
65-
<Button variant="ghost" size="icon">
66-
<Image
67-
src={
68-
isDarkMode
69-
? (meta_icon_dark as HTMLInputElement)
70-
: (meta_icon as HTMLInputElement)
71-
}
72-
alt="meta-icon"
73-
height={24}
74-
width={24}
75-
/>
76-
</Button>
77-
</Link>
78-
<Link href="https://x.com/codechefvit" className="pb-1.5">
79-
<Button variant="ghost" size="icon">
80-
<Image
81-
src={
82-
isDarkMode
83-
? (x_twitter_icon_dark as HTMLInputElement)
84-
: (x_twitter_icon as HTMLInputElement)
85-
}
86-
alt="x_twitter_icon"
87-
height={24}
88-
width={24}
89-
/>
90-
</Button>
91-
</Link>
84+
<div className="flex flex-col items-center dark:text-white text-black lg:items-start text-center lg:text-left gap-2">
85+
<h3 className="text-xl font-semibold">Menu</h3>
86+
<Link href="/search">Search</Link>
87+
<Link href="/features">Features</Link>
88+
<Link href="/faq">FAQ</Link>
89+
</div>
90+
<div className="flex flex-col items-center dark:text-white text-black lg:items-start text-center lg:text-left gap-2">
91+
<h3 className="text-xl font-semibold">Our Projects</h3>
92+
<Link href="/">Papers</Link>
93+
<Link href="/">FFCS-inator</Link>
94+
<Link href="/">Brainrot Arcade</Link>
95+
</div>
96+
<div className="flex flex-col items-center dark:text-white text-black lg:items-start text-center lg:text-left gap-2">
97+
<h3 className="text-xl font-semibold">Contact Us</h3>
98+
<p>[email protected]</p>
9299
</div>
93-
{/* <p className="hidden text-center text-xl lg:block">
94-
Made with 💜 By Codechef-VIT
95-
</p> */}
96100
</div>
97-
<p className="block text-xl lg:hidden">Made with 💜 By Codechef-VIT</p>
98-
</div>
101+
</footer>
99102
);
100103
}

0 commit comments

Comments
 (0)