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

src/App/mediarules.css

@@ -136,6 +136,11 @@
    #breatht  {
     font-size: 1.5em !important; /* Adjust font size for smaller screens */
     text-align: left; /* Optional: center text for mobile */
+  }
+   #breathf {
+    left: 40vw !important;
+    width: 65vw !important;
+
   }
     /***Biosafty***/
     #safehead {

src/components/Breathe.tsx

@@ -94,7 +94,7 @@ export function Breathe(){
                             'opacity': `${isVisible ? '1' : '0'}`,
                             'visibility': `${isVisible ? 'visible' : 'hidden'}`
                         }}
-                        src="https://static.igem.wiki/teams/5247/landing/breath/textless/breath-only-1.webp">
+                        id="breathf" src="https://static.igem.wiki/teams/5247/landing/breath/textless/breath-only-1.webp">
                     </img>
                     {/* Spacing Block */}
                     <div className='col' style={{ 'height': '100vh' }}></div>
@@ -111,7 +111,7 @@ export function Breathe(){
                             'scale': `${isVisible2 ? '1' : '0'}`,
                             'visibility': `${isVisible2 ? 'visible' : 'hidden'}`
                         }}
-                        src="https://static.igem.wiki/teams/5247/landing/breath/circles/purplecircle.webp"></img>
+                        id="breathf" src="https://static.igem.wiki/teams/5247/landing/breath/circles/purplecircle.webp"></img>
                     </div>
                     {/* Spacing Block */}
                     <div className='col' style={{ 'height': '95vh' }}></div>
@@ -128,7 +128,7 @@ export function Breathe(){
                             'scale': `${isVisible3 ? '0' : '1'}`,
                             'visibility': `${isVisible3 ? 'visible' : 'hidden'}`
                         }}
-                        src="https://static.igem.wiki/teams/5247/landing/breath/circles/purplecircle.webp"></img>
+                        id="breathf"src="https://static.igem.wiki/teams/5247/landing/breath/circles/purplecircle.webp"></img>
                     </div>
                     {/* Spacing Block */}
                     <div className='col' style={{ 'height': '100vh' }}></div>
@@ -150,7 +150,7 @@ export function Breathe(){
                             'scale': `${isVisible4 ? '1' : '0'}`,
                             'visibility': `${isVisible4 ? 'visible' : 'hidden'}`
                         }}
-                        src="https://static.igem.wiki/teams/5247/landing/breath/circles/purplecircle.webp"></img>
+                        id="breathf"src="https://static.igem.wiki/teams/5247/landing/breath/circles/purplecircle.webp"></img>
                     </div>
             </div>
             {/* black */}
@@ -168,7 +168,7 @@ export function Breathe(){
                             'opacity': `${isVisible5 ? '1' : '0'}`,
                             'visibility': `${isVisible5 ? 'visible' : 'hidden'}`
                         }}
-                        src="https://static.igem.wiki/teams/5247/landing/breath/textless/breath-only-2.webp">
+                        id="breathf"src="https://static.igem.wiki/teams/5247/landing/breath/textless/breath-only-2.webp">
                     </img>
                     <div style={{ 'height': '100vh'}}  ref={domRef6}>
                         <img style={{
@@ -179,7 +179,7 @@ export function Breathe(){
                             'height': '60vh',
                             'visibility': `${isVisible6 ? 'visible' : 'hidden'}`
                         }}
-                        src="https://static.igem.wiki/teams/5247/landing/breath/circles/darkerpurplecircle.webp"></img>
+                        id="breathf"src="https://static.igem.wiki/teams/5247/landing/breath/circles/darkerpurplecircle.webp"></img>
                     </div>
                     <p id="breatht"style={{'fontSize' : '2.5em'}}>Breathing is  </p>
                     <p id="breatht"style={{'fontSize' : '2.5em'}}>essential.</p>
@@ -196,7 +196,7 @@ export function Breathe(){
                             'scale': `${isVisible7 ? '1' : '0'}`,
                             'visibility': `${isVisible7 ? 'visible' : 'hidden'}`
                         }}
-                        src="https://static.igem.wiki/teams/5247/landing/breath/circles/fullblackcircle.webp"></img>
+                        id="breathf"src="https://static.igem.wiki/teams/5247/landing/breath/circles/fullblackcircle.webp"></img>
                     </div>
                     {/* Spacing Block */}
                     <div className='col' style={{ 'height': '100vh' }}></div>
@@ -219,7 +219,7 @@ export function Breathe(){
                             'opacity': `${isVisible8 ? '1' : '0'}`,
                             'visibility': `${isVisible8 ? 'visible' : 'hidden'}`
                         }}
-                        src="https://static.igem.wiki/teams/5247/landing/breath/textless/breath-only-3.webp">
+                        id="breathf" src="https://static.igem.wiki/teams/5247/landing/breath/textless/breath-only-3.webp">
                     </img>
                 </div>
                 <p id="breatht"style={{'fontSize' : '2.5em'}}>To help restore the ability </p>

src/components/Tabs.tsx

@@ -279,7 +279,7 @@ import { stringToSlug } from "../utils";
                       <p>{data[i].summary}</p>
                       </div>
                       <div className="row unten" style={{fontSize: "large"}}>
-                       See how this influenced our project at 
+                       
                       </div>
                     </div>
                     <div className="col-3">

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

 import { ButtonOne } from "../../../components/Buttons";
-import { H4 } from "../../../components/Headings";
-import { LoremMedium } from "../../../components/Loremipsum";
+import { H5, H4 } from "../../../components/Headings";
 import { PDF } from "../../../components/Pdfs";
+import { useNavigation } from "../../../utils";  
 
-export function HPCollabs(){
 
+export function HPCollabs(){
+    const {goToPagesAndOpenTab} = useNavigation(); 
     return (
         <div className="col">
             <div className="row align-items-center" style={{marginTop: "5vh", marginBottom: "5vh"}}>
@@ -18,11 +19,7 @@ export function HPCollabs(){
                     <ButtonOne openclass="coll-cycletab" text="LNP Handbook" open="Handbook"></ButtonOne>
                 </div>
             </div>
-            
-            <div id="coll-overview" className="coll-cycletab" style={{display: "block"}}>
-                <H4 id="coll-overview-heading" text=""/>
-                <LoremMedium/>
-            </div>
+    
             <div id="colls2024" className="coll-cycletab" style={{display: "none"}}>
                 <H4 id="colls2024-heading" text="Collaboration with Lingköping"/>
                 <H4 text="Home University of Linköping"/>
@@ -36,6 +33,39 @@ export function HPCollabs(){
                 <H4 id="Handbook-heading" text="Hanbook for download"/>
                 <PDF link="https://static.igem.wiki/teams/5247/pdfs/liposomes-handbook.pdf" name="liposomes-handbook.pdf"/>
             </div>
+
+            <div id="ent-overview" className="ent-interview" style={{display: "block"}}>
+            <H4 id="ent-heading" text="Collaborations as part of a integrated human practice - but why?"/>
+            <p>Entrepreneurship is not only an interesting possibility but necessary to turn our ideas and results into a real product that can help people. </p>
+            <p>That is why in this section we focus on the aspects of entrepreneurship that are crucial for the potential successful realisation of our project to develop new therapies for cystic fibrosis. A pivotal moment was our interview with Nicole Friedlein, which gave us valuable insights into the challenges and opportunities in the field of biomedical innovation. The discussions in the interview encouraged us to look more closely at the regulatory requirements, which is why one team member completed a GxP course and subsequently trained the team in this area. In addition, we conducted further interviews in the area of entrepreneurship to gain a better understanding of the practical aspects of business development. These experiences not only enriched the scientific depth of our project, but also sharpened our perspective on the practical implementation and market launch of new therapies. 
+            </p>
+            </div>
+
+
+            <H5 text="Biosafety and Security"/>
+                    <p>Early in our project, we faced challenges working with human biomaterials, particularly cultivating primary human nasal epithelial cells from both CF patients and controls. To address these, we made three key contributions:</p>
+                    <ol>
+                        <li>A guideline for handling biomaterials in compliance with BSL2 standards.[Link guideline]</li>
+                        <li>A clinical trial-style questionnaire to assess donor medical history.[Link Link questionaire]</li>
+                        <li>A hygiene protocol to improve safety and cleanliness in research facilities.[Link hygiene protocoll]</li>
+                    </ol>
+
+                    <p>
+                    These frameworks ensure that future iGEM teams can overcome similar challenges, ensuring safety and regulatory compliance while streamlining their workflow.
+                     We contributed an extensive collection of optimized protocols for future iGEM teams, integrating our experiences to make synthetic biology more accessible. By embedding safety standards, we enable teams to confidently work with human biomaterials, ensuring regulatory compliance and efficient progress.
+                    </p>
+            <H5 text="PreCL Reporter System "/>
+                <p>To test Prime Editing systems targeting the CF-specific delF508 mutation, we developed the PreCL reporter system [Link engineering of PreCL], which offers high sensitivity, minimal noise, and precise fluorescence detection. This versatile tool, adaptable for CRISPR and base editing, enhances the precision of genetic research, particularly in CF studies. 
+                    We optimized pegRNA design[linkpegrna] by incorporating the TevoPreQ1 RNA motif, improving stability and Prime Editing efficiency. Our innovations, including silent edits and fine-tuned sequences, boost editing accuracy, providing a robust tool for genetic research. </p>
+            <H5 text="Prime Editing Technology PrimeGuide & Lipid Nanoparticle System AirBuddy "/>
+                <p>Our PrimeGuide[link] system introduces a novel eukaryotic RNA-binding DNA-nickase, a smaller alternative to Cas9. Enhanced with a more efficient Reverse Transcriptase and optimized RNA-binding proteins, this advancement improves Prime Editing accuracy and safety for genetic mutation correction. 
+                We developed AirBuddy[link], a lung-specific RNA/DNA delivery system optimized for gene therapies targeting lung diseases. With low cytotoxicity, efficient cellular uptake, and cost-effective storage, AirBuddy revolutionizes lung disease treatments by providing a safer and more effective delivery method.  </p>
+            <H5 text="Wiki Development"/>
+                <p>To support future iGEM teams, we developed troubleshooting guides for HTML and CSS[link], making wiki development more accessible and easier to manage. 
+                Through these contributions, we provide valuable tools and frameworks to advance synthetic biology, ensuring safer, more efficient research and therapeutic development for the iGEM community. </p>
+            <H5 text="Global Impact and Inclusivity "/>
+                <p>Recognizing the disparities in CF care across different regions, particularly in underrepresented areas like Asia, we adjusted our approach to create a more inclusive therapy. With feedback from stakeholders like <a onClick={() => goToPagesAndOpenTab('joshua', '')}>Joshua Bauder</a> from CF Vest International and <a onClick={() => goToPagesAndOpenTab('sriram', '/human-practices')}>Dr. Sriram Vaidyanathan</a>, we ensured our therapy addressed a wider range of CF mutations. This global focus led to bilingual surveys and expanded outreach efforts to raise awareness about CF and gene therapy. </p>
+            
         </div>
     )
 }
\ No newline at end of file

src/contents/methods.tsx

@@ -91,12 +91,12 @@ export function Methods() {
             <p>In addition to assessing immediate cytotoxicity, we also evaluated the long-term safety of the LNPs by conducting a proliferation assay. This assay tracked cell division and growth over time to determine whether the LNPs impacted cellular function. Our results showed that LNP-treated cells had similar growth rates to untreated controls, indicating that the LNPs do not interfere with normal cell processes. This further confirms their biocompatibility and suitability for use in biological systems.</p>
           </Subesction>
           <Subesction title="Flow cytometry" id="flow cytometry">
-            <p>To assess the transfection efficiency of our LNPs, we used flow cytometry. This method involved tagging the LNPs with fluorescent markers and measuring their ability to deliver genetic material into target cells. The flow cytometry provided quantitative insights into how effectively the LNPs transfected cells, helping us optimize their design for gene therapy applications. </p>
+            <p>To assess the transfection efficiency of our LNPs, we used flow cytometry. This method involved tagging the LNPs with fluorescent markers and measuring their ability to deliver genetic material into target cells. The flow cytometry results provided quantitative insights into how effectively the LNPs transfected cells, helping us optimize their design for gene therapy applications. </p>
           </Subesction>
 
           <Subesction title="In-Depth Characterization of LNPs" id="In-Depth Characterization of LNPs">
             <H4 text="Dynamic Light Scattering (DLS) and Zeta Potential"></H4> 
-              <p>The hydrodynamic radius (𝑅𝐻) of the vesicles and LNPs was determined through angle-dependent photon correlation spectroscopy (PCS) at 𝑇=20°C. Samples were measured in NMR tubes using a 3D LS Spectrometer Pro (LS Instruments, Fribourg, Switzerland), which was equipped with a HeNe Laser (632.8 nm, 1145P; JDSU, Milpitas, CA, USA), a decaline index-matching vat, an automated goniometer, and two detectors. Measurements were performed in a 3D cross-mode to eliminate multiple scattering effects, covering a scattering angle range of 30° to 120° in increments of 10°, with a measuring time of three intervals of 120 s per angle.The autocorrelation function of the scattered light intensity was generated using a multiple-τ digital correlator and analyzed via inverse Laplace transformation (CONTIN) to determine the mean relaxation rate (Γ). From these data, the hydrodynamic radius (𝑅𝐻) was calculated using the Stokes–Einstein equation: 
+              <p>The hydrodynamic radius (𝑅𝐻) of the vesicles and LNPs was determined through angle-dependent photon correlation spectroscopy (PCS) at 𝑇=20°C. Samples were measured in NMR tubes using a 3D LS Spectrometer Pro (LS Instruments, Fribourg, Switzerland), which was equipped with a HeNe Laser (632.8 nm, 1145P; JDSU, Milpitas, CA, USA), a decaline index-matching vat, an automated goniometer, and two detectors. Measurements were performed in a 3D cross-mode to eliminate multiple scattering effects, covering a scattering angle range of 30° to 120° in increments of 10°, with a measuring time of three intervals of 120 s per angle. The autocorrelation function of the scattered light intensity was generated using a multiple-τ digital correlator and analyzed via inverse Laplace transformation (CONTIN) to determine the mean relaxation rate (Γ). From these data, the hydrodynamic radius (𝑅𝐻) was calculated using the Stokes–Einstein equation: 
                 𝑅𝐻=𝑘𝐵⋅𝑇/6𝜋𝜂𝐷𝑇 where 𝑘𝐵 is the Boltzmann constant, T is the temperature, η is the solvent viscosity, and DT
   is the translational diffusion coefficient. The value of 𝐷𝑇 was obtained from the slope of the linear relationship between the relaxation rate (Γ) and 
   the squared magnitude of the scattering vector (𝑞2) as defined by:Γ =𝐷𝑇⋅𝑞2Γ.

src/data/hptimelinedata.tsx

@@ -1126,14 +1126,37 @@ export const timelinedata: Array<TimelineDatenpunkt>  = [
     job: "Team iGEM",
     affiliation: "Bielfeld CeBiTec 2024",
     tag: "Milestone",
-    heading: "Getting Acquainted with Cystic Fibrosis",
+    heading: "Enhancing Delivery Strategies and Collaboration for Prime Editing",
     interviewtabid: "loop",
     cardtext: "",
-    quoteNachname: "Köhler, Teammember",
-    quoteVorname: "Vera",
-    quote: "Firstly, we discussed various project ideas, including the use of magnetic microswimmers for targeted medical applications, gene editing approaches for cystic fibrosis, treatments for muscular dystrophy and combating cyanobacteria with algae.",
+    quoteNachname: "Wiesner, Teammember",
+    quoteVorname: "Lisa",
+    quote: "I’m thrilled with the progress we’re making in optimizing our delivery strategies. The collaboration with industry experts has opened our eyes to new possibilities, and I believe our work will significantly impact cystic fibrosis treatment.",
     type: "meta",
-    summary: "",
+    summary: [
+            <p>
+          After successfully conducting multiple experiments, we delved deeper into delivery strategies for our Prime Editing system. Our stakeholders provided crucial feedback that helped us overcome experimental failures and improve our methodology. Marco Raduvic offered key tips for effectively utilizing lipid nanoparticles, allowing us to successfully transfect them into HEK and CFTR-specific cells. Additionally, we replicated the proof of concept established by David Liu et al. in 2019, gaining valuable insights into how a Prime Editing system should function. During this process, we identified a gap in measuring the efficiency of our Prime Editing constructs. To address this, we developed a fluorescence-based system with high selectivity, allowing us to perform precise efficiency analyses. Beyond lab work, we connected with various industry members, not only to secure sponsorships but to emphasize collaboration and exchange with leading market players. Through this network, we not only received feedback on the importance of physiological therapies but also gained insights into the insurance-related challenges associated with a fundamental disease like cystic fibrosis. This motivated us to take our project to the next level. Our collaboration with the medical faculty of our university, along with national feedback, enabled us to integrate new and advanced validation methods. In the next phase of our studies, we decided to optimize lipid nanoparticles (LNPs) to make them suitable for a novel, lung-specific delivery strategy. Additionally, we prepared to explore enzyme engineering by engaging with stakeholders experienced in nickase development and yeast experimental design, further refining our Prime Editing system.
+      </p>,
+      <ul>
+          <li>
+              <strong>Overcoming Experimental Challenges:</strong> Improved delivery strategies based on stakeholder feedback, successfully using lipid nanoparticles to transfect HEK and CFTR-specific cells.
+          </li>
+          <li>
+              <strong>Proof of Concept:</strong> Successfully replicated the Prime Editing proof of concept established by David Liu et al. (2019), gaining valuable insights into system functionality.
+          </li>
+          <li>
+              <strong>Development of Fluorescence-Based Efficiency Measurement:</strong> Created a highly selective fluorescence-based system to accurately measure the efficiency of Prime Editing constructs.
+          </li>
+          <li>
+              <strong>Industry Collaboration:</strong> Established connections with industry members for sponsorships, collaboration, and feedback on broader challenges such as insurance issues tied to cystic fibrosis treatment.
+          </li>
+          <li>
+              <strong>Optimization of LNPs for Lung-Specific Delivery:</strong> Began optimizing lipid nanoparticles for lung-specific delivery, while preparing for enzyme engineering to enhance the Prime Editing system.
+          </li>
+      </ul>
+
+
+    ],
     months: "july"
   },
   {
@@ -1448,12 +1471,34 @@ export const timelinedata: Array<TimelineDatenpunkt>  = [
     heading: "Brainstorming and selection of ideas and concepts",
     interviewtabid: "evidence",
     cardtext: "",
-    quote: "",
-    aimofcontact: "",
-    insights: "",
-    implementation: "",
+    quoteNachname: "Lenger, Teammember",
+    quoteVorname: "Malte",
+    quote: "Our collaborations have not only enhanced our technical capabilities but have also reinforced the importance of ethical standards in our research. Together, we are paving the way for innovative solutions in gene therapy.",
     type: "meta",
-    summary: "",
+    summary: [<p>
+          We have successfully developed an enzyme engineering strategy, identifying potential nickase candidates with the support of Prof. Dr. Stefan Hammer. This crucial collaboration has laid the foundation for optimizing our Prime Editing system by selecting the most effective nickase enzymes for our applications.
+          Our progress was significantly bolstered through collaboration with the Safety and Security Committee, which allowed us to implement our plans for working with primary cell cultures. Their guidance provided us with valuable feedback on establishing critical protocols, such as patient consent forms, guidelines for handling human biomaterial at BSL2 level, and hygiene concepts for sanitary facilities in institutional and industrial settings. With the invaluable input from the head of the Ethics Committee at Bielefeld University, we were able to open new doors, ensuring that our work adheres to the highest ethical and safety standards. This support enabled us to deepen our expertise in both enzyme engineering and yeast systems, further advancing our research.
+          On the technical front, we have also made strides in lipid nanoparticle (LNP) design. We completed initial characterization of our LNPs and began cooperating with other iGEM 2024 teams, aiming to revolutionize the emerging field of LNP design. This collaboration has been instrumental in refining our approach and ensuring that our technology stays at the cutting edge of gene therapy delivery.
+          Looking ahead, we are determined to maintain a stringent approach, focusing on further developments in enzyme engineering and LNP optimization. At this stage, we are also prioritizing our wiki development, aiming to effectively present our findings and progress to the broader iGEM community and beyond.
+      </p>,
+      <ul>
+          <li>
+              <strong>Enzyme Engineering Strategy Development:</strong> Developed an enzyme engineering strategy and identified potential nickase candidates in collaboration with Prof. Dr. Stefan Hammer.
+          </li>
+          <li>
+              <strong>Implementation of Primary Cell Cultures:</strong> Successfully implemented the use of primary cell cultures with the guidance of the Safety and Security Committee, including the creation of patient consent forms, BSL2 human biomaterial handling guidelines, and hygiene concepts.
+          </li>
+          <li>
+              <strong>Ethics Committee Collaboration:</strong> Worked with the head of the Ethics Committee at Bielefeld University to ensure compliance with ethical standards, opening new opportunities for advancing research.
+          </li>
+          <li>
+              <strong>Lipid Nanoparticle (LNP) Characterization:</strong> Completed initial characterization of LNPs and collaborated with other iGEM 2024 teams to innovate in LNP design.
+          </li>
+          <li>
+              <strong>Wiki Development Focus:</strong> Shifted focus towards developing the project wiki to document and share progress with the iGEM community.
+          </li>
+      </ul>
+      ],
     months: "august"
   },
   {
@@ -1644,16 +1689,33 @@ export const timelinedata: Array<TimelineDatenpunkt>  = [
     job: "Team iGEM",
     affiliation: "Bielfeld CeBiTec 2024",
     tag: "Milestone",
-    heading: "Brainstorming and selection of ideas and concepts",
+    heading: "Building Connections: The Power of Collaboration and Communication",
     interviewtabid: "connect",
     cardtext: "",
-    quote: "",
-    aimofcontact: "",
-    insights: "",
-    implementation: "",
+    quote: "Sharing our project updates and ideas with a diverse audience has been enlightening. The feedback we receive drives our innovation and reinforces the value of collaboration in tackling the challenges of cystic fibrosis.",
+    quoteNachname: "Susat, Teammember",
+    quoteVorname: "Kathleen",
     type: "meta",
-    summary: "",
-    months: "august"
+    summary: [<p>During our project journey, we made a concerted effort to connect and share insights with a wide array of individuals, leveraging social media and university networks. Engaging with peers, faculty, and industry professionals not only enriched our understanding but also fostered a collaborative spirit. Through platforms like LinkedIn and university forums, we initiated discussions that brought fresh perspectives on gene therapy and cystic fibrosis.
+    Our social media outreach allowed us to share our findings and progress with a broader audience, promoting awareness and sparking interest in our work. We actively participated in online discussions and webinars, exchanging ideas and feedback with experts from various fields. This exchange of knowledge has proven invaluable, guiding us in refining our methodologies and enhancing our project’s impact.
+    We also engaged with different community organizations and advocacy groups, which helped us grasp the societal implications of our research. Through these connections, we garnered support for our initiatives and increased visibility for our cause. This collaborative approach not only strengthened our project but also highlighted the importance of community involvement in scientific research.
+      </p>,
+
+      <ul>
+          <li>
+              <strong>Community Engagement:</strong> Connected with community organizations and advocacy groups to understand the societal implications of our research and garner support.
+          </li>
+          <li>
+              <strong>Social Media Outreach:</strong> Utilized platforms like LinkedIn to share progress and findings, promoting awareness of cystic fibrosis and gene therapy.
+          </li>
+          <li>
+              <strong>Collaborative Discussions:</strong> Engaged in discussions with peers, faculty, and industry professionals, exchanging insights and refining methodologies.
+          </li>
+          <li>
+              <strong>Broader Perspectives:</strong> Leveraged diverse interactions to gain new perspectives that enhanced the project's impact and direction.
+          </li>
+      </ul>],
+    months: "September"
   },
   {
     title: "",