From 4f911cd5b730d4bb7981daf67854afca0a118b0c Mon Sep 17 00:00:00 2001
From: Philip Mundt <philip.mundt@uni-bielefeld.de>
Date: Tue, 12 Nov 2024 12:33:18 +0100
Subject: [PATCH] fixed some images in engineering
---
src/App/App.css | 16 ++++++++++++++++
src/contents/engineering.tsx | 18 +++++++++++++-----
2 files changed, 29 insertions(+), 5 deletions(-)
diff --git a/src/App/App.css b/src/App/App.css
index 8953f896..039e15e1 100644
--- a/src/App/App.css
+++ b/src/App/App.css
@@ -4153,6 +4153,22 @@ figure img{
object-fit: cover; /* Ensure the image covers the available space */
}
+.pegrnabox {
+ display: flex;
+ flex-direction: column; /* Stack image and any content vertically */
+ justify-content: flex-start; /* Align images at the top */
+ align-items: center; /* Center images horizontally */
+ width: auto; /* Set a width for the boxes */
+ height: auto; /* Allow height to adapt based on content */
+ padding: 10px;
+}
+
+.pegrnabox img {
+ width: 100%; /* Image takes up full width of its container */
+ height: auto; /* Maintain aspect ratio of the image */
+ object-fit: cover; /* Ensure the image covers the available space */
+}
+
.timelinetab{
border-radius: 20px;
padding: 20px;
diff --git a/src/contents/engineering.tsx b/src/contents/engineering.tsx
index ff090de3..23147a43 100644
--- a/src/contents/engineering.tsx
+++ b/src/contents/engineering.tsx
@@ -86,7 +86,7 @@ export function Engineering() {
</figure>
<H4 text="Test" id="test-head"/>
<p>
- When trying to find protospacers for Cas9 and other possible nickases<a onClick={() => goToPagesAndOpenTab('nickase', '/engineering')}> nickases </a> , we noticed, that the locus of the mutations is too far away from any SpuFz1 TAM sequences. Additionally, the applicability of insights gained through pegRNA optimization in this locus to CFTR editing would also be very limited due to the vast differences in the sequence of protospacer and surrounding genomic region. Additionally, we learned from our interview with <a onClick={() => goToPagesAndOpenTab('mattijsinv', '/human-practices')}> Mattijs Bulcaen </a> that the type of edit (insertion, substitution or deletion) significantly impacts editing efficiency. A mutation changing GFP to BFP would have to be a substitution instead of the three-nucleotide insertion needed to correct CFTR F508del.
+ When trying to find protospacers for Cas9 and other possible <a onClick={() => goToPageWithTabAndScroll ({scrollToId: 'nickase-header', path: '/engineering', tabId: 'tab-nickase'})}>nickases</a>, we noticed, that the locus of the mutations is too far away from any SpuFz1 TAM sequences. Additionally, the applicability of insights gained through pegRNA optimization in this locus to CFTR editing would also be very limited due to the vast differences in the sequence of protospacer and surrounding genomic region. Additionally, we learned from our interview with <a onClick={() => goToPagesAndOpenTab('mattijsinv', '/human-practices')}>Mattijs Bulcaen</a> that the type of edit (insertion, substitution or deletion) significantly impacts editing efficiency. A mutation changing GFP to BFP would have to be a substitution instead of the three-nucleotide insertion needed to correct CFTR F508del.
</p>
<H4 text="Learn" id="learn-head"/>
<p>
@@ -107,7 +107,7 @@ export function Engineering() {
</p>
<H4 text="Test" id="test-head"/>
<p>
- In the experiment, we transfected HEK293 cells (as recommended by <a onClick={() => goToPagesAndOpenTab('mattijsinv', '/human-practices')}> Mattijs Bulcaen </a>) with the <a onClick={() => goToPageWithTabAndScroll ({scrollToId: 'pe1', path: '/engineering', tabId: 'pe-systems' })}>pCMV-PE2 prime editor</a> plasmid and the pDAS12489_PEAR-GFP_2in1_2.0 mentioned above. Our first proof of concept succeeded as we could see fluorescent cells 72 h after transfection. In contrast, negative controls with only one of the plasmids transfected did not show any fluorescence. However, the transfection efficiency in our initial test runs was quite low, as indicated by a technical positive control.
+ In the experiment, we transfected HEK293 cells (as recommended by <a onClick={() => goToPagesAndOpenTab('mattijsinv', '/human-practices')}>Mattijs Bulcaen</a>) with the <a onClick={() => goToPageWithTabAndScroll ({scrollToId: 'current-pe-systems', path: '/engineering', tabId: 'tab-pe-systems' })}>pCMV-PE2 prime editor</a> plasmid and the pDAS12489_PEAR-GFP_2in1_2.0 mentioned above. Our first proof of concept succeeded as we could see fluorescent cells 72 h after transfection. In contrast, negative controls with only one of the plasmids transfected did not show any fluorescence. However, the transfection efficiency in our initial test runs was quite low, as indicated by a technical positive control.
</p>
<figure>
<img src="https://static.igem.wiki/teams/5247/engineering-cycle/rep-it2.svg" alt="Illustration of the proof of concept using the PEAR2in1 system"/>
@@ -127,7 +127,7 @@ export function Engineering() {
The original PEAR plasmid pDAS12124_PEAR-GFP-preedited that we bought from AddGene represents, as the name suggests, how the reporter should look like after successful editing and can thus be used as a positive control and for normalization. To alter the PEAR plasmid so that it mimics the mutated genomic CFTR target, we first analyzed the region surrounding CFTR F508del mutation. As the mutation is a three base pair deletion, we introduced the very same at the 5’ splicing signal. For this modification to reliably disrupt intron splicing and thus eGFP expression, we effectively removed the GT bases of the intronic 5’ splice donor site as well as the preceding, exonic G base of the 5’ flanking sequence. Secondly, we replaced the intronic region downstream of the four base pair 3’ flanking region with the respective sequence from the CFTR locus. This 27 bp substitute included a PAM sequence, an entire spacer as well as four additional base pairs in between present in the original gene sequence. Lastly, we introduced silent mutations upstream of the 5’ flanking sequence that lowered the GC content. This was to mimic the AT-rich region preceding the F508del mutation in the CFTR gene. This reveals one of the necessary shortcomings of this reporter: Edits upstream of the 5’ donor site are heavily restricted by the eGFP coding sequence.
</p>
<figure>
- <img src="https://static.igem.wiki/teams/5247/engineering-cycle/rep-it3_strategy.svg" alt="Modification strategy for creation of the pPEAR_CFTR plasmid"/>
+ <img src="https://static.igem.wiki/teams/5247/engineering-cycle/rep-strategy-it3.svg" alt="Modification strategy for creation of the pPEAR_CFTR plasmid"/>
<figcaption><b>Figure 3:</b> Illustration of the modification strategy for the pPEAR_CFTR reporter. The pDAS12124_PEAR-GFP-preedited plasmid was modified by introducing a 3 bp deletion resembling the F508del mutation, inserting a 27 bp sequence from the genomic CFTR target including PAM and protospacer sequence as well as making silent edits to account for the AT-rich region upstream of the mutation.</figcaption>
</figure>
<H4 text="Build" id="build-head"/>
@@ -173,7 +173,7 @@ export function Engineering() {
Like with the experiments in HEK cells, we transfected a technical control plasmid as well the unmodified pDAS12124_PEAR-GFP-preedited plasmid as positive controls and our modified plasmid, pCMV-PE6c and the pegRNA plasmid individually as negative controls. Again, the positive controls showed solid fluorescence, while the negative control did not.
</p>
<figure>
- <img src="https://static.igem.wiki/teams/5247/engineering-cycle/rep-it5.svg" alt="Illustration of applying the pPEAR_CFTR system to lung epithelial cell lines"/>
+ <img src="https://static.igem.wiki/teams/5247/engineering-cycle/rep-it4.svg" alt="Illustration of applying the pPEAR_CFTR system to lung epithelial cell lines"/>
<figcaption><b>Figure 5:</b> Illustration of the pegRNA testing using the pPEAR_CFTR system. CFBE41o- cells transiently transformed with the pPEAR_CFTR plasmid (in the middle) show fluorescence after transformation with a prime editor and a reporter-specific pegRNA expression plasmid. The pDAS12124_PEAR-GFP-preedited is used as an internal positive control and for normalization.</figcaption>
</figure>
<H4 text="Learn" id="learn-head"/>
@@ -541,6 +541,14 @@ export function Engineering() {
<div className="eng-box box" >
<H2 id="pegrna-header" text="pegRNA"></H2>
<p>The <a onClick={() => goToPagesAndOpenTab('pegrna', '/engineering')}> pegRNA </a> is of paramount importance for function and efficiency of prime editors, as it plays a role in every step of the prime editing mechanism. It is therefore equally important to optimize the pegRNA than it is to have an optimized prime editor. Hence this engineering cycle explains our process of optimizing the pegRNAs for our genomic target, CFTR F508del. Given that different areas of the pegRNA have different functionalities, the following iteration cycles will demonstrate how improvements and optimizations have been made to these various functional domains in relation to the CFTR context. This was achieved through research, the correspondence with of experts and experiments.</p>
+
+ <div className="casettecontainer">
+ <div className="pegrnabox" style={{height: 'auto', width: '50%'}}>
+ <img src="https://static.igem.wiki/teams/5247/engineering-cycle/pegrna-overview.svg" alt="Illustration of the key components in our pegRNAs, including spacer, gRNA scaffold, primer binding sequence, reverse transcriptase template, tevopreQ1 3' stem loop motif and templates for main and silent edits."/>
+ <figcaption><b>Figure 1: Illustration of the key components in our pegRNAs, including spacer, gRNA scaffold, primer binding sequence (PBS), reverse transcriptase template (RTT), tevopreQ1 3' stem loop motif and templates for main and silent edits.</b> </figcaption>
+ </div>
+ </div>
+
</div>
<div className="box" >
<p id="peg1">
@@ -705,7 +713,7 @@ export function Engineering() {
</div>
<div className="box" >
<p id="nic1">
- <H3 text="SpuFz1 Zink Finger Mutation " id="nic1head"/>
+ <H3 text="SpuFz1 Zink Finger Mutation" id="nic1head"/>
<H4 text="Design" id="text"/>
<p>
In our quest to identify smaller endonucleases suitable for creating nickases, we focused on a newly characterized family of eukaryotic endonucleases known as Fanzor proteins first described in June 2023<TabScrollLink tab="tab-nickase" num="1" scrollId="desc-1"/>, with SpuFz1 (Fig. 1) being a standout candidate due to its smaller size compared to Cas9 (SpuFz1 consists of 638 amino acids<TabScrollLink tab="tab-nickase" num="1" scrollId="desc-1"/>, whereas Cas9 has a size of 1368 amino acids<TabScrollLink tab="tab-nickase" num="2" scrollId="desc-2"/>). We selected SpuFz1 not only because of its smaller size, but also due to structural advantages, such as the reversed positioning of the spacer, which provides better protection from RNase degradation and improves editing precision.
--
GitLab