Skip to content
Snippets Groups Projects
Commit ebdbc3fe authored by Kaya Lange's avatar Kaya Lange
Browse files
parents 986313ea f6b4da81
No related branches found
No related tags found
No related merge requests found
Pipeline #493307 passed
No preview for this file type
......@@ -844,14 +844,24 @@ img .middle{
max-height: 70% !important;
}
.img-round{
border-radius: 50%;
width: 120px;
height: 120px;
max-height: 13vh;
max-height: 13vh;
max-width: 13vh;
object-fit: cover !important;
}
.img-round-panel{
border-radius: 50%;
width: 100px;
height: 100px;
max-height: 10vh;
max-width: 10vh;
object-fit: cover !important;
}
.img-cube{
max-width: 80%;
}
......@@ -1123,12 +1133,13 @@ svg{
max-width: 1100px !important;
}
.one-pdf-line{ /* @media fertig */
height: 1450px !important;
max-height: 650px !important;
height: 100vh !important;
max-width: 40% !important;
}
.two-pdf-line{ /* @media fertig */
max-height: 650px !important;
height: 35vh !important;
max-width: 50%;
min-height: 650px !important;
height: 100vh !important;
}
/* SHAPES */
......@@ -4141,4 +4152,11 @@ figure img{
.timelinetab{
border-radius: 20px;
padding: 20px;
}
.iframe-container {
display: flex;
justify-content: center;
align-items: center;
}
\ No newline at end of file
......@@ -223,7 +223,7 @@ button.tabbutton:nth-child(1), button.tabbutton:nth-child(6){
.timeline-item-content {
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
border-radius: 5px;
background-color: var(--ourbeige);
background-color: white; /* Soll white bleiben! */
display: flex;
flex-direction: column;
align-items: flex-end;
......@@ -275,7 +275,7 @@ button.tabbutton:nth-child(1), button.tabbutton:nth-child(6){
.timeline-end{
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
border-radius: 5px;
background-color: var(--ourbeige);
background-color: white; /* soll white bleiben */
padding: 15px;
position: relative;
text-align: center;
......@@ -285,7 +285,7 @@ margin-top: 8vw;
.timeline-begin{
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
border-radius: 5px;
background-color: var(--ourbeige);
background-color: white; /* soll white bleiben */
padding: 15px;
position: relative;
text-align: center;
......@@ -362,4 +362,9 @@ display: flex;
.timeline-item figcaption{
background-color: var(--ourbeige) !important;
}
.timeline-item figcaption, .timeline-item figure, .timeline-item figcaption h3 {
background-color: white !important;
}
\ No newline at end of file
......@@ -191,9 +191,14 @@ export function BFHTimeline () {
<h5>Team project presentations</h5>
<div className="col bfh-slider">
<SimpleSlider>
<img className="" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
<img className="" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
<img className="" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
<img className="" src="https://static.igem.wiki/teams/5247/photos/meetup/team-presentations/anyconv-com-dscf7428-enhanced-nr.webp"/>
<img className="" src="https://static.igem.wiki/teams/5247/photos/meetup/team-presentations/anyconv-com-dscf7430-enhanced-nr.webp"/>
<img className="" src="https://static.igem.wiki/teams/5247/photos/meetup/team-presentations/anyconv-com-dscf7485-enhanced-nr.webp"/>
<img className="" src="https://static.igem.wiki/teams/5247/photos/meetup/team-presentations/anyconv-com-dscf7498-enhanced-nr.webp"/>
<img className="" src="https://static.igem.wiki/teams/5247/photos/meetup/team-presentations/anyconv-com-dscf7506-enhanced-nr.webp"/>
<img className="" src="https://static.igem.wiki/teams/5247/photos/meetup/team-presentations/anyconv-com-dscf7524-enhanced-nr.webp"/>
<img className="" src="https://static.igem.wiki/teams/5247/photos/meetup/team-presentations/anyconv-com-dscf7532-enhanced-nr.webp"/>
<img className="" src="https://static.igem.wiki/teams/5247/photos/meetup/team-presentations/anyconv-com-dscf7548-enhanced-nr.webp"/>
</SimpleSlider>
</div>
<span>
......
......@@ -3,13 +3,20 @@ import { ButtonOne, DownloadLink } from "./Buttons"
export function PDF({link, name}: {link: string, name:string}){
return(
<div className='row align-items-center'>
<iframe src={link} width="100%" title="title" className='one-pdf-line small-i'>
</iframe>
<div className='row download-col'>
<DownloadLink url={link} fileName={name} ></DownloadLink>
</div>
</div>
<div className="col">
<div className='align-items-center'>
<div className="iframe-container">
<iframe src={link} title="title" className='one-pdf-line small-i'>
</iframe>
</div>
</div>
<div className='row download-col'>
<DownloadLink url={link} fileName={name} ></DownloadLink>
</div>
</div>
)
}
export function TwoLinePDF({link, name}: {link: string, name:string}){
......
......@@ -146,23 +146,23 @@ export const PanelTimelineItem = () => (
<time>Panel Discussion</time>
<div className="row align-items-center panel-talk-gallery">
<div className="col">
<img className="img-round" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/traci.jpg" alt="pr-sample1" />
<img className="img-round-panel" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/traci.jpg" alt="pr-sample1" />
<div className="small middle">Taci <br/> Haddock</div>
</div>
<div className="col">
<img className="img-round" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/anita-sifuantes.png" alt="pr-sample1" />
<img className="img-round-panel" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/anita-sifuantes.png" alt="pr-sample1" />
<div className="small middle">Ana <br/> Sifuentes</div>
</div>
<div className="col">
<img className="img-round" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/olivia.png" alt="pr-sample1" />
<img className="img-round-panel" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/olivia.png" alt="pr-sample1" />
<div className="small middle">Olivia <br/> Mozolewska</div>
</div>
<div className="col">
<img className="img-round" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/middendorf.jpeg" alt="pr-sample1" />
<img className="img-round-panel" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/middendorf.jpeg" alt="pr-sample1" />
<div className="small middle">Lasse <br/> Middendorf</div>
</div>
<div className="col">
<img className="img-round" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/nemanja.jpg" alt="pr-sample1" />
<img className="img-round-panel" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/nemanja.jpg" alt="pr-sample1" />
<div className="small middle">Nemanja <br/> Stijepovic</div>
</div>
</div>
......
import { useTabNavigation } from "../../utils/TabNavigation";
import { MeetUP } from "./BFH/bfh";
import { CollabContribution } from "./collabs";
import { PatientContribution } from "./patient-contribution";
import { SafetyContribution } from "./safety-contribution";
import { Wiki } from "./Wiki/wiki";
......@@ -11,6 +12,7 @@ export function Contribution() {
<MeetUP/>
<SafetyContribution/>
<CollabContribution/>
<PatientContribution/>
<Wiki/>
</>
);
......
import { TwoLinePDF } from "../../components/Pdfs";
import { Section } from "../../components/sections";
export function PatientContribution(){
return(
<>
<Section title="Patient Matters" id="Patient Matters" >
<div className='row align-items-center'>
<div className='col '>
<TwoLinePDF link="https://static.igem.wiki/teams/5247/pdfs/patienteneinwilligung-mustervorlage-igem.pdf" name="patienteneinwilligung-mustervorlage-igem.pdf"/>
</div>
<div className='seperator-2 col-2'>
</div>
<div className='col '>
<TwoLinePDF link="https://static.igem.wiki/teams/5247/pdfs/augearbeitetes-hygienekonzept.pdf" name="augearbeitetes-hygienekonzept.pdf"/>
</div>
</div>
</Section>
</>
)
}
\ No newline at end of file
......@@ -6,12 +6,9 @@ export function SafetyContribution(){
return(
<>
<Section title="Patient Consent Form" id="Patient Consent Form" >
<PDF link="https://static.igem.wiki/teams/5247/pdfs/patienteneinwilligung-mustervorlage-igem.pdf" name="patienteneinwilligung-mustervorlage-igem.pdf"/>
<Section title="Primary Culture Safety Guideline" id="Safety Guideline" >
<PDF link="https://static.igem.wiki/teams/5247/pdfs/primary-culture-guideline.pdf" name="primary-culture-guideline.pdf"/>
</Section>
<Section title="Primary Culture Safety Guidelines" id="Safety Guidelines">
<PDF link="https://static.igem.wiki/teams/5247/pdfs/primary-culture-guideline.pdf" name="primary-culture-guideline.pdf"/>
</Section>
</>
)
......
......@@ -2,7 +2,7 @@
import { ButtonOneEngineering } from "../components/Buttons";
import { LoremShort } from "../components/Loremipsum";
import { openElement } from "../utils/openElement";
import { H3, H4, H5 } from "../components/Headings";
import { H2, H3, H4, H5 } from "../components/Headings";
import { useTabNavigation } from "../utils/TabNavigation";
import { Collapsible } from "../components/Collapsible";
import { useNavigation } from "../utils";
......@@ -31,7 +31,7 @@ export function Engineering() {
<div id="tab-our-cycle" className="enginneeringtab" style={{display: "block"}}>
<section > <br id="obenengineering"/>
<div className="eng-box box" >
<H3 text="Our cycle" id="our-cycle-header"></H3>
<H4 text="Our cycle" id="our-cycle-header"></H4>
<p>Hallo Prime Editing diesdas</p>
</div>
......@@ -50,7 +50,7 @@ export function Engineering() {
<div className="enginneeringtab" id="tab-reporter" style={{display: "none"}}>
<section id="reporter sec" >
<div className="eng-box box" >
<H3 id="reporter-header" text="Prime Editing Reporter"></H3>
<H2 id="reporter-header" text="Prime Editing Reporter"></H2>
<p>Prime editing is a is a very precise and safe method. However, depending on the genomic locus targeted, the editing efficiency can be very low. The cystic fibrosis causing CFTR F508del mutation is, as Mattijs Bulcaen[link] stated in our interview, one of, if not the most obvious application of prime editing, considering the large amount of people affected. The lack of publications addressing CFTR target implied, that the mutation might be particularly hard to edit. At low editing efficiency, successful edits are hard, if not impossible to distinguish from the background noise using conventional methods like sanger sequencing or qPCR. As a basis to effectively test our approach and screen for working pegRNAs, we needed a highly sensitive method of detection with as little noise as possible to optimize our prime editing approach for genomic CFTR targeting.</p>
</div>
<div className="box" >
......@@ -209,7 +209,7 @@ export function Engineering() {
<div id="tab-transfection" className="enginneeringtab" style={{display: "none"}}>
<section >
<div className="eng-box box" >
<H3 id="transfection-header" text="Optimization of Transfection"></H3>
<H2 id="transfection-header" text="Optimization of Transfection"></H2>
<p>
To test prime editors, a reliable model system is required. HEK293 cells are a human derived cell line and widely used in a variety of fields in biology<TabScrollLink tab="tab-transfection" num="1" scrollId="desc-1"/>. Apart from easy handling and comparatively easy transfection, they have, as we found out in our exchange with <a onClick={() => goToPagesAndOpenTab('mattijsinv', '/human-practices')}>Mattijs Bulcaen</a>, one advantage over other models: They are naturally impaired in DNA repair mechanisms and therefore easier to edit. To properly compare editing efficiencies, a high transfection efficiency is of utmost importance. This engineering cycle focuses on our work in simulating prime editing using the PEAR reporter system<TabScrollLink tab="tab-transfection" num="2" scrollId="desc-2"/> and optimizing transfection protocols.
</p>
......@@ -326,7 +326,7 @@ export function Engineering() {
<div id="tab-pe-systems" className="enginneeringtab" style={{display: "none"}}>
<section id="PE Systems sec" >
<div className="eng-box box" >
<H3 id="pe-systems-header" text="Prime Editing Systems"></H3>
<H2 id="pe-systems-header" text="Prime Editing Systems"></H2>
<p>Different versions of the original prime editing system have been developed since its initial introduction. Deciding on what system to use for the application in therapeutic human gene editing, especially concerning the correction of F508del, was the goal of this engineering cycle.</p>
<p>
Since we aim to develop a therapy delivered to the human body, we wanted to obtain high editing efficiency while risking as little off-targets as possible and also reducing the size for improved packability.
......@@ -503,7 +503,7 @@ export function Engineering() {
<div className="enginneeringtab" id="tab-pegrna" style={{display: "none"}}>
<section id="pegRNA sec" >
<div className="eng-box box" >
<H3 id="pegrna-header" text="pegRNA"></H3>
<H2 id="pegrna-header" text="pegRNA"></H2>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
......@@ -628,7 +628,7 @@ export function Engineering() {
<div className="enginneeringtab" id="tab-nickase" style={{display: "none"}}>
<section id="Nickase sec" >
<div className="eng-box box" >
<H3 id="nickase-header" text="Alternative Nickases"></H3>
<H2 id="nickase-header" text="Alternative Nickases"></H2>
<p><LoremShort></LoremShort></p>
<img src="https://static.igem.wiki/teams/5247/fanzor/movie4-ezgif-com-video-to-gif-converter.gif"></img>
<img src="https://static.igem.wiki/teams/5247/fanzor/movie5-ezgif-com-video-to-gif-converter-2.gif"></img>
......@@ -770,7 +770,7 @@ export function Engineering() {
<div className="enginneeringtab" id="tab-delivery" style={{display: "none"}}>
<section id="Delivery sec" >
<div className="eng-box box" >
<H3 id="delivery-header" text="Delivery"></H3>
<H2 id="delivery-header" text="Delivery"></H2>
<p>The design path of our lipid nanoparticle (LNP) for mRNA delivery underwent multiple cycles of research and discussion, marked by important decision points and learnings along the way. By ongoing further improvement, we designed our lungs-specific LNP called AirBuddy with improved stability aspects, becoming more precise in the delivery of our therapeutic cargo LNP by LNP.</p>
<img src="https://static.igem.wiki/teams/5247/delivery/airbuddy.webp" style={{maxHeight: "80pt"}}/>
</div>
......
......@@ -16,7 +16,7 @@ export function Notebook() {
<p></p>
<div className='row'>
<div className="col">
<DownloadImageButton url="" fileName="">
<DownloadImageButton url="https://static.igem.wiki/teams/5247/pdfs/laboratory-notebook-1-proof-of-concept-for-pe.pdf" fileName="laboratory-notebook-1-proof-of-concept-for-pe.pdf">
<img src="https://static.igem.wiki/teams/5247/lab-journals/titelseite-lab-book-1-proof-of-concept-pe.webp" style={{height: "75%", width: "auto"}}/>
</DownloadImageButton>
</div>
......
......@@ -490,7 +490,27 @@ export const NavPages: (Page | PageRef | Folder)[] = [
name: "BFH European MeetUp",
title: "MeetUp",
path: "contribution/?scrollTo=BFH European MeetUp"
}
},
{
name: "Safety Guideline",
title: "Safety Guideline",
path: "contribution/?scrollTo=primary-culture-safety-guideline"
},
{
name: "Collaborations",
title: "Collaborations",
path: "contribution/?scrollTo=collaborations"
},
{
name: "Patient Matters",
title: "Patient Matters",
path: "contribution/?scrollTo=patient-matters"
},
{
name: "Wiki",
title: "Wiki",
path: "contribution/?scrollTo=wiki"
},
]
},
];
......
......@@ -12,7 +12,8 @@ export function ConSidebar(){
const tabs = [
{ tab: "BFH European MeetUp", subtabs: ["Aftervideo", "Timeline", "About", "Posters", "Guideline", "Gallery", "Downloads"]},
{tab: "Safety Guidelines"},
{tab: "Safety Guideline"},
{tab: "Collaborations"},
{tab: "Patient Matters"},
{tab: "Wiki"}
];
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment