Skip to content
Snippets Groups Projects
Commit 22cb0a96 authored by Liliana Sanfilippo's avatar Liliana Sanfilippo
Browse files

hp

parent e24ea9c9
No related branches found
No related tags found
No related merge requests found
Pipeline #401111 failed
......@@ -464,6 +464,11 @@ img .middle{
vertical-align:middle;
}
.sechpro{
margin-top: 25% !important;
margin-bottom: 20% !important;
}
/* .sponsor-portrait{
border: 5px solid var(--accent-primary);
} */
......
......@@ -176,7 +176,7 @@ function TimeItem({tag, title, pic, author, tabid}: ItemProps){
pic: "https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg",
tag: "Patient",
author: "Max Beckmann",
tabid: "InvMax",
tabid: "InvMax1",
text: " "
},
{
......@@ -191,7 +191,7 @@ function TimeItem({tag, title, pic, author, tabid}: ItemProps){
title: "" ,
pic: "https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg",
tag: "Medical Professional",
author: "Dr. Christian Olariu",
author: "Cristian-Gabriel Olariu",
tabid: "InvOlariu",
text: "Text",
},
......@@ -243,12 +243,20 @@ function TimeItem({tag, title, pic, author, tabid}: ItemProps){
tabid: "InvKolonko",
text: "Text",
},
{
title: "Physiotherapie live" ,
pic: "https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg",
tag: "Medical Professional",
author: "Katrin Westhoff",
tabid: "BesWesthoff",
text: "Text",
},
{
title: "Hygiene Concept",
pic: "https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg",
tag: "Patient",
author: "Max Beckmann",
tabid: "InvMax",
tabid: "InvMax2",
text: " "
},
{
......
......@@ -8,10 +8,51 @@
- Filter mit HalbkreisDing als Tabsteuerung | Einteilung nach Bereich (Academia, Insustry, ..., und auch nach Delivery und Mechanism)
- DNA Strang als Timeline?
*/
/* <br/>
<h3>Name</h3>
<hr/>
<div className="row">
<div className="col-2">
<div className="t-tag Tag">
Beruf
</div>
</div>
<div className="col">Original language: German</div>
</div>
<div className="row">
<div className="col">
<BlockQuoteB text="Quote" cite="."></BlockQuoteB>
</div>
<div className="col-3">
<img className="middle sechpro" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
</div>
</div>
<h4>Aim of contact</h4>
<p></p>
<h4>Insights</h4>
<p></p>
<h4>Clarification</h4>
<p></p>
<h4>Implementation</h4>
<p></p> */
/*
<h4>Aim of contact</h4>
<p></p>
<h4>Insights</h4>
<p></p>
<h4>Clarification</h4>
<p></p>
<h4>Implementation</h4>
<p></p>
*/
import { TimeHori } from "../components/HorizontalTimeline";
import { AllPopus } from "../components/HorizontalTimeline";
import { BFHStyleTabs, ButtonRowTabs } from "../components/Tabs";
import { TabButtonRow, openTab } from "../components/Buttons";
import { ButtonOne, TabButtonRow, openTab } from "../components/Buttons";
import { BlockQuoteB } from "../components/Quotes";
import { Box, Tab } from "@mui/material";
import {TabContext, TabList, TabPanel} from '@mui/lab';
......@@ -49,10 +90,69 @@ let timelinebuttonrowdata = [
let timelinepersontabs =[
{
node: <>
<h3>Max</h3>
<p></p>
<br/>
<h3>Max Beckmann</h3>
<h5>First official interview</h5>
<hr/>
<div className="row">
<div className="col-2">
<div className="t-tag Patient">
Patient
</div>
</div>
<div className="col">Original language: German</div>
</div>
<div className="row">
<div className="col">
<BlockQuoteB text="Quote" cite="."></BlockQuoteB>
</div>
<div className="col-3">
<img className="middle sechpro" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
</div>
</div>
<h4>Aim of contact</h4>
<p></p>
<h4>Insights</h4>
<p></p>
<h4>Clarification</h4>
<p></p>
<h4>Implementation</h4>
<p></p>
</>,
cssname: "InvMax1"
},
{
node: <>
<br/>
<h3>Max Beckmann</h3>
<h5>Feedback Interview</h5>
<hr/>
<div className="row">
<div className="col-2">
<div className="t-tag Patient">
Patient
</div>
</div>
<div className="col">Original language: German</div>
</div>
<div className="row">
<div className="col">
<BlockQuoteB text="Quote" cite="."></BlockQuoteB>
</div>
<div className="col-3">
<img className="middle sechpro" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
</div>
</div>
<h4>Aim of contact</h4>
<p></p>
<h4>Insights</h4>
<p></p>
<h4>Clarification</h4>
<p></p>
<h4>Implementation</h4>
<p></p>
</>,
cssname: "InvMax"
cssname: "InvMax2"
},
{
node: <>
......@@ -68,7 +168,33 @@ let timelinepersontabs =[
},
{
node: <>
<br/>
<h3>Nicole Friedlein</h3>
<hr/>
<div className="row">
<div className="col-2">
<div className="t-tag Ethics">
Phd
</div>
</div>
<div className="col">Original language: German</div>
</div>
<div className="row">
<div className="col">
<BlockQuoteB text="Quote" cite="."></BlockQuoteB>
</div>
<div className="col-3">
<img className="middle sechpro" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
</div>
</div>
<h4>Aim of contact</h4>
<p></p>
<h4>Insights</h4>
<p></p>
<h4>Clarification</h4>
<p></p>
<h4>Implementation</h4>
<p></p>
</>,
cssname: "InvFriedlein"
},
......@@ -81,14 +207,65 @@ let timelinepersontabs =[
},
{
node: <>
<h3>Mattijs</h3>
<br/>
<h3>Mattijs Bulcaen</h3>
<hr/>
<div className="row">
<div className="col-5">
<div className="t-tag Academia">
Phd. Student (Molecular Virology and Gene Therapy)
</div>
</div>
<div className="col">Original language: English</div>
</div>
<div className="row">
<div className="col">
<BlockQuoteB text="Quote" cite="."></BlockQuoteB>
</div>
<div className="col-3">
<img className="middle sechpro" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
</div>
</div>
<h4>Aim of contact</h4>
<p></p>
<h4>Insights</h4>
<p></p>
<h4>Clarification</h4>
<p></p>
<h4>Implementation</h4>
<p></p>
</>,
cssname: "InvBulcaen1"
},
{
node: <>
<h3>Mattijs</h3>
<br/>
<h3>Mattijs Bulcaen</h3>
<h5>Feedback Interview</h5>
<hr/>
<div className="row">
<div className="col-5">
<div className="t-tag Academia">
Phd. Student (Molecular Virology and Gene Therapy)
</div>
</div>
<div className="col">Original language: English</div>
</div>
<div className="row">
<div className="col">
<BlockQuoteB text="Quote" cite="."></BlockQuoteB>
</div>
<div className="col-3">
<img className="middle sechpro" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
</div>
</div>
<h4>Aim of contact</h4>
<p></p>
<h4>Insights</h4>
<p></p>
<h4>Clarification</h4>
<p></p>
<h4>Implementation</h4>
<p></p>
</>,
cssname: "InvBulcaen2"
......@@ -107,14 +284,107 @@ let timelinepersontabs =[
},
{
node: <>
<h3>Katrin</h3>
<br/>
<h3>Katrin Westhoff</h3>
<h5>Initial Interview</h5>
<hr/>
<div className="row">
<div className="col-2">
<div className="t-tag Medical">
Physiotherapist
</div>
</div>
<div className="col">Original language: German</div>
</div>
<div className="row">
<div className="col">
<BlockQuoteB text="The more we know, the more opportunities we have." cite="Katrin Westhoff"></BlockQuoteB>
</div>
<div className="col-3">
<img className="middle sechpro" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
</div>
</div>
<h4>Aim of contact</h4>
<p>The objective of the contact was to gain in-depth insights into the treatment and care of children with cystic fibrosis. The therapist's expertise was intended to help develop a better understanding of the challenges and necessary measures in the treatment of this chronic disease. In addition, the aim was to ascertain how the therapy is implemented in everyday life and which specific approaches and methods are particularly effective. </p>
<h4>Insights</h4>
<p>The interview yielded valuable insights into the regular implementation of the therapy, the use of aids, and the adaptation
of exercises to the individual needs of the patients. It was notable that the therapy has improved
considerably thanks to better medication and adapted exercises, with a concomitant increase in life
expectancy for children affected by cystic fibrosis. Of particular interest was the emphasis
on the importance of sport and exercise, which should not only be therapeutically effective, but also increase quality of life. </p>
<h4>Clarification</h4>
<p></p>
<h4>Implementation</h4>
<p>The following statement by Katrin Westhoff had a particularly profound impact on our project: "The more we know, the more opportunities we have."
We learned from the interview that the current medication is already helping many patients to a huge
extent, but that there is still a significant opportunity for improvement. After all, successful gene
therapy would markedly enhance the quality of life for those affected. The findings of this project will
be disseminated to the relevant researchers in order to facilitate the rapid improvement of the quality of
life of all cystic fibrosis patients, regardless of their mutation. </p>
</>,
cssname: "InvWesthoff"
},
{
node: <>
<h3>Olariu</h3>
<br/>
<h3>Katrin Westhoff</h3>
<h5>Visit</h5>
<hr/>
<div className="row">
<div className="col-2">
<div className="t-tag Medical">
Physiotherapist
</div>
</div>
<div className="col">Original language: German</div>
</div>
<div className="row">
<div className="col">
<BlockQuoteB text="Quote" cite="."></BlockQuoteB>
</div>
<div className="col-3">
<img className="middle sechpro" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
</div>
</div>
<h4>Aim of contact</h4>
<p></p>
<h4>Insights</h4>
<p></p>
<h4>Clarification</h4>
<p></p>
<h4>Implementation</h4>
<p></p>
</>,
cssname: "BesWesthoff"
},
{
node: <>
<br/>
<h3>Cristian-Gabriel Olariu</h3>
<hr/>
<div className="row">
<div className="col-2">
<div className="t-tag Medical">
Pediatrician
</div>
</div>
<div className="col">Original language: German</div>
</div>
<div className="row">
<div className="col">
<BlockQuoteB text="Quote" cite="."></BlockQuoteB>
</div>
<div className="col-3">
<img className="middle sechpro" src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
</div>
</div>
<h4>Aim of contact</h4>
<p></p>
<h4>Insights</h4>
<p></p>
<h4>Clarification</h4>
<p></p>
<h4>Implementation</h4>
<p></p>
</>,
cssname: "InvOlariu"
......@@ -140,6 +410,7 @@ let timelinepersontabs =[
</>,
cssname: "InvHammer"
},
]
// die height für className="timeline row align-items-center" muss angepasst werden, damit die Boxen höher sein können
......@@ -155,19 +426,9 @@ export function HumanPractices() {
/>
<HPOverview/>
<HPTimeline/>
<section id="Inspiration" className="section">
<div className="center">
<h3 className="col personalstyleone">Inspiration</h3>
{/* <HPTabsTwo/> */}
</div>
</section>
<section id="Methods" className="section">
<div className="center">
<h3 className="col personalstyleone">Method</h3>
</div>
<HPTabsTwo/>
</section>
<section id="Analysis">
<div className="center" >
<h3 className="col personalstyleone">Analysis</h3>
......@@ -185,12 +446,12 @@ export function HumanPractices() {
</section>
{/*
<section id="Implementation" className="section">
<div className="center">
<h3 className="col personalstyleone">Implementation</h3>
</div>
</section>
</section> */}
</div>
......@@ -245,7 +506,7 @@ function HPTabs(){
<div></div>
</div> */
function HPTabsTwo(){
export function HPTabsTwo(){
return(
<>
......@@ -315,8 +576,25 @@ function HPOverview(){
<section id="Overview" className="section">
<div className="center" >
<h3 className="col personalstyleone">Overview</h3>
</div>
<div className="col" style={{position: "relative", height: "fit-content"}}>
</div>
<div className="row align-items-center" style={{marginTop: "5vh", marginBottom: "5vh"}}>
<div className="col">
<ButtonOne text="Inspiration" open="inspiration"></ButtonOne>
</div>
<div className="col">
<ButtonOne text="Methods" open="methods"></ButtonOne>
</div>
<div className="col">
<ButtonOne text="Values and goals" open="values"></ButtonOne>
</div>
<div className="col">
<ButtonOne text="Stakeholders" open="stakeholders"></ButtonOne>
</div>
</div>
<div className="col cycletab" id="inspiration" style={{display: "block"}}>Hallo </div>
<div className="col cycletab" id="values" style={{display: "none"}}>Hallo </div>
<div className="col cycletab" id="methods" style={{display: "none"}}>Hallo </div>
<div className="col cycletab" id="stakeholders" style={{position: "relative", height: "fit-content", display: "none"}}>
<MindMapTwo></MindMapTwo>
</div>
</section>
......@@ -507,3 +785,18 @@ function MindMapTwo(){
)
}
export function idTabLine({beruf, tagend, lang}:{beruf: string, tagend: string, lang: string}){
let cl = "t-tag " + tagend
return(
<div className="row">
<div className="col-2">
<div className={cl}>
{beruf}
</div>
</div>
<div className="col"> Original language: {lang}</div>
</div>
)
}
\ No newline at end of file
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