merge

encryptedge · Jan 2, 2024 · 9f15b32 · 9f15b32
2 parents 5061f47 + 5c158d9
commit 9f15b32
Show file tree

Hide file tree

Showing 34 changed files with 644 additions and 281 deletions.
diff --git a/README.md b/README.md
@@ -1,24 +1,36 @@
-This is a [Next.js](https://nextjs.org/) project configured with [TypeScript](https://www.typescriptlang.org/) and [Tailwind CSS](https://tailwindcss.com/) created by [Brag Club](https://github.com/brag-club)
+[![Contributors][contributors-shield]][contributors-url]
+
+# RCS Landing
+
+## Description
+
+This is the landing page for the RCSCTF24 website.
 
 ## Getting Started
 
-First, run the development server:
+### Installing
+
+* ![Nodejs]
+* ![Yarn]
 
-```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-```
+### Frameworks
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+* ![Next.js]
+* ![React.js]
+* ![TailwindCSS]
 
-You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+### License
 
-## Learn More
+This project is licensed via Apache License
 
--   Next.js: https://nextjs.org/docs
--   TypeScript: https://www.typescriptlang.org/docs
--   Tailwind CSS: https://tailwindcss.com/docs
--   ESLint: https://eslint.org/docs/user-guide/getting-started
+[contributors-shield]: https://img.shields.io/github/contributors/encryptedge/rcs-landing.svg?style=for-the-badge
+[contributors-url]: https://github.com/encryptedge/rcs-landing/graphs/contributors
+[forks-shield]: https://img.shields.io/github/forks/encryptedge/rcs-landing.svg?style=for-the-badge
+[forks-url]: https://github.com/encryptedge/rcs-landing/network/members
+[issues-shield]: https://img.shields.io/github/issues/encryptedge/rcs-landing.svg?style=for-the-badge
+[issues-url]: https://github.com/encryptedge/rcs-landing/issues
+[Next.js]: https://img.shields.io/badge/next.js-000000?style=for-the-badge&logo=nextdotjs&logoColor=white
+[React.js]: https://img.shields.io/badge/React-20232A?style=for-the-badge&logo=react&logoColor=61DAFB
+[TailwindCSS]: https://img.shields.io/badge/Tailwind_CSS-38B2AC?style=for-the-badge&logo=tailwind-css&logoColor=white
+[Yarn]: https://img.shields.io/badge/Yarn-2C8EBB?style=for-the-badge&logo=yarn&logoColor=white
+[Nodejs]: https://img.shields.io/badge/Node.js-43853D?style=for-the-badge&logo=node.js&logoColor=white
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,11 +1,10 @@
-import { Inter } from 'next/font/google'
 import type { Metadata } from 'next'
+import { Analytics } from '@vercel/analytics/react';
 
 import './globals.css'
 import Navbar from '@/components/ui/Navbar'
 import FooterSection from '@/components/FooterSection'
-
-const inter = Inter({ subsets: ['latin'] })
+import { Toaster } from 'react-hot-toast';
 
 export const metadata: Metadata = {
     title: 'RCS CTF 2024',
@@ -61,10 +60,13 @@ interface RootLayoutProps {
 export default function RootLayout({ children }: RootLayoutProps) {
     return (
         <html lang="en">
-            <body className={`${inter.className} text-text bg-background`}>
+            <body className={`text-text bg-background`}>
                 <Navbar />
                 {children}
                 <FooterSection />
+                <Analytics />
+                <Toaster />
+                {/* <RegisterDialog /> */}
             </body>
         </html>
     )

diff --git a/app/page.tsx b/app/page.tsx
@@ -1,65 +1,84 @@
+"use client";
 import SponsorSection from '@/components/SponsorSection'
 import CoreTeam from '@/components/CoreTeam'
 import CommunityPartners from '@/components/CommunityPartners'
 import PerksSection from '@/components/PerksSection'
 import RersourcePersons from '@/components/ResourcePersons'
 import TicketSection from '@/components/TicketSection'
 import VenueDate from '@/components/VenueDate'
-import { PlayCircleIcon } from '@heroicons/react/24/outline'
+import { PlayCircleIcon, PlusCircleIcon } from '@heroicons/react/24/outline'
 import Organisers from '@/components/Organisers'
+import RegisterDialog from '@/components/RegisterDialog'
+import { useState } from 'react'
 
 export default function Home() {
+    const [registerOpen, setRegisterOpen] = useState(false)
     return (
         <main className="text-text ">
-            <section className="flex relative flex-col min-h-screen lg:h-screen max-w-7xl mx-auto px-4 lg:px-8 pt-18 justify-center p-2">
-                <h1 className="text-5xl lg:text-6xl font-bold glitch">
-                    REPUBLIC OF <br />
-                    <span className="text-primary glitch">CYBER SENTINELS CTF</span>
-                </h1>
-                <h2 className="text-2xl lg:text-3xl font-bold pt-3">
-                    Decrypt, Defend, Conquer <br />
-                    <span>Cyber Sentinels at the Helm</span>
-                </h2>
-                <div className="paras max-w-xl flex gap-8 py-8">
-                    <p>
-                        Welcome to the Cyber Sentinels CTF, where digital
-                        warriors embrace the challenge. In the heartbeat of
-                        technology, our rallying cry is clear: &quot;Decrypt,
-                        Defend, Conquer.&quot; More than a Capture The Flag
-                        event, this is a journey into cybersecurity, where
-                        offense and defense converge.
-                    </p>
-                </div>
-                <div className="mt-10 text-xl flex items-center gap-3">
-                    <a href="https://blog.encryptedge.in/2023/RCS-CTF-2024/">
-                        <div className='flex text-white font-bold hover:bg-white hover:text-black hover:border-white hover:ring-1 hover:ring-white focus:ring-1 focus:ring-white'>
-                            <PlayCircleIcon
-                                height={30}
-                                width={30}
-                                className=""
-                            />{' '}
-                            <span className="">
-                                Read Blog
-                            </span>
-                        </div>
-                    </a>
-                </div>
-                <div className="date hidden lg:block absolute top-80 right-0 rotate-90">
-                    <p className="text-6xl text-primary font-bold tracking-[1.5rem]">
-                        CTF
-                    </p>
-                    <p className="text-4xl font-semibold ml-28">
-                        26 · 01 · 2024
-                    </p>
+            <section className="relative min-h-screen lg:h-screen w-screen">
+                <div className="flex relative flex-col min-h-screen lg:h-screen px-4 lg:px-8 pt-18 justify-center p-2 mx-auto max-w-7xl">
+                    <h1 className="text-5xl lg:text-6xl font-bold glitch">
+                        REPUBLIC OF <br />
+                        <span className="text-primary glitch">
+                            CYBER SENTINELS CTF
+                        </span>
+                    </h1>
+                    <h2 className="text-2xl lg:text-3xl font-bold pt-3">
+                        Decrypt, Defend, Conquer <br />
+                        <span>Cyber Sentinels at the Helm</span>
+                    </h2>
+                    <div className="paras max-w-xl flex gap-8 py-8">
+                        <p>
+                            Welcome to the Cyber Sentinels CTF, where digital
+                            warriors embrace the challenge. In the heartbeat of
+                            technology, our rallying cry is clear:
+                            &quot;Decrypt, Defend, Conquer.&quot; More than a
+                            Capture The Flag event, this is a journey into
+                            cybersecurity, where offense and defense converge.
+                        </p>
+                    </div>
+                    <div className="mt-10 text-xl flex items-center gap-3">
+                        <a href="https://blog.encryptedge.in/2023/RCS-CTF-2024/">
+                            <div className="flex text-white font-bold hover:bg-white hover:text-black hover:border-white hover:ring-1 hover:ring-white focus:ring-1 focus:ring-white">
+                                <PlayCircleIcon
+                                    height={30}
+                                    width={30}
+                                    className=""
+                                />{' '}
+                                <span className="">Read Blog</span>
+                            </div>
+                        </a>
+                        <button onClick={() =>
+                             setRegisterOpen(true)
+                        }>
+                            <div className="flex text-white font-bold hover:bg-white hover:text-black hover:border-white hover:ring-1 hover:ring-white focus:ring-1 focus:ring-white">
+                                <PlusCircleIcon
+                                    height={30}
+                                    width={30}
+                                    className=""
+                                />{' '}
+                                <span className="">Register Interest</span>
+                            </div>
+                        </button>
+                    </div>
+                    <div className="date hidden lg:block absolute top-80 right-0 rotate-90">
+                        <p className="text-6xl text-primary font-bold tracking-[1.5rem]">
+                            CTF
+                        </p>
+                        <p className="text-4xl font-semibold ml-28">
+                            26 · 01 · 2024
+                        </p>
+                    </div>
                 </div>
+
+                <video
+                    className="w-full h-screen absolute top-0 -z-10 object-cover"
+                    src="https://d2uvmg2nv1rjub.cloudfront.net/rcs-hero-back.mp4"
+                    autoPlay
+                    loop
+                    muted
+                />
             </section>
-            <video
-                className="w-full h-screen absolute top-0 -z-10 object-cover"
-                src="https://d2uvmg2nv1rjub.cloudfront.net/rcs-hero-back.mp4"
-                autoPlay
-                loop
-                muted
-            />
 
             <PerksSection />
             <VenueDate />
@@ -69,6 +88,7 @@ export default function Home() {
             <RersourcePersons />
             <CommunityPartners />
             <Organisers />
+            <RegisterDialog open={registerOpen} setOpen={setRegisterOpen} />
         </main>
     )
-}
+}
diff --git a/components/CommunityPartners/index.tsx b/components/CommunityPartners/index.tsx
@@ -5,7 +5,7 @@ import communityPartners from "@/config/communitypartners.json";
 function CommunityPartners() {
     return (
         <section className="lg:h-screen max-w-7xl mx-auto px-2 sm:px-4 lg:px-8 pt-28">
-            <h2 className="text-8xl text-primary font-bold">Community Partners</h2>
+            <h2 className="text-5xl lg:text-8xl text-primary font-bold">Community Partners</h2>
             <div className="list grid grid-cols-2 lg:grid-cols-3 w-full gap-8 lg:gap-16 p-8 lg:p-10 max-w-4xl mx-auto">
                 {communityPartners.map((member) => (
                     <div key={member.name} className="flex flex-col items-center lg:px-5">

diff --git a/components/CoreTeam/index.tsx b/components/CoreTeam/index.tsx
@@ -5,7 +5,7 @@ import coreTeam from "@/config/coreteam.json";
 function CoreTeam() {
     return (
         <section className="lg:h-screen max-w-7xl mx-auto px-2 sm:px-4 lg:px-8 pt-28">
-            <h2 className="text-8xl text-primary font-bold">Core Team</h2>
+            <h2 className="text-5xl lg:text-8xl text-primary font-bold">Core Team</h2>
             <div className="list grid grid-cols-2 lg:grid-cols-3 w-full gap-8 lg:gap-16 p-8 lg:p-10 max-w-4xl mx-auto">
                 {coreTeam.map((member) => (
                     <div key={member.name} className="flex flex-col items-center lg:px-5">

diff --git a/components/FooterSection/index.tsx b/components/FooterSection/index.tsx
@@ -4,10 +4,10 @@ import { Discord, Whatsapp } from '@/components/ui/Icons'
 
 const FooterSection: React.FC = () => {
     return (
-        <footer className="flex flex-col md:flex-row items-center justify-between w-screen p-10 max-w-7xl mx-auto px-4 lg:px-8">
+        <footer className="flex gap-5 flex-col md:flex-row items-center justify-between w-screen p-10 max-w-7xl mx-auto px-4 lg:px-8">
             <div>
                 <p className="text-3xl mb-3">Follow Us:</p>
-                <div className="icons flex items-center gap-5">
+                <div className="icons flex flex-wrap max-w-full items-center gap-5">
                     <a
                         className="rounded-full border-2 border-white p-2"
                         href="https://s.encryptedge.in/fb"
@@ -46,7 +46,7 @@ const FooterSection: React.FC = () => {
                     </a>
                 </div>
             </div>
-            <div className="contact-us text-right">
+            <div className="contact-us lg:text-right">
                 {/* Add your contact email here */}
                 <p className="text-3xl font-bold">Queries</p>
                 <p className="text-3xl">

diff --git a/components/Organisers/index.tsx b/components/Organisers/index.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 function Organisers() {
     return (
         <section className="max-w-7xl mx-auto px-2 sm:px-4 lg:px-8 pt-28">
-            <h2 className="text-8xl text-primary font-bold">Organisers</h2>
+            <h2 className="text-5xl lg:text-8xl text-primary font-bold">Organisers</h2>
             <div className="list w-full gap-8 lg:gap-16 p-8 lg:p-10 max-w-4xl mx-auto">
                     <div key="ee" className="flex flex-col items-center lg:px-5">
                         <div className="w-full border-primary border-2 overflow-hidden">