Merge branch 'main' of ssh://gitlab.igem.org/2024/bielefeld-cebitec

src/App/mediarules.css

@@ -94,6 +94,15 @@
       height: auto; 
     }
 
+    /***Description***/
+    #Cystic\ Fibrosis6 h2 {
+        font-size: 1.5em !important; /* Mobile size */
+      }
+      .pie-chart-container-small {
+        width: 300px; /* Make smaller for mobile */
+        height: 300px; /* Adjust height accordingly */
+      }  
+
     .row-if-small{
         --bs-gutter-x: 1.5rem;
         --bs-gutter-y: 0;
@@ -252,6 +261,13 @@ body {
 
 }
 
+/***description***/
+.pie-chart-container {
+  width: 600px;  /* Set the width of the container */
+  height: 600px; /* Set the height of the container */
+  position: relative;
+  margin: 0 auto; /* Center the chart */
+}
 
 @media screen and (max-width: 1300px){
     .one-pdf-line{

src/components/Graph.tsx

@@ -56,11 +56,16 @@ const PieChart: React.FC = () => {
     responsive: true,
     maintainAspectRatio: false,
     plugins: {
-      title: {
+      legend: {
         display: true,
-        text: '',
+        position: 'bottom' as const, // Puts labels below the chart
+        labels: {
+          boxWidth: 20, // Controls the size of the color box next to the labels
+          padding: 15,   // Adds some padding between labels and the chart
+          usePointStyle: true, 
       },
-    }
+    },
+   },
   };
 
   return (

src/contents/Human Practices/Further Engagement/Collaborations.tsx

@@ -24,7 +24,12 @@ export function HPCollabs(){
             </div>
             <div id="colls2024" className="coll-cycletab" style={{display: "none"}}>
                 <H4 id="colls2024-heading" text="Collaboration with Lingköping"/>
-                <LoremMedium/>
+                <H4 text="Home University of Linköping"/>
+                <p>The University of Linköping is one of the bigger universities located in Sweden. Since its inception in 1975, it has become a very innovative and highly renowned institution.  </p>
+                <p>The project of Linköpings iGEM 2024 team: (description taken from their website)</p>
+                <p>“The product composition will depend on the enzyme missing or malfunctioning in each of the disease types. We’re going to target autosomal recessive congenital ichthyosis, as this is the one our friend is struggling with. We will focus on the consequences of mutations in three different genes (TGM1, ALOXE3, ALOX12B) that can underlie this condition [5]. However, if our approach turns out to be successful, after some adjustments, the protocol could be applied for the remaining types of the disease as well. First of all, we’ll engineer E. coli to produce the chosen enzymes encoded by the corresponding genes we chose: transglutaminase 1, Epidermis-type lipoxygenase 3, Arachidonate 12-lipoxygenase and then we will purify them from the bacteria. Once this system is established and optimized, we’ll proceed to design a functioning delivery system that we will encapsulate the enzymes in. We have decided to produce modulated liposomes that will be able to keep the enzymes active while transporting them. Once the target skin layer is reached, the liposomes will fuse with the membranes of the cells of interest, delivering the product to its final destination. Functioning liposomes packed with the produced enzymes will then be incorporated into a suitable medium to facilitate the topical application for the patients”. </p>
+                <H4 text="iGEM team Liu project our idea"/>
+                <p>We first made contact with the team of LIU via email, due to both our teams’ interest in working with LNP based delivery systems. It rapidly became apparent that our two teams could benefit from a corporation especially since the team of LiU was working on an LNP handbook at the time.</p>
             </div>
             <div id="Handbook" className="coll-cycletab" style={{display: "none"}}>
                 <H4 id="Handbook-heading" text=""/>