Added technologies, other approach for image loading

src/pages/about.astro

@@ -2,23 +2,36 @@
 import Layout from '../layouts/Layout.astro';
 import BasicSection from '../layouts/basicSection.astro';
 
-import Navbar from '../components/navbar.astro';
-import NavbarEntry from '../components/navbarEntry.astro';
-import navdata from '../../static/_navdata.json'
-
 import ContactSection from '../layouts/contactSection.astro';
 import ContactCard from '../components/contactCard.astro';
 import contactdata from '../../static/_contactdata.json'
+
+import CustomFooter from '../layouts/customFooter.astro';
+import TechnologyCard from '../components/technologyCard.astro';
+
+const techologydata = [{
+		"title": "Astro",
+		"link": "https://astro.build",
+		"image": "astro"
+	},
+	{
+		"title": "GitLab",
+		"link": "https://gitlab.io",
+		"image": "gitlab"
+	},]
 ---
 
 <Layout title="About - Firq FGO Site" currentpage="about">
     <BasicSection title="About">
-        This is a small sideproject that I'm creating. It uses Astro for developing and Gitlab for providing the site.
+        This is a small sideproject that I'm creating.
+    </BasicSection>
+    <BasicSection title="Technologies used">
+        {techologydata.map((item) => (<TechnologyCard {...item}/>))}
     </BasicSection>
     <ContactSection title="Contact me">
 		{contactdata.map((item) => (<ContactCard {...item}/>))}
 	</ContactSection>
-    
+    <CustomFooter />
 </Layout>
 
 <style>

src/pages/servants.astro

@@ -1,7 +1,6 @@
 ---
 import Layout from '../layouts/Layout.astro';
 import BaseSection from '../layouts/baseSection.astro';
-import CustomFooter from '../layouts/customFooter.astro';
 
 import ServantCard from '../components/servantCard.astro';
 import servantdata from '../../static/_servantdata.json'
@@ -18,7 +17,6 @@ import cedata from '../../static/_cedata.json'
 	<BaseSection title="CE Offering">
 		{cedata.map((item) => (<CeCard {...item}/>))}
 	</BaseSection>
-	<CustomFooter />
 </Layout>
 
 <style>

src/pages/ta-collection.astro

@@ -1,6 +1,5 @@
 ---
 import Layout from '../layouts/Layout.astro';
-import CustomFooter from '../layouts/customFooter.astro';
 
 import TaSection from '../layouts/taSection.astro';
 import TaCard from '../components/taCard.astro';
@@ -12,7 +11,6 @@ import tadata from '../../static/_tadata.json'
     <TaSection title="Completed TAs">
 		{tadata.map((item) => (<TaCard {...item}/>))}
 	</TaSection>
-    <CustomFooter />
 </Layout>
 
 <style>