resources

src/components/Category.astro

@@ -10,7 +10,8 @@ const isActive =
 	(currentPath === '/' && name === 'Home') ||
 	(currentPath === '/contact' && name === 'Contact') ||
 	(currentPath === '/sponsors' && name === 'Sponsors') ||
-	(currentPath === '/team' && name === 'Team')
+	(currentPath === '/team' && name === 'Team') ||
+	(currentPath === '/resources' && name === 'Resources')
 ---
 
 <a
@@ -22,7 +23,9 @@ const isActive =
 				? '/sponsors'
 				: name === 'Team'
 					? '/team'
-					: sluglify(`/category/${unsluglifyNameCategory}/1`)}
+					: name === 'Resources'
+						? '/resources'
+						: sluglify(`/category/${unsluglifyNameCategory}/1`)}
 	class={cn(
 		`text-gray-600 dark:text-gray-300  pb-2.5 first-letter:uppercase font-medium hover:text-gray-800 border-b-2 border-opacity-0 dark:border-opacity-0 border-black dark:border-white dark:hover:border-white hover:border-opacity-100 transition-colors duration-150 ease-linear  `,
 		isActive &&

src/components/Header.astro

@@ -69,6 +69,7 @@ import { SOCIALNETWORKS } from '@/data/links'
 					Projects
 				</HeaderLink>
 				<HeaderLink href='/team' class='flex items-center gap-1 text-lg'>Team</HeaderLink>
+				<HeaderLink href='/resources' class='flex items-center gap-1 text-lg'>Resources</HeaderLink>
 				<HeaderLink href='/sponsors' class='flex items-center gap-1 text-lg'>Sponsors</HeaderLink>
 				<HeaderLink href='/contact' class='flex items-center gap-1 text-lg'>Contact</HeaderLink>
 				<HeaderLink href='/tags' class='flex items-center gap-1 text-lg'>

src/components/ListCategories.astro

@@ -14,6 +14,7 @@ const { activeCategory } = Astro.props
 		))
 	}
 	<Category name='Team' activeCategory={activeCategory} />
+	<Category name='Resources' activeCategory={activeCategory} />
 	<Category name='Sponsors' activeCategory={activeCategory} />
 	<Category name='Contact' activeCategory={activeCategory} />
 

src/pages/resources.astro

@@ -0,0 +1,54 @@
+---
+// src/pages/resources.astro
+import BaseLayout from '@/layouts/BaseLayout'
+import TitlePage from '@/components/TitlePage'
+import ListCategories from '@/components/ListCategories'
+---
+
+<BaseLayout title='Resources'>
+	<TitlePage title='Resources' />
+	<ListCategories activeCategory='Resources' />
+
+	<section class='w-full mx-auto py-12 px-6'>
+		<div class='text-center mb-12'>
+			<h1 class='text-3xl font-bold mb-6 text-center text-gray-900 dark:text-white'>
+				Club Resources
+			</h1>
+			<p class='text-lg text-gray-700 dark:text-gray-300 max-w-3xl mx-auto'>
+				Important links and Resources
+			</p>
+		</div>
+
+		<div class='space-y-8'>
+			<div class='bg-white dark:bg-gray-800 rounded-lg shadow-lg py-8 px-4'>
+				<h2 class='text-2xl font-bold text-gray-900 dark:text-white mb-4'>Club Calendar</h2>
+				<p class='text-gray-700 dark:text-gray-300 mb-6'>
+					Stay up to date with all of our events and meetings.
+				</p>
+				<div class='overflow-hidden rounded-lg' style='height: 600px;'>
+					<iframe
+						src='https://calendar.google.com/calendar/embed?src=d91af461b7cf05ce6347a40dc78fdd4706b84851703001e7eb4b94edab3ad3dd%40group.calendar.google.com&ctz=America%2FNew_York'
+						class='w-full h-full'
+						style='border:0;'
+						allowfullscreen=''
+						loading='lazy'></iframe>
+				</div>
+			</div>
+
+			<div class='bg-white dark:bg-gray-800 rounded-lg shadow-lg p-8'>
+				<h2 class='text-2xl font-bold text-gray-900 dark:text-white mb-4'>Home Base</h2>
+				<p class='text-gray-700 dark:text-gray-300 mb-6'>
+					Our central hub for club documentation and information.
+				</p>
+				<a
+					href='https://docs.google.com/document/d/1TbfClrviDALciLvk9RxojEf-cL-4sz4fVm39jnFb3g8/edit?usp=sharing'
+					target='_blank'
+					rel='noopener noreferrer'
+					class='inline-block bg-gray-800 hover:bg-gray-900 dark:bg-gray-700 dark:hover:bg-gray-600 text-white font-semibold py-3 px-6 rounded-lg transition-colors duration-300'
+				>
+					Open Google Doc
+				</a>
+			</div>
+		</div>
+	</section>
+</BaseLayout>