From 9d373bebab1eff4f1be9f17af40195fdd25c170c Mon Sep 17 00:00:00 2001 From: Marc Anthony Tumminello Date: Fri, 25 Apr 2025 14:48:27 -0400 Subject: [PATCH 1/6] initial commit to favorite-resources branch # Conflicts: # app/page.tsx --- app/components/benefits/Benefits.tsx | 24 +++++++++ app/components/benefits/BenefitsCard.tsx | 21 ++++++++ app/components/benefits/benefits-data.ts | 69 ++++++++++++++++++++++++ app/page.tsx | 4 +- 4 files changed, 117 insertions(+), 1 deletion(-) create mode 100644 app/components/benefits/Benefits.tsx create mode 100644 app/components/benefits/BenefitsCard.tsx create mode 100644 app/components/benefits/benefits-data.ts diff --git a/app/components/benefits/Benefits.tsx b/app/components/benefits/Benefits.tsx new file mode 100644 index 0000000..21a5036 --- /dev/null +++ b/app/components/benefits/Benefits.tsx @@ -0,0 +1,24 @@ +import React from 'react'; +import { BENEFITS_DATA } from './benefits-data'; +import BenefitsCard from './BenefitsCard'; +import { BenefitsType } from './benefits-data'; + +const Benefits = () => { + return ( + <> +
+
+

Benefits of Joining Flushing Tech

+

There are many!

