Addind vuespress to project

docs/README.md

+<div class="row">
+  <div class="col">
+    <h2>Before you start</h2>
+    <hr>
+    <p>Please read the following pages:</p>
+    <ul>
+      <li><a href="https://competition.igem.org/deliverables/team-wiki" target="_blank">Wiki Requirements page</a></li>
+      <li><a href="https://competition.igem.org/judging/pages-for-awards" target="_blank">Standard URL Pages for Awards</a></li>
+    </ul>
+  </div>
+</div>
+<div class="row mt-4">
+  <div class="col">
+    <h2>Styling your wiki</h2>
+    <hr>
+    <p>Feel free to customize the page styling according to your preferences, or you can simply leave the style as it is. It's wise to focus on a clear content first, and on a clean design later.</p>
+    <p>Be cautious with the size of the assets like images, videos, and more, that you put in your wiki. Large file sizes can hinder the presentation of wikis due to slow internet connections. Remember to compress large files before uploading them to iGEM servers.</p>
+    <p>This default wiki meets the requirements, enhances navigability, and provides a user-friendly experience for visitors. You should not feel obligated to go beyond the provided styling.</p>
+  </div>
+</div>
+<div class="row mt-4">
+  <div class="col-lg-8">
+    <h2>Tips</h2>
+    <hr>
+    <p>This wiki will be your team's first interaction with the rest of the world, so here are a few tips to help you get started:</p>
+    <ul>
+      <li>State your accomplishments! Tell people what you have achieved from the start.</li>
+      <li>Be clear about what you are doing and how you plan to do this.</li>
+      <li>You have a global audience! Consider the different backgrounds that your users come from.</li>
+      <li>Make sure information is easy to find; nothing should be more than 3 clicks away.</li>
+      <li>Avoid using very small fonts and low contrast colors; information should be easy to read.</li>
+      <li>Start documenting your project as early as possible; don't leave anything to the last minute before the Wiki Freeze. For a complete list of deadlines visit the <a href="https://competition.igem.org/calendar" target="_blank">iGEM Competition calendar</a></li>
+      <li>Have lots of fun!</li>
+    </ul>
+  </div>
+  <div class="col-lg-4">
+    <h2>Inspiration</h2>
+    <hr>
+    <p>You can also view other previous years team wikis for inspiration! Here are some examples: </p>
+    <ul>
+      <li><a href="https://2022.igem.wiki/dtu-denmark">2022 DTU-Denmark</a></li>
+      <li><a href="https://2022.igem.wiki/virginia">2022 Virginia</a></li>
+      <li><a href="https://2022.igem.wiki/crete">2022 Crete</a></li>
+      <li><a href="https://2022.igem.wiki/estonia-tuit">2022 Estonia_TUIT</a></li>
+      <li><a href="https://2022.igem.wiki/ashesighana">2022 AshesiGhana</a></li>
+      <li><a href="https://2021.igem.org/Team:SDU-Denmark">2021 SDU-Denmark</a></li>
+      <li><a href="https://2020.igem.org/Team:XMU-China">2020 XMU China </a></li>
+      <li><a href="https://2020.igem.org/Team:TAS_Taipei">2020 TAS Taipei </a></li>
+    </ul>
+  </div>
+</div>

docs/description.md

+# Team Section
+
+  <div class="container text-center py-5">
+    <h3>Building Team</h3>
+    <h4 class="text-muted">Lorem ipsum dolor sit amet consectetur adipisicing elit. Cumque, explicabo.</h4>
+    <div class="row row-cols-1 row-cols-md-3 g-4 py-5">
+      <div class="col">
+        <team
+          imageSrc="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+          altText="User 1"
+          name="Leanne Graham"
+          description="Lorem ipsum dolor sit amet consectetur, adipisicing elit. Blanditiis, neque."
+        />
+      </div>
+      <div class="col">
+        <team
+          imageSrc="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+          altText="User 2"
+          name="Leanne Graham"
+          description="Lorem ipsum dolor sit amet consectetur, adipisicing elit. Blanditiis, neque."
+        />
+      </div>
+      <div class="col">
+        <team
+          imageSrc="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+          altText="User 3"
+          name="Leanne Graham"
+          description="Lorem ipsum dolor sit amet consectetur, adipisicing elit. Blanditiis, neque."
+        />
+      </div>
+    </div>
+  </div>

docs/team.md

+---
+title: Our Team
+description: Meet the minds behind Natronaut
+---
+
+# Our Team
+**Hey everyone**
+<style>
+.team-container {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  gap: 20px; /* Adjust spacing between cards */
+}
+.card {
+  flex: 1 1 300px; /* Allows each card to grow and shrink, but has a base width of 300px */
+  max-width: 300px; /* Ensures cards do not grow larger than 300px */
+}
+@media (max-width: 1200px) {
+  .card {
+    flex: 1 1 300px; /* Adjust base width for medium screens */
+  }
+}
+@media (max-width: 768px) {
+  .card {
+    flex: 1 1 100%; /* Full-width cards for small screens */
+  }
+}
+</style>
+
+<div class="team-container">
+  <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Management, Finance, Wet & Dry Lab"
+    nationality="Indian"
+    email="devyaniravi2003@gmail.com"
+  />
+  <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+   <TeamCard
+    profileImage="https://gitlab.igem.org/2024/msp-maastricht/-/raw/main/wiki/images_project_description/profile_images/profile_image_Devyani.png?ref_type=heads"
+    name="Devyani Ravi"
+    role="Role"
+  />
+  <!-- Add more TeamCard components as needed -->
+</div>

gitlab-ci.yml

+image: node:20.8.0
+
+stages:
+  - build
+
+cache:
+  paths:
+    - node_modules/
+
+pages:
+  stage: build
+  script:
+    - npm install
+    - npm run docs:build
+  artifacts:
+    paths:
+      - public
+    expire_in: 1 day
+  only:
+    - master

package.json

+{
+  "name": "vuepress-starter",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "docs:dev": "vuepress dev docs",
+    "docs:build": "vuepress build docs"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "@vuepress/bundler-vite": "2.0.0-rc.14",
+    "@vuepress/plugin-register-components": "2.0.0-rc.37",
+    "@vuepress/theme-default": "2.0.0-rc.40",
+    "vue": "^3.4.37",
+    "vuepress": "2.0.0-rc.14"
+  }
+}