Merge pull request #10 from SatyaRajAwasth1/footer-component

Add definition for footer component & refactorings #3

config.yml

@@ -29,6 +29,16 @@ menu:
     - title: Contact Us
       link: /contact
 
+footer:
+  tagline: Open Alumn Portal - An alumni portal connecting NCIT Alumns maintained by NOSK and contributors.
+  items:
+  - title: About
+    link: #
+  - title: GitHub
+    link: https://github.com/noskofficial/ncitalums
+  - title: Contribute Now
+    link: https://github.com/noskofficial/ncitalums/blob/develop/CONTRIBUTING.md
+
 featured:
   profiles: 
   -  "2005/nitesh-rijal"

src/components/homepage/HeroSection.astro

@@ -1,6 +1,10 @@
-<section class=" w-full flex-col justify-start items-center bg-gray-900 text-white">
+---
+
+---
+
+<section class="w-full flex-col justify-start items-center bg-gray-900 text-white">
   <div class="text-center mb-20">
-    <h1 class="text-4xl md:text-6xl font-bold mt-40 mb-6">
+    <h1 class="text-4xl md:text-6xl font-bold mt-40 mb-6 mx-4 sm:mx-8">
       Stay Connected, Build Networks
     </h1>
     <p class="text-lg md:text-2xl mb-16">

src/components/shared/Footer.astro

@@ -0,0 +1,24 @@
+---
+import { loadConfig } from '../../utils/loadconfig';
+
+const config = loadConfig();
+const footer = config.footer;
+---
+
+<footer class="bg-gray-800 text-white py-6">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="flex flex-col md:flex-row justify-between items-center">
+        <div class="mb-4 md:mb-0">
+          <p class="text-center md:text-left"> {footer.tagline} </p>
+        </div>
+        <div class="flex space-x-4">
+          {footer.items.map(item => (
+            <a href={item.link} class="text-gray-400 hover:text-white text-sm">
+              {item.title}
+            </a>
+          ))}
+        </div>
+      </div>
+    </div>
+  </footer>
+

src/utils/loadconfig.ts

@@ -6,13 +6,19 @@ import { getCollection } from 'astro:content';
 export interface Root {
   menu: Menu
   featured: FeaturedDetails
+  footer: Footer
 }
 
 export interface Menu {
   title: string
   main: Main[]
 }
 
+interface Footer {
+  tagline: string
+  items: Main[]
+}
+
 export interface Main {
   title: string
   link?: string