+
+
+ {BENEFITS_DATA.map(({ title, description }:BenefitsType ) => ( + + ))} +
+
+ + ) +}; + +export default Benefits; diff --git a/app/components/benefits/BenefitsCard.tsx b/app/components/benefits/BenefitsCard.tsx new file mode 100644 index 0000000..5fae658 --- /dev/null +++ b/app/components/benefits/BenefitsCard.tsx @@ -0,0 +1,21 @@ +import React from 'react'; +import { BenefitsType } from './benefits-data'; + +const BenefitsCard = ({ title, description, headerColor }: BenefitsType) => { + return ( +
+
+
+

+ {title} +

+
+
+
+ {description} +
+
+ ) +} + +export default BenefitsCard; diff --git a/app/components/benefits/benefits-data.ts b/app/components/benefits/benefits-data.ts new file mode 100644 index 0000000..786c2f0 --- /dev/null +++ b/app/components/benefits/benefits-data.ts @@ -0,0 +1,69 @@ + +export type BenefitsType = { + title: string; + description: string; + headerColor?: string; // Tailwind bg-* class +}; + +export const BENEFITS_DATA: BenefitsType[] = [ + { + title: "Collaborative Hackathons", + description: + "Join hands-on coding events where you can brainstorm, build, and launch creative projects with like-minded individuals.", + headerColor: "bg-blue-600", + }, + { + title: "Real-World Experience", + description: + "Gain practical development experience by working on real projects under time constraints — just like in tech jobs.", + headerColor: "bg-emerald-600", + }, + { + title: "Meet Developers & Creators", + description: + "Connect with developers, designers, and tech enthusiasts from Flushing and beyond. Expand your circle and make new friends.", + headerColor: "bg-pink-600", + }, + { + title: "Learn by Doing", + description: + "Whether you're a beginner or experienced, you'll level up by solving problems, debugging, and shipping ideas fast.", + headerColor: "bg-indigo-600", + }, + { + title: "Get Inspired", + description: + "Hear from guest speakers, mentors, and fellow hackers about their journeys. Leave every event with new motivation.", + headerColor: "bg-rose-600", + }, + { + title: "Build Your Portfolio", + description: + "Add hackathon projects to your GitHub and resume — show employers what you’ve created, not just what you know.", + headerColor: "bg-yellow-500", // yellow-600 is a bit hard on the eyes + }, + { + title: "Team Up with Others", + description: + "Find teammates with complementary skills. Designers, coders, product thinkers — build something awesome together.", + headerColor: "bg-violet-600", + }, + { + title: "Win Prizes & Recognition", + description: + "Compete for cool prizes and earn recognition from local businesses, mentors, and peers.", + headerColor: "bg-orange-500", + }, + { + title: "Stay Ahead of Trends", + description: + "Explore new tools, frameworks, and APIs. Hackathons are a playground for trying out cutting-edge tech.", + headerColor: "bg-cyan-600", + }, + { + title: "Supportive Community", + description: + "No gatekeeping, just good vibes. Whether you’re building your first app or tenth, you’re welcome here.", + headerColor: "bg-teal-600", + }, +]; diff --git a/app/page.tsx b/app/page.tsx index 523fd32..9c36d58 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -4,6 +4,7 @@ import HeroComponent from "@/components/components-hero" import ProjectsComponent from "@/components/components-projects" import ConnectWithUsComponent from "@/components/components-connect-with-us" import FooterComponent from "@/components/components-footer" +import Benefits from "./components/benefits/Benefits" export default function Homepage() { return ( @@ -12,6 +13,7 @@ export default function Homepage() { + ) -} \ No newline at end of file +} From 7bbc98b10010c436e4660119b870104f823730db Mon Sep 17 00:00:00 2001 From: Marc Anthony Tumminello Date: Thu, 24 Apr 2025 20:28:19 -0400 Subject: [PATCH 2/6] fixed columns grid layout --- app/components/benefits/Benefits.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/components/benefits/Benefits.tsx b/app/components/benefits/Benefits.tsx index 21a5036..ab38979 100644 --- a/app/components/benefits/Benefits.tsx +++ b/app/components/benefits/Benefits.tsx @@ -6,12 +6,12 @@ import { BenefitsType } from './benefits-data'; const Benefits = () => { return ( <> -
+

Benefits of Joining Flushing Tech

There are many!

-
+
{BENEFITS_DATA.map(({ title, description }:BenefitsType ) => ( ))} From 1c4b89172c319c4751c1d8d02ba86a91ee8f8536 Mon Sep 17 00:00:00 2001 From: Marc Anthony Tumminello Date: Fri, 25 Apr 2025 16:27:48 -0400 Subject: [PATCH 3/6] finished benefits-section. Button currently not linked to a page yet. Adjusted Button size XL to fit more text --- app/components/benefits/Benefits.tsx | 42 +++++++++++++++--------- app/components/benefits/BenefitsCard.tsx | 26 +++++++-------- app/components/benefits/benefits-data.ts | 36 +++++++++++++------- app/page.tsx | 2 +- components/ui/button.tsx | 2 +- 5 files changed, 66 insertions(+), 42 deletions(-) diff --git a/app/components/benefits/Benefits.tsx b/app/components/benefits/Benefits.tsx index ab38979..2b9c44a 100644 --- a/app/components/benefits/Benefits.tsx +++ b/app/components/benefits/Benefits.tsx @@ -1,24 +1,36 @@ import React from 'react'; -import { BENEFITS_DATA } from './benefits-data'; +import { BENEFITS_HOME_DATA, BenefitsHomeType } from './benefits-data'; import BenefitsCard from './BenefitsCard'; -import { BenefitsType } from './benefits-data'; +import { Button } from '@/components/ui/button'; const Benefits = () => { return ( - <> -
-
-

Benefits of Joining Flushing Tech

-

There are many!

-
-
- {BENEFITS_DATA.map(({ title, description }:BenefitsType ) => ( - - ))} -
+
+
+

+ Benefits of Joining Flushing Tech +

+

There are many!

- - ) + +
+ {BENEFITS_HOME_DATA.map(({ title, description, icon }: BenefitsHomeType, index) => ( +
+ +
+ ))} +
+ +
+ +
+
+ ); }; export default Benefits; diff --git a/app/components/benefits/BenefitsCard.tsx b/app/components/benefits/BenefitsCard.tsx index 5fae658..e8745e0 100644 --- a/app/components/benefits/BenefitsCard.tsx +++ b/app/components/benefits/BenefitsCard.tsx @@ -1,21 +1,19 @@ + import React from 'react'; -import { BenefitsType } from './benefits-data'; +import { BenefitsHomeType } from './benefits-data'; + +const BenefitsCard = ({ title, description, icon }: BenefitsHomeType) => { + const Icon = icon; -const BenefitsCard = ({ title, description, headerColor }: BenefitsType) => { return ( -
-
-
-

- {title} -

-
-
-
- {description} +
+
+
+

{title}

+

{description}

- ) -} + ); +}; export default BenefitsCard; diff --git a/app/components/benefits/benefits-data.ts b/app/components/benefits/benefits-data.ts index 786c2f0..53e7a8d 100644 --- a/app/components/benefits/benefits-data.ts +++ b/app/components/benefits/benefits-data.ts @@ -1,69 +1,83 @@ +import { RocketIcon, Users, FileText, LucideIcon } from "lucide-react"; export type BenefitsType = { title: string; description: string; - headerColor?: string; // Tailwind bg-* class }; +export type BenefitsHomeType = { + title: string; + description: string; + icon: LucideIcon; +} + +export const BENEFITS_HOME_DATA: BenefitsHomeType[] = [ + { + title: "Rapid Skill Growth", + description: "Sharpen your coding skills and learn new technologies fast by working on real-world challenges in a supportive, high-energy environment.", + icon: RocketIcon, + }, + { + title: "Collaborative Networking", + description: "Meet other passionate developers, designers, and entrepreneurs. Build lasting connections that can lead to future projects, jobs, or startup ideas.", + icon: Users, + }, + { + title: "Build Your Portfolio", + description: "Create tangible projects you can showcase to employers or clients. Every hackathon is a chance to walk away with a new portfolio piece and more experience.", + icon: FileText, + }, +]; + export const BENEFITS_DATA: BenefitsType[] = [ { title: "Collaborative Hackathons", description: "Join hands-on coding events where you can brainstorm, build, and launch creative projects with like-minded individuals.", - headerColor: "bg-blue-600", }, { title: "Real-World Experience", description: "Gain practical development experience by working on real projects under time constraints — just like in tech jobs.", - headerColor: "bg-emerald-600", }, { title: "Meet Developers & Creators", description: "Connect with developers, designers, and tech enthusiasts from Flushing and beyond. Expand your circle and make new friends.", - headerColor: "bg-pink-600", }, { title: "Learn by Doing", description: "Whether you're a beginner or experienced, you'll level up by solving problems, debugging, and shipping ideas fast.", - headerColor: "bg-indigo-600", }, { title: "Get Inspired", description: "Hear from guest speakers, mentors, and fellow hackers about their journeys. Leave every event with new motivation.", - headerColor: "bg-rose-600", }, { title: "Build Your Portfolio", description: "Add hackathon projects to your GitHub and resume — show employers what you’ve created, not just what you know.", - headerColor: "bg-yellow-500", // yellow-600 is a bit hard on the eyes }, { title: "Team Up with Others", description: "Find teammates with complementary skills. Designers, coders, product thinkers — build something awesome together.", - headerColor: "bg-violet-600", }, { title: "Win Prizes & Recognition", description: "Compete for cool prizes and earn recognition from local businesses, mentors, and peers.", - headerColor: "bg-orange-500", }, { title: "Stay Ahead of Trends", description: "Explore new tools, frameworks, and APIs. Hackathons are a playground for trying out cutting-edge tech.", - headerColor: "bg-cyan-600", }, { title: "Supportive Community", description: "No gatekeeping, just good vibes. Whether you’re building your first app or tenth, you’re welcome here.", - headerColor: "bg-teal-600", }, ]; diff --git a/app/page.tsx b/app/page.tsx index 9c36d58..50e600a 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -12,8 +12,8 @@ export default function Homepage() { - +
) } diff --git a/components/ui/button.tsx b/components/ui/button.tsx index 957392b..81c2b4c 100644 --- a/components/ui/button.tsx +++ b/components/ui/button.tsx @@ -24,7 +24,7 @@ const buttonVariants = cva( default: "h-9 px-6", sm: "h-8 px-3 text-xs", lg: "h-12 px-8 text-lg", - xl: "h-16 w-64 px-10 text-2xl", + xl: "h-16 px-10 text-2xl min-w-64", icon: "h-9 w-9", }, }, From 8e563a9d0f27d83654aefe1ffcd69d915c60c57f Mon Sep 17 00:00:00 2001 From: Marc Anthony Tumminello Date: Fri, 25 Apr 2025 16:30:44 -0400 Subject: [PATCH 4/6] changed heading and sub-heading to benefits section --- app/components/benefits/Benefits.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/components/benefits/Benefits.tsx b/app/components/benefits/Benefits.tsx index 2b9c44a..5a657ae 100644 --- a/app/components/benefits/Benefits.tsx +++ b/app/components/benefits/Benefits.tsx @@ -8,9 +8,9 @@ const Benefits = () => {

- Benefits of Joining Flushing Tech + Level Up with Flushing Tech

-

There are many!

+

Member Benefits

From 3fc3ef5bb493a943cf37a7f686e32419216ed786 Mon Sep 17 00:00:00 2001 From: Marc Anthony Tumminello Date: Sun, 27 Apr 2025 15:26:17 -0400 Subject: [PATCH 5/6] button links to the meetup.com page for now until an about page is created. --- app/components/benefits/Benefits.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/app/components/benefits/Benefits.tsx b/app/components/benefits/Benefits.tsx index 5a657ae..a546524 100644 --- a/app/components/benefits/Benefits.tsx +++ b/app/components/benefits/Benefits.tsx @@ -2,6 +2,7 @@ import React from 'react'; import { BENEFITS_HOME_DATA, BenefitsHomeType } from './benefits-data'; import BenefitsCard from './BenefitsCard'; import { Button } from '@/components/ui/button'; +import Link from 'next/link'; const Benefits = () => { return ( @@ -25,9 +26,11 @@ const Benefits = () => {
- + + +
); From 930ab6e421c6c2b10443509247417254d213851d Mon Sep 17 00:00:00 2001 From: Marc Anthony Tumminello Date: Mon, 28 Apr 2025 08:16:23 -0400 Subject: [PATCH 6/6] fixed buttons xl buttons were taking up too much space on extra small mobile screens. --- app/components/benefits/Benefits.tsx | 2 +- components/ui/button.tsx | 14 +++++++------- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/app/components/benefits/Benefits.tsx b/app/components/benefits/Benefits.tsx index a546524..7d503a4 100644 --- a/app/components/benefits/Benefits.tsx +++ b/app/components/benefits/Benefits.tsx @@ -27,7 +27,7 @@ const Benefits = () => {
- diff --git a/components/ui/button.tsx b/components/ui/button.tsx index 81c2b4c..cda1a28 100644 --- a/components/ui/button.tsx +++ b/components/ui/button.tsx @@ -20,13 +20,13 @@ const buttonVariants = cva( ghost: "hover:bg-accent hover:text-accent-foreground", link: "text-primary underline-offset-4 hover:underline", }, - size: { - default: "h-9 px-6", - sm: "h-8 px-3 text-xs", - lg: "h-12 px-8 text-lg", - xl: "h-16 px-10 text-2xl min-w-64", - icon: "h-9 w-9", - }, + size: { + default: "h-9 px-6", + sm: "h-8 px-3 text-xs", + lg: "h-12 px-8 text-lg", + xl: "h-16 px-6 sm:px-10 text-lg sm:text-2xl", + icon: "h-9 w-9", + }, }, defaultVariants: { variant: "default",