adding sponsors page

docs/.vuepress/components/SponsorCard.vue

+<template>
+  <div class="sponsor-card">
+    <h4>{{ title }}</h4>
+    <p>{{ description }}</p>
+    <a v-if="link" :href="link" target="_blank">Learn More</a>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    title: {
+      type: String,
+      required: true
+    },
+    description: {
+      type: String,
+      required: true
+    },
+    link: {
+      type: String,
+      default: null
+    }
+  }
+};
+</script>
+
+<style scoped>
+.sponsor-card {
+  background-color: #f0f0f0;
+  border-radius: 10px;
+  padding: 20px;
+  margin: 10px 0;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+
+.sponsor-card a {
+  display: inline-block;
+  margin-top: 10px;
+  color: #007BFF;
+  text-decoration: none;
+}
+
+.sponsor-card a:hover {
+  text-decoration: underline;
+}
+</style>

docs/.vuepress/components/Sponsors.vue

+<template>
+  <div class="sponsors-container">
+    <h2>Our Sponsors</h2>
+
+    <!-- Financial Grants Section -->
+    <div class="financial-grants-section">
+      <h3>Financial Grants</h3>
+      <SponsorCard
+        title="Maastricht University Financial Support"
+        description="Maastricht University has provided substantial financial support, allowing us to secure laboratory space and essential resources to advance our project."
+      />
+      <SponsorCard
+        title="MaCSBio"
+        description="MaCSBio, Maastricht University's Centre for Systems Biology, has backed our project with research funding and expert guidance in bioinformatics and computational biology."
+      />
+      <SponsorCard
+        title="SWOL - Universiteitsfonds Limburg"
+        description="The SWOL Universiteitsfonds Limburg has supported us with financial grants to fuel our innovative research and advance our sustainability-focused project goals."
+      />
+    </div>
+
+    <!-- Regular Sponsors Section -->
+    <div class="sponsors-section">
+      <SponsorCard
+        title="IDT"
+        description="Integrated DNA Technologies (IDT) has provided essential gene synthesis and sequencing services to help execute our genetic designs with precision."
+      />
+      <SponsorCard
+        title="Ascenscia"
+        description="Ascenscia Diabetes Care, a global company advancing solutions for diabetes, has been pivotal in funding key aspects of our research resources."
+        link="https://www.notion.so/Ascenscia-cebb3a0c25f2417a87e7b6745a3ae6fd?pvs=21"
+      />
+      <SponsorCard
+        title="NEB"
+        description="New England Biolabs (NEB) has supported our molecular biology work by supplying crucial enzymes and reagents."
+        link="https://www.notion.so/NEB-586c5b7314ba48aeba79d9f1b25f2c62?pvs=21"
+      />
+      <SponsorCard
+        title="Canva"
+        description="Canva’s design tools have allowed us to create stunning visuals for promoting our project and engaging our community."
+        link="https://www.notion.so/Canva-924b1c017cee4aae83b2fe1f4916a3b6?pvs=21"
+      />
+      <SponsorCard
+        title="SnapGene"
+        description="SnapGene’s software has been instrumental in designing, visualizing, and documenting our genetic constructs."
+        link="https://www.notion.so/Snapgene-39bd3adb61a143e1ae32692878606790?pvs=21"
+      />
+      <SponsorCard
+        title="eLabNext"
+        description="eLabNext’s laboratory software has supported our team by streamlining our research workflows and data management."
+        link="https://www.notion.so/eLab-Next-ed489704ac2748e8ae88319ed60540c7?pvs=21"
+      />
+
+      <h3>Grants</h3>
+      <SponsorCard
+        title="Promega Grant"
+        description="The Promega Grant has helped us acquire critical reagents and laboratory tools, driving the success of our experiments."
+        link="https://www.notion.so/Promega-Grant-4cd7eb46713644f8827b00e1fcf0b480?pvs=21"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import SponsorCard from './SponsorCard.vue';
+
+export default {
+  components: {
+    SponsorCard
+  }
+};
+</script>
+
+<style scoped>
+.sponsors-container {
+  padding: 20px;
+}
+
+.financial-grants-section, .sponsors-section {
+  margin-top: 30px;
+}
+
+h3 {
+  margin-bottom: 15px;
+}
+
+</style>

docs/.vuepress/config.js

@@ -31,7 +31,7 @@ export default defineUserConfig({
           { text: 'Description', link: '/description' },
           { text: 'Engineering', link: '/engineering/'},
           { text: 'Experiments', link: '/experiments/'},
-          { text: 'Notebook', link: '/notebook/'},
+          { text: 'Sponsors', link: '/sponsors'},
           { text: 'Results', link: '/results/'}
         ]
       },

docs/.vuepress/layouts/SponsorsLayout.vue

+<template>
+  <Layout>
+    <!-- This is the standard layout content, including header, sidebar, etc. -->
+    <div class="content">
+      <Sponsors /> <!-- Insert your Sponsors component -->
+    </div>
+  </Layout>
+</template>
+
+<script>
+import Sponsors from '@/components/Sponsors.vue'; // Import your Sponsors.vue component
+
+export default {
+  components: {
+    Sponsors,
+  }
+};
+</script>
+
+<style scoped>
+.content {
+  margin: 0 auto;
+  max-width: 900px;
+  padding: 20px;
+}
+</style>

docs/sponsors.md

+---
+title: Our Sponsors
+layout: SponsorsLayout
+---
+
+# Our Sponsors
+
+Thank you to our generous sponsors for supporting our iGEM journey.