diff --git a/src/components/My-Timeline.tsx b/src/components/My-Timeline.tsx
index 4fa5525e12c890f5cbdfa6c1f5effeea9995bbe9..9a20ec55eac25e145cb8f54f6c473dc0899228c1 100644
--- a/src/components/My-Timeline.tsx
+++ b/src/components/My-Timeline.tsx
@@ -15,12 +15,16 @@ interface ItemProps {
children: React.ReactNode;
tag: string,
color: string,
- csstag: string
+ csstag: string,
+ url: string,
+ url2?: string
}
+
+
/* import ImageEvent from './ImageEvent.tsx';
import UrlButton from './UrlButton.tsx'; */
-export const TimelineItemPic = ({ heading, text, vorname, nachname, date, tag, color, children, csstag }:ItemProps) => (
+export const TimelineItemPic = ({ heading, text, vorname, nachname, date, tag, color, children, csstag, url }:ItemProps) => (
<div className="timeline-item">
<div className="timeline-item-content">
<span className="tag" style={{ background: color }}>
@@ -32,7 +36,7 @@ export const TimelineItemPic = ({ heading, text, vorname, nachname, date, tag,
<div className="row">
<div className="col">
<figure className="snip1113 red">
- <img src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg" alt="pr-sample1" />
+ <img src={url} alt="pr-sample1" />
<figcaption>
<h3>{vorname} <br/> <span>{nachname}</span></h3>
</figcaption>
@@ -51,7 +55,7 @@ export const TimelineItemPic = ({ heading, text, vorname, nachname, date, tag,
</div>
);
-export const TimelineItemTwoPic = ({ heading, text, vorname, nachname, vorname2, nachname2, date, tag, color, children, csstag }:ItemProps) => (
+export const TimelineItemTwoPic = ({ url, url2, heading, text, vorname, nachname, vorname2, nachname2, date, tag, color, children, csstag }:ItemProps) => (
<div className="timeline-item">
<div className="timeline-item-content">
<span className="tag" style={{ background: color }}>
@@ -63,7 +67,7 @@ export const TimelineItemTwoPic = ({ heading, text, vorname, nachname, vorname2
<div className="row">
<div className="col">
<figure className="snip1113 red">
- <img src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg" alt="pr-sample1" />
+ <img src={url} alt="pr-sample1" />
<figcaption>
<h3>{vorname} <br/> <span>{nachname}</span></h3>
</figcaption>
@@ -71,7 +75,7 @@ export const TimelineItemTwoPic = ({ heading, text, vorname, nachname, vorname2
</div>
<div className="col">
<figure className="snip1113 red">
- <img src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg" alt="pr-sample1" />
+ <img src={url2} alt="pr-sample1" />
<figcaption>
<h3>{vorname2} <br/> <span>{nachname2}</span></h3>
</figcaption>
@@ -159,6 +163,7 @@ export function MyTimeline () {
</div>
<TimelineItemTwoPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='Scientific Talk I.'
tag= 'Talks'
color='var(--lightblue)'
@@ -176,6 +181,7 @@ export function MyTimeline () {
</TimelineItemTwoPic>
<TimelineItemPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='How to Wiki'
tag='Workshop Session I.'
color='var(--text-primary)'
@@ -186,10 +192,11 @@ export function MyTimeline () {
text="Learning the basics of Wiki coding and design. In this workshop, the participants geined expertise to elevate their teams wiki."
>
<div id="wikiworkshop" style={{display: "none"}}>
- So much more
+ so much more
</div>
</TimelineItemPic>
<TimelineItemPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='How to SynBio'
tag='Workshop Session I.'
color='var(--text-primary)'
@@ -205,6 +212,7 @@ export function MyTimeline () {
</div>
</TimelineItemPic>
<TimelineItemTwoPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='How to use AI as a scientist'
tag='Workshop Session I.'
color='var(--text-primary)'
@@ -218,6 +226,7 @@ export function MyTimeline () {
</div>
</TimelineItemTwoPic>
<TimelineItemPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='Scientific Talk II.'
tag= 'Talks'
color='var(--lightblue)'
@@ -232,6 +241,7 @@ export function MyTimeline () {
</div>
</TimelineItemPic>
<TimelineItem
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='Team project presentations'
tag= 'Team presentations'
color='var(--accent-primary'
@@ -253,6 +263,7 @@ export function MyTimeline () {
</div>
</TimelineItem>
<TimelineItem
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='Poster Exhibition Booth'
tag= 'Team presentations'
color='var(--accent-primary)'
@@ -274,6 +285,7 @@ export function MyTimeline () {
</div>
</TimelineItem>
<TimelineItemPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='How to work safe'
tag='Workshop Session II.'
color='var(--text-primary)'
@@ -288,6 +300,7 @@ export function MyTimeline () {
</div>
</TimelineItemPic>
<TimelineItemPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='How to Communicate Science'
tag='Workshop Session II.'
color='var(--text-primary)'
@@ -333,6 +346,7 @@ export function MyTimeline () {
tag='Workshop Session II.'
color='var(--text-primary)'
csstag="pitch"
+ url="https://static.igem.wiki/teams/5247/photos/meetup/speakers/madeleine-mussgnug.jpg"
vorname="Madeleine"
nachname="Mussgnug"
heading="placeholder"
@@ -345,6 +359,7 @@ export function MyTimeline () {
</div>
</TimelineItemPic>
<TimelineItemPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='How to Multi Media'
tag='Workshop Session II.'
color='var(--text-primary)'
@@ -364,20 +379,44 @@ export function MyTimeline () {
<PanelTimelineItem></PanelTimelineItem>
<TimelineItemPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='iGEMer Ted Talks'
tag= 'Talks'
color='var(--lightblue)'
- heading="placeholder"
+ heading="Secrets to award-winning bioinformatics tools"
text="Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et"
- vorname="place"
- nachname="holder"
+ vorname="Lasse"
+ nachname="Middendorf"
csstag="tedtalk1"
>
<div id="tedtalk1" style={{display: "none"}}>
- So much more
+ <p>Lasse’s Ted talk was all about how to create good bioinformatics software. He himself was part of
+ the dry lab in iGEM Münster’s Team that won the best software special prize in 2022. The tool they
+ created allowed users to generate knockout candidates for an organism of their choice that would
+ lead to redirection of metabolic flux to a reaction chosen by the user. We learned that the most
+ important attributes for a successful bioinformatics software are: </p>
+ <ul>
+ <li><b>Usefulness </b></li>
+ <li><b>Accessibility</b></li>
+ <li><b>Build upon existing standards </b></li>
+ </ul>
+ <p>To ensure usefulness, the software should be generalized and not only usable in the context of one’s
+ own project. Also, all steps that can be automated should be automated. Accessibility, Lasse said,
+ requires for the software to be easy to install, easy to use and well documented. </p>
+ <p>As a funny, but also very fitting anecdote, Lasse told us about the HU test. For testing their own tool for
+ accessibility, he gave a bioinformatically unexperienced, <b>h</b>ungover <b>u</b>ndergraduate student
+ nothing but the software with the provided documentation. If the student can use the tool in a reasonable
+ amount time, that would make it accessible enough for everyone. Furthermore, Lasse also recommended making
+ a command line tool for better availability over time and integration into other workflows. Lastly, the
+ software should use standard data files like CSV, Fasta etc. and be written in commonly used programming
+ languages like Python. </p>
+ <p>Overall, Lasse gave a great insight into the properties of a special price winning software tool and very
+ practically explained how these can be tested and achieved, information that is invaluable for us when
+ creating our own bioinformatics tool. </p>
</div>
</TimelineItemPic>
<TimelineItemPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='iGEMer Ted Talks'
tag= 'Talks'
color='var(--lightblue)'
@@ -392,6 +431,7 @@ export function MyTimeline () {
</div>
</TimelineItemPic>
<TimelineItemPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='Science Slam Session'
tag= 'Talks'
color='var(--lightblue)'
@@ -406,6 +446,7 @@ export function MyTimeline () {
</div>
</TimelineItemPic>
<TimelineItemPic
+ url="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"
date='Science Slam Session'
tag= 'Talks'
color='var(--lightblue)'
diff --git a/src/contents/education.tsx b/src/contents/education.tsx
index a44eacf7063b11d9bff9b2bd86a91745d30ce08c..ea5af89ed9bd7d7d61c031d08288ec569c96e7f2 100644
--- a/src/contents/education.tsx
+++ b/src/contents/education.tsx
@@ -50,10 +50,10 @@ export function Education() {
at the university and in our city as you can see in the following picture. </p>
<div className="row align-items-center">
<div className="col">
- <img src="https://media.istockphoto.com/id/1409329028/vector/no-picture-available-placeholder-thumbnail-icon-illustration-design.jpg?s=612x612&w=0&k=20&c=_zOuJu755g2eEUioiOUdz_mHKJQJn-tDgIAhQzyeKUQ="></img>
+ <img src="https://static.igem.wiki/teams/5247/photos/edcation-and-outreach/teutoruft-experminet.jpeg"></img>
</div>
<div className="col">
- <img src="https://media.istockphoto.com/id/1409329028/vector/no-picture-available-placeholder-thumbnail-icon-illustration-design.jpg?s=612x612&w=0&k=20&c=_zOuJu755g2eEUioiOUdz_mHKJQJn-tDgIAhQzyeKUQ="></img>
+ <img src="https://static.igem.wiki/teams/5247/photos/edcation-and-outreach/teutoruft-gruppe.jpeg"></img>
</div>
</div>
<br/>