Skip to content

Commit c9e399d

Browse files
Mahesh-PrayagaMahesh-Prayaga
committed
Background added
1 parent 3e408fe commit c9e399d

13 files changed

Lines changed: 265 additions & 88 deletions

‎app/layout.js‎

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { Plus_Jakarta_Sans, Geist_Mono } from "next/font/google";
22
import "./globals.css";
3+
import DarkVeil from "@/components/background.jsx";
34

45
const geistSans = Plus_Jakarta_Sans({
56
subsets: ["latin"],
@@ -11,8 +12,8 @@ const geistMono = Geist_Mono({
1112
});
1213

1314
export const metadata = {
14-
title: "GIT-A-THON",
15-
description: "Generated by create next app",
15+
title: "EPOCH 4.0 Hackathon",
16+
description: "Official website of EPOCH 4.0 Hackathon",
1617
};
1718

1819
export default function RootLayout({ children }) {
@@ -21,7 +22,14 @@ export default function RootLayout({ children }) {
2122
<body
2223
className={`${geistSans.className} ${geistMono.variable} antialiased`}
2324
>
24-
{children}
25+
{/* Page wrapper */}
26+
<div className="relative min-h-screen overflow-hidden">
27+
{/* Background */}
28+
<DarkVeil />
29+
30+
{/* Foreground content */}
31+
<div className="relative z-10">{children}</div>
32+
</div>
2533
</body>
2634
</html>
2735
);

‎app/page.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,13 @@ import ComSpons from "../components/ComSpons";
55
import ProbStmts from "../components/ProbStmts";
66
import Register from "../components/Register";
77
import Footer from "@/components/Footer";
8+
import DarkVeil from "@/components/background.jsx";
89

910
export default function Home() {
1011
return (
11-
<main className="bg-[#0f1214] text-white min-h-screen">
12+
<main className="text-white min-h-screen">
1213
<Navbar />
14+
{/* <DarkVeil /> */}
1315

1416
<Hero />
1517

‎components/About.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
export default function HackathonAboutSection() {
22
return (
3-
<section className="bg-[#0f1214] text-gray-200 py-16">
3+
<section className="text-gray-200 py-16">
44
<div className="mx-auto max-w-6xl px-6">
55
{/* Heading + intro */}
66
<div className="mx-auto mb-14 max-w-2xl text-center">

‎components/ComSpons.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export default function CommunitiesSponsors() {
1414
];
1515

1616
return (
17-
<section className="bg-[#0f1214] py-24">
17+
<section className="py-24">
1818
<div className="max-w-7xl mx-auto px-6 text-center">
1919
{/* Powered by Communities */}
2020
<h2 className="text-2xl md:text-3xl font-semibold text-white mb-13">

‎components/Countdown.jsx‎

Lines changed: 23 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -11,21 +11,14 @@ export default function Countdown({ targetDate }) {
1111
});
1212

1313
useEffect(() => {
14-
if (!targetDate) return;
14+
// Use the targetDate prop or default to December 20, 2025 at 9:00 AM
15+
const target = new Date(targetDate || "2025-12-20T09:00:00").getTime();
1516

16-
const target = new Date(targetDate).getTime();
17-
18-
if (isNaN(target)) {
19-
console.error("Invalid targetDate:", targetDate);
20-
return;
21-
}
22-
23-
const timer = setInterval(() => {
17+
const updateCountdown = () => {
2418
const now = Date.now();
2519
const diff = target - now;
2620

2721
if (diff <= 0) {
28-
clearInterval(timer);
2922
setTimeLeft({
3023
Days: "00",
3124
Hours: "00",
@@ -39,38 +32,44 @@ export default function Countdown({ targetDate }) {
3932
const hours = Math.floor(
4033
(diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)
4134
);
42-
const minutes = Math.floor(
43-
(diff % (1000 * 60 * 60)) / (1000 * 60)
44-
);
35+
const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
4536
const seconds = Math.floor((diff % (1000 * 60)) / 1000);
4637

4738
setTimeLeft({
48-
Days: String(days).padStart(2, "0"),
49-
Hours: String(hours).padStart(2, "0"),
50-
Minutes: String(minutes).padStart(2, "0"),
51-
Seconds: String(seconds).padStart(2, "0"),
39+
Days: days.toString().padStart(2, "0"),
40+
Hours: hours.toString().padStart(2, "0"),
41+
Minutes: minutes.toString().padStart(2, "0"),
42+
Seconds: seconds.toString().padStart(2, "0"),
5243
});
53-
}, 1000);
44+
};
45+
46+
// Initial update
47+
updateCountdown();
48+
49+
// Update every second
50+
const timer = setInterval(updateCountdown, 1000);
5451

5552
return () => clearInterval(timer);
5653
}, [targetDate]);
5754

5855
return (
59-
<div className="mb-8 text-center">
60-
<h3 className="text-xl md:text-2xl font-semibold mb-4">
56+
<div className="text-center">
57+
<h3 className="text-lg sm:text-xl md:text-2xl font-semibold mb-4 sm:mb-5 md:mb-6">
6158
Hackathon starts in
6259
</h3>
6360

64-
<div className="flex justify-center gap-4">
61+
<div className="flex justify-center gap-2 sm:gap-3 md:gap-4 lg:gap-6">
6562
{Object.entries(timeLeft).map(([label, value]) => (
6663
<div
6764
key={label}
68-
className="bg-gray-800 w-20 h-20 md:w-24 md:h-24 rounded-lg flex flex-col items-center justify-center"
65+
className="bg-gray-800 w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 lg:w-32 lg:h-32 xl:w-40 xl:h-40 rounded-lg flex flex-col items-center justify-center"
6966
>
70-
<span className="text-2xl md:text-3xl font-bold text-blue-500">
67+
<span className="text-xl sm:text-2xl md:text-3xl lg:text-4xl xl:text-6xl font-bold text-blue-500">
7168
{value}
7269
</span>
73-
<p className="text-sm md:text-base">{label}</p>
70+
<p className="text-xs sm:text-sm md:text-base lg:text-lg font-semibold mt-1">
71+
{label}
72+
</p>
7473
</div>
7574
))}
7675
</div>

‎components/Footer.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
export default function Footer() {
44
return (
5-
<footer className="bg-[#0f1214] border-t border-[#1f2628] relative">
5+
<footer className="border-t border-[#1f2628] relative">
66
{/* Top content */}
77
<div className="max-w-7xl mx-auto py-10">
88
<div>

‎components/Hero.jsx‎

Lines changed: 36 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -4,70 +4,55 @@ import React from "react";
44
import Countdown from "./Countdown";
55

66
export default function Hero() {
7+
const handleRegisterClick = () => {
8+
const registerSection = document.getElementById("Register");
9+
if (registerSection) {
10+
registerSection.scrollIntoView({ behavior: "smooth", block: "start" });
11+
}
12+
};
13+
714
return (
8-
<section className="min-h-screen bg-[#0f1214] text-white flex flex-col items-center text-center px-4 pt-24 pb-16 overflow-hidden">
15+
<section className="text-white min-h-screen flex flex-col items-center justify-center text-center px-4 sm:px-6 lg:px-8 py-20 overflow-visible">
916
{/* Title */}
10-
<h1 className="mt-8 font-mono font-bold text-9xl leading-[1.1]">
17+
<h1 className="font-bold text-5xl sm:text-6xl md:text-7xl lg:text-8xl xl:text-9xl font-mono leading-[1.1] mb-3 sm:mb-4">
1118
GIT-A-THON
1219
</h1>
13-
14-
{/* Tagline */}
15-
<p className="mt-8 text-2xl font-mono text-gray-300 max-w-2xl">
20+
{/* <h2 className="font-medium my-2 text-[clamp(1.5rem,5vw,2.5rem)] leading-snug">
21+
24-Hour Hackathon
22+
</h2> */}
23+
<p className="text-gray-300 text-base sm:text-lg md:text-xl lg:text-2xl font-mono max-w-2xl mb-10 sm:mb-12 md:mb-14">
1624
Code through the night. Build for impact.
1725
</p>
18-
19-
{/* Info Tags */}
20-
<div className="mt-10 mb-10 flex flex-wrap justify-center gap-x-10 gap-y-6">
21-
{/* Duration */}
22-
<div className="flex items-center gap-2 rounded-full bg-gray-800 px-5 py-2">
23-
<img
24-
src="/icons/Access%20time.svg"
25-
alt="Duration"
26-
className="h-5 w-5"
27-
/>
28-
<span className="text-sm sm:text-base">24-Hour Hackathon</span>
26+
{/* Description
27+
<p className="text-gray-400 max-w-3xl mb-8 text-[clamp(0.875rem,2vw,1.125rem)] leading-relaxed mt-3">
28+
EPOCH 4.0 Hackathon is a 24-hour, on-site coding marathon where teams
29+
solve real-world problem statements with a strong focus on user
30+
experience, creativity, functionality, and completeness.
31+
</p> */}
32+
{/* Tags */}
33+
{/* <div className="flex flex-wrap justify-center gap-4 mb-8">
34+
<div className="bg-gray-800 px-4 py-2 rounded-full flex items-center gap-2">
35+
⏱ 24-Hour Hackathon
2936
</div>
30-
31-
{/* Teams */}
32-
<div className="flex items-center gap-2 rounded-full bg-gray-800 px-5 py-2">
33-
<img src="/icons/People.svg" alt="Participants" className="h-5 w-5" />
34-
<span className="text-sm sm:text-base">
35-
50 Teams • 200–300 Participants
36-
</span>
37+
<div className="bg-gray-800 px-4 py-2 rounded-full flex items-center gap-2">
38+
👥 50 Teams • 200-300 Participants
3739
</div>
38-
39-
{/* Location */}
40-
<div className="flex items-center gap-2 rounded-full bg-gray-800 px-5 py-2">
41-
<img
42-
src="/icons/Location%20on.svg"
43-
alt="Location"
44-
className="h-5 w-5"
45-
/>
46-
<span className="text-sm sm:text-base">GITAM University</span>
40+
<div className="bg-gray-800 px-4 py-2 rounded-full flex items-center gap-2">
41+
📍 GITAM University
4742
</div>
48-
49-
{/* Communities */}
50-
<div className="flex items-center gap-2 rounded-full bg-gray-800 px-5 py-2">
51-
<img src="/icons/Group.svg" alt="Communities" className="h-5 w-5" />
52-
<span className="text-sm sm:text-base">
53-
GitHub • ACM • IEEE • AWS SIG
54-
</span>
43+
<div className="bg-gray-800 px-4 py-2 rounded-full flex items-center gap-2">
44+
⭐ GitHub • ACM • IEEE • AWS SIG
5545
</div>
56-
</div>
57-
46+
</div> */}
5847
{/* Countdown */}
59-
<div className="mb-08">
60-
<Countdown targetDate="2025-12-20T09:00:00+05:30" />
48+
<div className="w-full max-w-4xl mb-6 sm:mb-8 md:mb-10">
49+
<Countdown targetDate="2025-12-20T09:00:00" />
6150
</div>
62-
{/* CTA */}
63-
<div className="flex justify-center">
51+
{/* Buttons */}
52+
<div className="flex flex-wrap gap-3 sm:gap-4 justify-center">
6453
<button
65-
onClick={() => {
66-
document
67-
.getElementById("register")
68-
?.scrollIntoView({ behavior: "smooth" });
69-
}}
70-
className="rounded-md bg-green-500 px-8 py-3 font-semibold transition hover:bg-green-600 cursor-target cursor-pointer"
54+
onClick={handleRegisterClick}
55+
className="bg-green-500 hover:bg-green-600 px-6 sm:px-8 py-3 sm:py-3.5 rounded-md font-semibold text-sm sm:text-base transition-colors duration-200 cursor-pointer cursor-target"
7156
>
7257
Register Your Team
7358
</button>

‎components/Navbar.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export default function Navbar() {
88
};
99

1010
return (
11-
<nav className="fixed top-0 left-0 z-50 w-full bg-[#0f1214]">
11+
<nav className="fixed top-0 left-0 z-50 w-full">
1212
<TargetCursor
1313
spinDuration={2}
1414
hideDefaultCursor={true}

‎components/Register.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -252,7 +252,7 @@ export default function Register() {
252252
const totalSteps = formData.teamSize + 1;
253253

254254
return (
255-
<section id="register" className="w-full max-w-3xl mx-auto scroll-mt-32">
255+
<section id="Register" className="w-full max-w-3xl mx-auto scroll-mt-32">
256256
<h1 className="text-2xl md:text-4xl font-bold text-white text-center mb-6 md:mb-10 font-space">
257257
Registration Form
258258
</h1>

0 commit comments

Comments
 (0)