Merge pull request #26 from Deerwalk-Developers-Community/dev

Dev

src/app/layout.tsx

@@ -21,7 +21,7 @@ const orbitron = Orbitron({
 
 export const metadata: Metadata = {
   title: "Deertober",
-  description: "Open Source Event under Hacktober",
+  description: "Deertober powered by Major League Hacking",
 };
 
 export default function RootLayout({

src/app/page.tsx

@@ -4,11 +4,14 @@ import { ParticipatingSection } from "@/modules/participatingSection";
 import { BeginnerResource } from "@/modules/resourceForBeginner";
 // import Image from "next/image";
 import { FooterSection } from "@/modules/footer";
+import { IntroductionSection } from "@/modules/intro";
 
 export default function Home() {
   return (
     <div className=" bg-black">
+
       <HeroSection />
+      <IntroductionSection />
       <BeginnerResource />
       <ParticipatingSection />
       <FaqSection />

src/components/HeroHeader.tsx

@@ -11,7 +11,7 @@ interface HeroHeaderProp {
 
 const Header: React.FC<HeroHeaderProp> = ({ logo }) => {
   return (
-    <header className="flex relative flex-wrap gap-5 mt-12 p-5 mx-auto justify-between items-center w-full text-4xl text-center text-white max-md:max-w-full">
+    <header className="flex relative flex-wrap gap-5 mt-0 p-5 mx-auto justify-between items-center w-full text-4xl text-center text-white max-md:max-w-full">
       {logo && <p className="w-32 md:w-32 lg:w-32">Deertober</p>}
       {/* <HeroLevel
         className="w-32 text-lg md:text-xl lg:text-2xl md:w-48 lg:w-fit"

src/modules/faq/page.tsx

@@ -34,12 +34,12 @@ const Page = () => {
   ];
 
   return (
-    <div className="relative flex flex-col justify-center font-bold bg-neutral-950 min-h-screen overflow-hidden">
+    <div className="relative flex flex-col justify-center font-bold bg-neutral-950 min-h-screen overflow-hidden pb-10 pt-0">
       <Stars className="absolute inset-0 w-fit h-full  min-h-[100vh] object-cover z-0" />{" "}
       <div className="relative flex flex-col w-full min-h-[1016px] max-md:min-h-screen max-md:px-5 max-md:max-w-full z-10">
         {" "}
         <Header level="3" logo={false} />
-        <main className="flex  flex-col relative gap-5 lg:gap-10 items-center lg:items-start justify-start lg:justify-center self-center mt-16 ml-4 w-full max-w-[1654px] max-md:mt-10 max-md:max-w-full p-10">
+        <main className="flex  flex-col relative gap-5 lg:gap-10 items-center lg:items-start justify-start lg:justify-center self-center mt-16 ml-4 w-full max-w-[1654px] max-md:mt-10 max-md:max-w-full p-10 pt-0">
           <div className="flex flex-row items-center justify-center gap-3 lg:gap-5  md:gap-2">
             <Arrow className="object-contain shrink-0 mt-20 max-w-full aspect-[1.96] w-[116px] max-md:mt-10 max-md:w-[80px]" />
             <h1 className="grow shrink mt-24 text-4xl lg:text-6xl text-white w-[293px] max-md:mt-10 max-md:text-3xl max-md:w-full ">

src/modules/footer/components/footerlist.tsx

@@ -2,9 +2,9 @@ import React from "react";
 
 const FooterList = () => {
   return (
-    <div className="flex flex-col justify-end w-full">
+    <div className="flex flex-col justify-end w-screen">
       {/* Footer */}
-      <footer className="bg-[#183717] w-full pt-10 ">
+      <footer className="bg-[#183717] w-screen pt-10 ">
         {" "}
         {/* Updated background color */}
         <div className="container mx-auto px-6 flex flex-col lg:flex-row lg:justify-center justify-between lg:gap-48 items-start text-white space-y-0 lg:space-y-0">
@@ -36,7 +36,7 @@ const FooterList = () => {
           </div>
 
           {/* Wrap Share, Follow, and Legal sections in a flex container */}
-          <div className="flex flex-col lg:flex-row gap-12 lg:gap-20 pt-10 lg:pt-20 w-full">
+          <div className="flex flex-col lg:flex-row gap-12 lg:gap-20 pt-10 px-10 lg:pt-20 w-full">
             {/* Share Links */}
             <div className="lg:w-1/4 mb-8">
               <h4 className="text-2xl lg:text-4xl font-semibold mb-4 border-b-4 border-dashed border-white pb-2">
@@ -98,17 +98,17 @@ const FooterList = () => {
                   </a>
                 </li>
                 <li>
-                  <a href="#" className="underline">
+                  <a href="https://www.linkedin.com/company/d-dev-community/posts/?feedView=all" className="underline">
                     LinkedIn
                   </a>
                 </li>
                 <li>
-                  <a href="#" className="underline">
+                  <a href="https://www.instagram.com/dwit_ddc/" className="underline">
                     Instagram
                   </a>
                 </li>
                 <li>
-                  <a href="#" className="underline">
+                  <a href="mailto:[email protected]" className="underline">
                     Email
                   </a>
                 </li>

src/modules/hero/components/HeroSection.tsx

@@ -29,7 +29,7 @@ const Hero = () => {
       </div>
 
       <a href="https://events.mlh.io/events/11699-deertober" target="_blank">
-        <button className="mt-4 w-44 md:w-44 bg-white text-lg md:text-xl text-black font-bold py-3 px-6 border-r-3 flex justify-center md:justify-start items-center gap-3 hover:bg-gray-200">
+        <button className="mt-4 w-52 bg-white text-lg md:text-xl text-black font-bold py-3 px-6 border-r-3 flex justify-center md:justify-start items-center gap-3 hover:bg-gray-200">
           REGISTER
           <span className="text-lg md:text-xl">→</span>
         </button>

src/modules/hero/page.tsx

@@ -6,13 +6,12 @@ import Alien from "./assets/Aliens";
 
 const Page = () => {
   return (
-    <div className="relative flex flex-col justify-center font-bold bg-neutral-950 min-h-screen overflow-hidden">
-      <Stars className="absolute inset-0 w-fit h-full  min-h-[100vh] object-cover z-0" />{" "}
-      <Alien className="absolute top-0 right-96 w-[400px] h-[400px] lg:w-[600px] lg:h-[600px] min-h-[50vh] object-cover z-[1] transform translate-y-[20vh] translate-x-[10vw] hidden md:block" />{" "}
-      <div className="relative flex flex-col w-full min-h-[1016px] max-md:min-h-screen max-md:px-5 max-md:max-w-full z-10">
-        {" "}
+    <div className="relative flex flex-col justify-center font-bold bg-neutral-950 min-h-screen overflow-hidden p-0 m-0">
+      <Stars className="absolute inset-0 w-fit h-full min-h-[100vh] object-cover z-0" />
+      <Alien className="absolute top-0 right-96 w-[400px] h-[400px] lg:w-[600px] lg:h-[600px] min-h-[50vh] object-cover z-[1] transform translate-y-[20vh] translate-x-[10vw] hidden xl:block" />
+      <div className="relative flex flex-col w-full max-md:min-h-screen max-md:px-5 max-md:max-w-full z-10 p-0 m-0">
         <Header logo={true} />
-        <main className="mt-36">
+        <main className="mt-36 mb-0 pb-0">
           <Hero />
         </main>
       </div>

src/modules/intro/assets/Box.tsx

@@ -0,0 +1,73 @@
+import React from "react";
+
+const Box = ({ className }: { className?: string }) => {
+  return (
+    <svg
+      width="793"
+      height="283"
+      viewBox="0 0 793 283"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        d="M713.731 266.382V282.239H63.4126V266.382H713.731ZM777.144 0.413086V218.826H761.287V234.682H745.431V250.538H729.575V282.239H745.431V266.382H761.287V250.526H777.144V234.67H793V0.413086H777.144Z"
+        fill="#71219D"
+      />
+      <path
+        d="M47.5478 25.6003H31.6944V12.7952H47.5478V25.6003ZM31.6944 25.6003H15.841V38.4054H31.6944V25.6003ZM745.293 25.6003V12.7952H729.44V25.6003H745.293ZM761.147 38.4054V25.6003H745.293V38.4054H761.147ZM0 38.4054V227.595H15.8534V38.4054H0ZM15.8534 227.595V240.4H31.7067V227.595H15.8534ZM729.44 0H47.5478V12.8051H729.44V0ZM745.293 240.4H761.147V227.595H745.293V240.4ZM761.147 38.4054V227.595H777V38.4054H761.147ZM729.452 253.195H745.306V240.39H729.452V253.195ZM47.5601 253.195V266H729.452V253.195H47.5478H47.5601ZM31.7067 240.39V253.195H47.5601V240.39H31.7067Z"
+        fill="#FF9569"
+      />
+      <path
+        d="M146.522 146.391H152.304V152.174H163.87V146.391H169.652V140.609H181.217V146.391H187V152.174H181.217V163.739H175.434V157.956H169.652V181.087H152.304V169.522H146.522V157.956H140.739V146.391H146.522Z"
+        fill="#722626"
+      />
+      <path
+        d="M94.4781 169.522V175.304H82.9132V181.087H77.1304V192.652H82.9132V198.434H88.6953V204.217H100.261V186.87H94.4781V192.652H88.6953V186.87V181.087H100.261V169.522H106.044V157.956H94.4781V169.522Z"
+        fill="#722626"
+      />
+      <path
+        d="M163.87 163.739V152.174H152.304V163.739H158.087V169.522H163.87V175.304H158.087V181.087H152.304V175.304H146.522V163.739H140.739V152.174H146.522V140.609H152.304V129.044H146.522V123.261H152.304V111.696H158.087V94.3477H152.304V88.5656H146.522V82.7828H140.739V77H134.956H111.826V82.7828H106.044V88.5656H100.261V94.3477H94.4781V111.696H100.261V123.261H106.044V134.826H100.261V129.044H94.4781V123.261H77.1305V117.478H65.5656V123.261H59.7828V129.044H54V134.826H59.7828V140.609H65.5656V146.391H71.3477V140.609V134.826H65.5656V129.044H71.3477V134.826H77.1305H88.6953V140.609H94.4781V152.174H88.6953V146.391H82.9133V152.174H71.3477V157.956H65.5656V169.522H59.7828V163.739H54V181.087H71.3477V169.522H77.1305V163.739H82.9133V157.956H88.6953V169.522H100.261V163.739H106.044V157.956H111.826V163.739V169.522H106.044V181.087H100.261V186.87H106.044V192.652V198.434H111.826V204.217H129.174V192.652H123.391V198.434H117.609V181.087H111.826V175.304H123.391V163.739V157.956H129.174V163.739H134.956V175.304H140.739V186.87H146.522V192.652H152.304H163.87V186.87H169.652V175.304V163.739H163.87Z"
+        fill="#9B3A38"
+      />
+      <path
+        d="M134.957 117.478H129.174V123.261H134.957V117.478Z"
+        fill="#28211C"
+      />
+      <path
+        d="M117.609 117.478H111.826V123.261H117.609V117.478Z"
+        fill="#28211C"
+      />
+      <path
+        d="M134.956 82.7827H129.174V88.5655H134.956V94.3476H140.739V88.5655H134.956V82.7827Z"
+        fill="#AB403E"
+      />
+      <path
+        d="M111.826 105.913H106.044V111.696H100.261V117.478H106.044V111.696H111.826V105.913Z"
+        fill="#AB403E"
+      />
+      <path
+        d="M140.739 111.696H146.522V105.913H140.739V111.696Z"
+        fill="#AB403E"
+      />
+      <path
+        d="M106.044 157.956V152.174H111.826V146.391H117.609V152.174H111.826V157.956H106.044Z"
+        fill="#873331"
+      />
+      <path
+        d="M146.522 146.392H140.739V140.609H134.956V134.826H140.739V140.609H146.522V146.392Z"
+        fill="#873331"
+      />
+      <path
+        d="M77.1304 129.044H71.3477V134.827H77.1304V129.044Z"
+        fill="#873331"
+      />
+      <path
+        d="M88.6953 134.826H94.4781V140.609H100.261V146.392H94.4781V140.609H88.6953V134.826Z"
+        fill="#873331"
+      />
+    </svg>
+  );
+};
+
+export default Box;