From a2e26f56bd46d6b054dbf313a85f50221958bf1f Mon Sep 17 00:00:00 2001 From: Rizz-33 <162025795+Rizz-33@users.noreply.github.com> Date: Thu, 9 May 2024 09:22:49 +0530 Subject: [PATCH 1/2] feat: Event details --- public/assets/coin.png | Bin 0 -> 7695 bytes public/assets/eventDetails.png | Bin 0 -> 6692 bytes src/app/page.tsx | 2 + src/components/landing/eventDetails.tsx | 51 ++++++++++++++++++++++++ src/components/ui/coins-line.tsx | 45 +++++++++++++++++++++ src/components/ui/marquee.tsx | 27 +++++++++++++ 6 files changed, 125 insertions(+) create mode 100644 public/assets/coin.png create mode 100644 public/assets/eventDetails.png create mode 100644 src/components/landing/eventDetails.tsx create mode 100644 src/components/ui/coins-line.tsx create mode 100644 src/components/ui/marquee.tsx diff --git a/public/assets/coin.png b/public/assets/coin.png new file mode 100644 index 0000000000000000000000000000000000000000..6ba7077baf758ee42bd47ff9e2d717c7b23d7ef3 GIT binary patch literal 7695 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 + ); } diff --git a/src/components/landing/eventDetails.tsx b/src/components/landing/eventDetails.tsx new file mode 100644 index 0000000..a8eadf3 --- /dev/null +++ b/src/components/landing/eventDetails.tsx @@ -0,0 +1,51 @@ +'use client' +import Image from "next/image"; +import CoinsRow from "../ui/coins-line"; +import EventDetailsMarquee from "../ui/marquee"; + +export default function EventDetails() { + return ( +
+ +
+
+ eventDetails +
+
+

+ WHAT IS + Techie Sleuths? +

+

+ Lorem ipsum dolor sit amet, consectetur{" "} + adipiscing +
+ elit. Nunc vulputate libero et velit interdum, ac +
+ aliquet odio mattis. Class aptent taciti sociosqu +
+ ad litora torquent per conubia nostr! +

+

+ View past events{" "} + {">"} +

+
+
+
+ +
+
+ ); +} diff --git a/src/components/ui/coins-line.tsx b/src/components/ui/coins-line.tsx new file mode 100644 index 0000000..d5be5ae --- /dev/null +++ b/src/components/ui/coins-line.tsx @@ -0,0 +1,45 @@ +'use client' +import React from 'react'; + +interface CoinsRowProps { + centerCount: number; + sideCount: number; +} + +const CoinsRow: React.FC = ({ centerCount, sideCount }) => { + const totalImages = centerCount + 2 * sideCount; + + const images = Array(totalImages).fill({ src: "/assets/coin.png", alt: "Coin" }); + + const centerStartIndex = sideCount; + const centerEndIndex = centerStartIndex + centerCount; + + return ( +
+ {images.map((image, index) => { + let opacity = 0; + + if (index >= centerStartIndex && index < centerEndIndex) { + opacity = 1; + } else if (index < centerStartIndex) { + const distanceFromCenter = centerStartIndex - index; + opacity = 1 - distanceFromCenter * (1 / sideCount); + } else { + const distanceFromCenter = index - centerEndIndex; + opacity = 1 - distanceFromCenter * (1 / sideCount); + } + + return ( + {image.alt} + ); + })} +
+ ); +}; + +export default CoinsRow; diff --git a/src/components/ui/marquee.tsx b/src/components/ui/marquee.tsx new file mode 100644 index 0000000..0318886 --- /dev/null +++ b/src/components/ui/marquee.tsx @@ -0,0 +1,27 @@ +'use client' +import Image from "next/image"; +import Marquee from "react-fast-marquee"; + +export default function EventDetailsMarquee() { + const count = 2; + return ( + + {Array.from({ length: count }).map((_, index) => ( +
+

+ COMING SOON +

+
+ mush +
+
+ ))} + + ); +} From d729a08d380217982f9d7904225b308d9f097477 Mon Sep 17 00:00:00 2001 From: Rizz-33 <162025795+Rizz-33@users.noreply.github.com> Date: Thu, 9 May 2024 11:20:46 +0530 Subject: [PATCH 2/2] refactor: Resposive event details --- src/components/landing/eventDetails.tsx | 62 +++++++++++++++++-------- 1 file changed, 43 insertions(+), 19 deletions(-) diff --git a/src/components/landing/eventDetails.tsx b/src/components/landing/eventDetails.tsx index a8eadf3..e7ad151 100644 --- a/src/components/landing/eventDetails.tsx +++ b/src/components/landing/eventDetails.tsx @@ -1,34 +1,58 @@ -'use client' -import Image from "next/image"; -import CoinsRow from "../ui/coins-line"; -import EventDetailsMarquee from "../ui/marquee"; +'use client'; +import Image from 'next/image'; +import { useEffect, useState } from 'react'; +import CoinsRow from '../ui/coins-line'; +import EventDetailsMarquee from '../ui/marquee'; export default function EventDetails() { + const [isSmallScreen, setIsSmallScreen] = useState(false); + + useEffect(() => { + const handleResize = () => { + setIsSmallScreen(window.innerWidth < 1200); + }; + + handleResize(); + + window.addEventListener('resize', handleResize); + + return () => { + window.removeEventListener('resize', handleResize); + }; + }, []); + + const coinCenterCount = isSmallScreen ? 3 : 5; + const coinSideCount = isSmallScreen ? 3 : 6; + + // Set image dimensions based on screen size + const imageWidth = isSmallScreen ? 200 : 350; + const imageHeight = isSmallScreen ? 250 : 400; + return (
-
-
+
+
eventDetails
-
-

+
+

WHAT IS Techie Sleuths?

- Lorem ipsum dolor sit amet, consectetur{" "} + Lorem ipsum dolor sit amet, consectetur{' '} adipiscing
elit. Nunc vulputate libero et velit interdum, ac @@ -37,14 +61,14 @@ export default function EventDetails() {
ad litora torquent per conubia nostr!

-

- View past events{" "} - {">"} +

+ View past events{' '} + {'>'}

-
- +
+
);