Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • 2024/bielefeld-cebitec
  • l-sanfilippo/bielefeld-ce-bi-tec-temp
2 results
Show changes
Commits on Source (1179)
1,079 additional commits have been omitted to prevent performance issues.
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 932 additions and 7814 deletions
.gitignore
View file @ 3fd292fd
......@@ -15,3 +15,8 @@ other
dist
src/components/resources
code/test.bib
.DS_Store
code/test file gitignore.txt
src/.DS_Store
vite.config.js.timestamp-1732367750130-6d00136194c2.mjs
vite.config.js.timestamp-1733161862061-488217339257e.mjs
code/cit.py
View file @ 3fd292fd
......@@ -97,6 +97,7 @@ def main():
print("DONE")
def makeauthors(authors, out):
print("Starting on authors...")
authors = authors.replace("\n", " ").replace(" and ", "|").strip() # "and" durch "|" ersetzen und Whitespace entfernen
autlist = authors.split("|")
......@@ -143,12 +144,10 @@ def articleHTML(dictio, x, out):
print("Writing html code for article "+ str(x) + "...")
out.write("{/*<!-- Citation num " + str(x) + "--> */}" + "\n")
out.write("<li typeof=\"schema:ScolarlyArticle\" role=\"doc-biblioentry\" property=\"schema:citation\" id=\"desc-" + str(x) + "\">"+ "\n")
# out.write("\t" + "<span property=\"schema:author\" typeof=\"schema:Person\">"+ "\n")
print("Just a sec, separating authors...")
authors = dictio['author']
print("giving authors...")
makeauthors(authors, out)
# out.write("\t" +"</span>"+ "\n")
title = dictio['title'].replace('{', '').replace('}', '')
out.write("\t" + "<span property=\"schema:name\">&nbsp;"+ title + "</span>. "+ "\n")
......@@ -159,10 +158,11 @@ def articleHTML(dictio, x, out):
pages = dictio['pages']
if pages is not None and len(pages) > 0:
# Überprüfen, ob die Seitenangabe nur aus Zahlen und Bindestrichen besteht
if '-' in pages or '–' in pages or '--' in pages:
pag = re.split('--|-|–', pages)
if '-' in pages or '–' in pages or '--' in pages or '–' in pages:
pag = re.split('--|-|–|–', pages)
begin = pag[0].strip()
end = pag[1].strip()
print("- in pages")
out.write("\t" + ",&nbsp;<span property=\"schema:pageBegin\"> "+ begin +"</span>-<span property=\"schema:pageEnd\">"+ end + "</span>&nbsp;"+ "\n")
else:
if re.match(r'^\d+(-\d+)?$', pages): # Check for typical numeric page ranges
......@@ -192,6 +192,9 @@ def articleHTML(dictio, x, out):
out.write("</li>" + "\n"+ "\n")
def miscHTML(dictio, x, out):
print("Writing html code for entry "+ str(x) + "...")
out.write("{/*<!-- Citation num " + str(x) + "--> */}" + "\n")
......@@ -212,7 +215,10 @@ def bookHTML(dictio, x, out):
out.write("<li typeof=\"schema:Book\" role=\"doc-biblioentry\" property=\"schema:citation\" id=\"desc-" + str(x) + "\">"+ "\n")
# out.write("\t" + "<span property=\"schema:author\" typeof=\"schema:Organisation\">"+ "\n")
print("Just a sec, separating authors...")
authors = dictio['author']
if 'author' in dictio:
authors = dictio['author']
elif 'editor' in dictio:
authors = dictio['editor']
makeauthors(authors, out)
# out.write("\t" + "\t" +"<span property=\"schema:Name\"> " + aut + "</span>."+ "\n")
# out.write("\t" +"</span>"+ "\n")
......
code/neurship.bib deleted 100644 → 0
View file @ 5e9bd3d6
1
@article{frontiers_cystic_fibrosis,
title = {Cystic Fibrosis: A Comprehensive Review},
year = 2023,
journal = {Frontiers},
url = {https://www.frontiersin.org/articles/10.3389/fimmu.2023.123456/full}
}
2
@article{cystic_fibrosis_news_today,
title = {Cystic Fibrosis: Latest Developments and Research},
year = 2023,
journal = {Cystic Fibrosis News Today},
url = {
https://cysticfibrosisnewstoday.com/2023/06/10/latest-research-on-f508del-mutation/
}
}
3
@misc{expertmarketresearch_cystic_fibrosis_market,
title = {Cystic Fibrosis Treatment Market Report},
year = 2023,
url = {
https://www.expertmarketresearch.com/reports/cystic-fibrosis-treatment-market
},
note = {Accessed: 2024-09-27}
}
4
@misc{cystic_fibrosis_news_kaftrio,
title = {Kaftrio Open to Patients 12 and Up in Europe with One F508del Mutation},
year = 2023,
url = {
https://cysticfibrosisnewstoday.com/news/kaftrio-open-patients-12-and-up-europe-one-f508del-mutation/
},
note = {Accessed: 2024-09-27}
}
5
@misc{expert_market_research_cf_market_size,
title = {Cystic Fibrosis Treatment Market Report},
year = 2023,
url = {
https://www.expertmarketresearch.com/reports/cystic-fibrosis-treatment-market
},
note = {Accessed: 2024-09-27}
}
6
@misc{cystic_fibrosis_news_today_gene_therapy,
title = {Gene Therapy for F508del Mutation: A Growing Opportunity in CF Treatment},
year = 2023,
url = {
https://cysticfibrosisnewstoday.com/2023/09/01/gene-therapy-opportunities-in-f508del-mutation-treatment/
},
note = {Accessed: 2024-09-27}
}
7
@misc{expert_market_research_growth_drivers,
title = {Cystic Fibrosis Treatment Market Report},
year = 2023,
url = {
https://www.expertmarketresearch.com/reports/cystic-fibrosis-treatment-market
},
note = {Accessed: 2024-09-27}
}
8
@article{frontiers_growth_drivers_cf,
title = {Cystic Fibrosis: A Comprehensive Review of Current and Emerging Therapies},
year = 2023,
journal = {Frontiers},
url = {https://www.frontiersin.org/articles/10.3389/fimmu.2023.123456/full}
}
9
@misc{cystic_fibrosis_news_today_rna_therapy,
title = {CFTR Modulators and the Unmet Need for 10% of Cystic Fibrosis Patients},
year = 2023,
url = {
https://cysticfibrosisnewstoday.com/news/kaftrio-open-patients-12-and-up-europe-one-f508del-mutation/
},
note = {Accessed: 2024-09-27}
}
10
@misc{cystic_fibrosis_news_today_cftr_modulators,
title = {
Vertex Pharmaceuticals and CFTR Modulators: The Gold Standard in Cystic
Fibrosis Treatment
},
year = 2023,
url = {
https://cysticfibrosisnewstoday.com/2023/06/10/kaftrio-trikafta-f508del-mutation-treatment/
},
note = {Accessed: 2024-09-27}
}
11
@misc{expert_market_research_cf_competitors,
title = {Cystic Fibrosis Treatment Market Report},
year = 2023,
url = {
https://www.expertmarketresearch.com/reports/cystic-fibrosis-treatment-market
},
note = {Accessed: 2024-09-27}
}
12
@article{frontiers_gene_therapy_competitors,
title = {
Advancements in Gene Therapy for Cystic Fibrosis: Overcoming Early Challenges
},
year = 2023,
journal = {Frontiers},
url = {https://www.frontiersin.org/articles/10.3389/fimmu.2023.123456/full}
}
13
@article{frontiers_regulatory_hurdles,
title = {Regulatory Challenges in Gene Therapy: A Focus on Cystic Fibrosis},
year = 2023,
journal = {Frontiers},
url = {https://www.frontiersin.org/articles/10.3389/fimmu.2023.123456/full}
}
14
@misc{cystic_fibrosis_news_today_regulatory_approval,
title = {Regulatory Pathways for RNA-Based Gene Therapies in Cystic Fibrosis},
year = 2023,
url = {
https://cysticfibrosisnewstoday.com/2023/05/20/rna-gene-therapy-regulatory-hurdles/
},
note = {Accessed: 2024-09-27}
}
15
@misc{expert_market_research_rnd_costs,
title = {Cystic Fibrosis Treatment Market Report},
year = 2023,
url = {
https://www.expertmarketresearch.com/reports/cystic-fibrosis-treatment-market
},
note = {Accessed: 2024-09-27}
}
16
@article{frontiers_delivery_challenges,
title = {
Challenges in RNA-Based Therapy Delivery: Focus on Lipid Nanoparticles for
Lung Targeting
},
year = 2023,
journal = {Frontiers},
url = {https://www.frontiersin.org/articles/10.3389/fimmu.2023.123456/full}
}
17
@misc{cystic_fibrosis_news_today_market_saturation,
title = {
Vertex Pharmaceuticals Dominates the CF Treatment Market: Challenges for New
Entrants
},
year = 2023,
url = {
https://cysticfibrosisnewstoday.com/2023/06/10/kaftrio-trikafta-f508del-mutation-treatment/
},
note = {Accessed: 2024-09-27}
}
18
@article{frontiers_clinical_partnerships,
title = {
The Role of Clinical Partnerships in Advancing RNA-Based Gene Therapies for
Cystic Fibrosis
},
year = 2023,
journal = {Frontiers},
url = {https://www.frontiersin.org/articles/10.3389/fimmu.2023.123456/full}
}
19
@misc{cystic_fibrosis_news_today_clinical_partnerships,
title = {
Building Clinical Partnerships for RNA-Based Gene Therapies in Cystic
Fibrosis
},
year = 2023,
url = {
https://cysticfibrosisnewstoday.com/2023/05/25/collaborations-in-cf-gene-therapy-research/
},
note = {Accessed: 2024-09-27}
}
20
@article{frontiers_early_adopters,
title = {
Targeting Early Adopters in Cystic Fibrosis Gene Therapy: A Focus on
Specialized Clinics
},
year = 2023,
journal = {Frontiers},
url = {https://www.frontiersin.org/articles/10.3389/fimmu.2023.123456/full}
}
21
@misc{expert_market_research_biotech_partnerships,
title = {Cystic Fibrosis Treatment Market Report},
year = 2023,
url = {
https://www.expertmarketresearch.com/reports/cystic-fibrosis-treatment-market
},
note = {Accessed: 2024-09-27}
}
22
@misc{cystic_fibrosis_news_today_regulatory_strategy,
title = {
Regulatory Strategy for RNA-Based Gene Therapies: Focus on Orphan Drug
Designation and Fast-Track Approvals
},
year = 2023,
url = {
https://cysticfibrosisnewstoday.com/2023/06/15/fda-fast-track-approval-cystic-fibrosis-therapies/
},
note = {Accessed: 2024-09-27}
}
23
@article{frontiers_long_term_vision,
title = {
Expanding RNA-Based Gene Therapies Beyond Cystic Fibrosis: A Modular Approach
to Treating Genetic Disorders
},
year = 2023,
journal = {Frontiers},
url = {https://www.frontiersin.org/articles/10.3389/fimmu.2023.123456/full}
}
code/output.txt deleted 100644 → 0
View file @ 5e9bd3d6
{/*<!-- Citation num 1--> */}
<li typeof="schema:ScolarlyArticle" role="doc-biblioentry" property="schema:citation" id="desc-1">
code/safety-bibtex.bib deleted 100644 → 0
View file @ 5e9bd3d6
This diff is collapsed.
index.html
View file @ 3fd292fd
......@@ -3,9 +3,8 @@
<head>
<meta charset="UTF-8" />
<link
rel="shortcut icon"
href="https://static.igem.wiki/teams/5247/logos-team/precyse-no-slogan.png"
type="image/x-icon"
rel="icon" type="image/png" sizes="32x32"
href="https://static.igem.wiki/teams/5247/logos-team/precyse-no-slogan.ico"
/>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
......
package-lock.json deleted 100644 → 0
View file @ 5e9bd3d6
This diff is collapsed.
package.json
View file @ 3fd292fd
......@@ -22,6 +22,7 @@
"@types/three": "^0.168.0",
"aos": "^2.3.4",
"beautiful-react-diagrams": "^0.5.1",
"bibtex-parser-js": "^0.0.2",
"bootstrap": "^5.3.3",
"chart.js": "^4.4.4",
"dangerously-set-html-content": "^1.1.0",
......
src/.DS_Store 0 → 100644
View file @ 3fd292fd
File added
src/App/App.css
View file @ 3fd292fd
This diff is collapsed.
src/App/App.scss
View file @ 3fd292fd
......@@ -142,10 +142,10 @@ $size: 6;
& > a {
opacity: 0;
position: absolute;
color: #000;
background-color: #000;
color: var(--offblack);
background-color: var(--offblack);
font: bold 4em "Helvetica";
$shadow: 5px #fff;
$shadow: 5px var(--ourbeige);
text-shadow: 0 -1px $shadow, -1px 0px $shadow, 0 1px $shadow,
1px 0px $shadow;
padding: 2rem;
......@@ -165,7 +165,7 @@ $size: 6;
& > div {
overflow: hidden;
position: relative;
box-shadow: 0 2px 8px 0 rgba(#000, 0.2), 0 3px 20px 0 rgba(#000, 0.19);
box-shadow: 0 2px 8px 0 rgba(var(--offblack), 0.2), 0 3px 20px 0 rgba(var(--offblack), 0.19);
}
div,
a {
......@@ -201,7 +201,7 @@ $size: 6;
.content {
max-width: 90%;
position: relative;
color: #fff;
color: var(--ourbeige);
&:hover > a.close {
opacity: 1;
transform: scale(1, 1);
......@@ -262,7 +262,7 @@ $size: 6;
opacity: 0;
transform-origin: right top;
text-decoration:none;
color:#fff;
color:var(--ourbeige);
&::after {
content: "X";
}
......@@ -332,7 +332,7 @@ $shadow: #bc15aa;
height: 100px;
line-height: 100px;
margin: auto;
color: #fff;
color: var(--ourbeige);
position: absolute;
top: 0;
bottom: 0;
......@@ -459,7 +459,7 @@ $shadow: #bc15aa;
}
i{
position: relative;
color: white;
color: var(--ourbeige);
font-size: 60px/2;
margin-top: 60px/4;
transition: all 0.25s ease;
......@@ -553,14 +553,15 @@ $shadow: #bc15aa;
max-width: 400px;
width: 90%;
margin: auto;
background: #fff;
background: var(--ourbeige);
padding: 30px;
border-style: solid;
border-width: 30px;
border-top-color: darken(#850F78, 0%);
border-right-color: darken(#850F78, 10%);
border-bottom-color: darken(#850F78, 0%);
border-left-color: darken(#850F78, 10%);
$color: "#850F78";
border-top-color: #850F78;
border-right-color: #bc15aa;
border-bottom-color: #850F78;
border-left-color: #bc15aa;
box-shadow: 2px 2px 4px rgba(0,0,0,.6);
}
.cert-frame {
......@@ -572,14 +573,14 @@ $shadow: #bc15aa;
max-width: 200px;
width: 70%;
margin: auto;
background: #fff;
background: var(--ourbeige);
padding: 10px;
border-style: solid;
border-width: 20px;
border-top-color: darken(#850F78, 0%);
border-right-color: darken(#850F78, 10%);
border-bottom-color: darken(#850F78, 0%);
border-left-color: darken(#850F78, 10%);
border-top-color:#850F78;
border-right-color: #bc15aa;
border-bottom-color: #850F78;
border-left-color: #bc15aa;
box-shadow: 2px 2px 4px rgba(0,0,0,.6);
}
......@@ -590,7 +591,7 @@ figure.snip1113 {
min-width: 220px;
max-width: 310px;
width: 80%;
background: #ffffff;
background: var(--ourbeige);
text-align: center;
}
......@@ -622,8 +623,8 @@ figure.snip1113 figcaption {
}
figure.snip1113 h3 {
background-color: #ffffff;
color: #000000;
background-color: var(--ourbeige);
color: var(--offblack);
font-size: 1.7em;
width: 100%;
padding: 5px 12px;
......
src/App/App.tsx
View file @ 3fd292fd
import { useEffect, useState } from "react";
import { useEffect } from "react";
import "./App.css";
import "./HP.css"
import "./mediarules.css"
......@@ -21,17 +21,17 @@ import { stringToSlug } from "../utils/stringToSlug.ts";
import { Villbuttonrow } from "../components/Buttons.tsx";
import "../utils/Highlight-functions.js";
import "./LoadingScreen.css";
import { useScroll, motion } from "framer-motion";
import "./calendar.css"
import { useLoading } from "../utils/LoadingContext.tsx";
const App = () => {
const { scrollYProgress } = useScroll({
offset: ["start start", "end end"],
});
const { isLoading, setIsLoading } = useLoading(); // 2. Ladezustand hier verwenden
window.scrollTo(0, 0);
const [isLoading, setIsLoading] = useState(true);
// const [isLoading, setIsLoading] = useState(true);
const pathMapping = getPathMapping();
const currentPath =
......@@ -52,7 +52,7 @@ const App = () => {
const timer = setTimeout(() => {
console.log("Hiding loading screen");
setIsLoading(false);
}, 0); // Adjust the delay as needed, Update the loading state after 3 seconds
}, 1000); // Adjust the delay as needed, Update the loading state after 3 seconds
return () => {
console.log("Cleaning up timer");
......@@ -70,10 +70,6 @@ const App = () => {
{/* Navigation */}
<Navbar />
<motion.div
className="progress-bar"
style={{ scaleX: scrollYProgress }}
/>
{/* Header and PageContent */}
<Routes>
......@@ -85,14 +81,14 @@ const App = () => {
<>
<Header />
{/* Page content */}
<div className="container-fluid">
<div className="container-fluid" >
<div className="row">
<Sidebar />
<div className="col-9">
<Sidebar/>
<div className="full-col-phone col-9 max-1240">
<Component />
<Villbuttonrow />
</div>
<div className="col-1 d-lg-block">
<div className="col-1 none d-lg-block">
{/* <!-- empty!--> */}
</div>
</div>
......
src/App/HP.css
View file @ 3fd292fd
......@@ -10,7 +10,7 @@
#under-responsive, #under-responsibility, #under-reflection{
border-radius: 10px;
color: white;
color: var(--ourbeige) ;
}
#under-reflection div, #under-responsibility div, #under-responsive div{
......
src/App/LandingPage.css
View file @ 3fd292fd
......@@ -6,12 +6,67 @@
transition: opacity 1200ms ease-out, transform 600ms ease-out,
visibility 1200ms ease-out;
will-change: opacity, visibility;
background-color: black;
background-color: var(--offblack);
}
.content-block.is-visible {
opacity: 1;
transform: none;
visibility: visible;
background-color: black;
background-color: var(--offblack);
}
.landing-page-header .row .col{
padding: 30px;
margin: auto;
justify-content: center;
}
.landing-page-header .col{
justify-content: center;
display: grid ;
}
.landing-page-header button{
background-color: var(--accent-primary);
border-radius: 10px;
padding: 10px;
width: 30vw;
}
.landing-page-header{
padding-top: 200px !important;
}
.header-button-row{
min-height: 450px;
}
/* .header-button-row .h5 {
} */
#landing-page-header-2{
margin-top: 5rem;
background-image: url("https://static.igem.wiki/teams/5247/landing-page/lp-1new-lung-two.svg") !important;
background-size: 100% auto;
background-repeat: no-repeat;
padding: 0 !important;
}
.button-x{
align-items: center;
display: flex;
align-self: center;
}
.button-x button{
margin: auto;
padding: 10px;
border-radius: 10px;
background-color: var(--text-primary);
color: var(--ourbeige)
}
\ No newline at end of file
src/App/Timelines.css
View file @ 3fd292fd
......@@ -7,10 +7,11 @@
white-space: nowrap;
min-height: 700px;
width: 75vw;
overflow-x: auto;
overflow-y: hidden;
overflow-x: auto !important;
max-width: inherit !important;
overflow-y: hidden !important;
width: 100%;
background-color: inherit;
font-size: 1rem;
/* align items center */
align-items: center !important;
/* row */
......@@ -34,7 +35,7 @@
.timeline ol li:nth-child(2n+1) .time-meta::before{
top: 100%;
left: 8px !important;
border-color: #f6faf6 transparent transparent transparent !important;
border-color: white transparent transparent transparent !important;
}
.timeline ol li:nth-child(2n+1) .moretop{
top: -40px !important;
......@@ -50,7 +51,7 @@
.timeline ol li:nth-child(2n) .time-meta::before{
top: 100%;
left: 8px !important;
border-color: transparent transparent transparent #f6faf6 !important;
border-color: transparent transparent transparent white !important;
}
.timeline ol li:nth-child(2n) .moretop{
top: 50px !important;
......@@ -85,7 +86,7 @@ background-size: 100% 120%;
.timeline ol li:nth-child(odd) .timeline-item::before {
top: 100%;
border-width: 20px 8px 0 0;
border-color: white transparent transparent transparent;
border-color: var(--ourbeige) transparent transparent transparent;
}
.timeline ol li:nth-child(even) .timeline-item::before {
top: -20px;
......@@ -127,8 +128,8 @@ background-size: 65% 120%;
padding: 15px;
font-size: 0.9rem;
white-space: normal;
color: black;
background: white;
color: var(--offblack);
background: white; /* Soll white bleiben! */
}
/* Layout for meta timeline cards */
......@@ -139,7 +140,7 @@ background-size: 65% 120%;
/* Tags */
.t-tag{
box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
color: #fff;
color: var(--ourbeige);
font-size: 12px;
font-weight: bold;
letter-spacing: 1px;
......@@ -152,37 +153,39 @@ background-size: 65% 120%;
button.tabbutton.Patient.active, button.tabbutton.All.active,
button.tabbutton.Industry.active, button.tabbutton.Academia.active,
button.tabbutton.Medical.active, .modulators.active, .inhalations.active{
border-color: black;
border-color: var(--offblack);
}
.colour-meta-tag{
background-color: var(--igemlightgreen);
}
/* and buttons */
button.tabbutton:nth-child(1){
background-color: white;
button.tabbutton:nth-child(1), button.tabbutton:nth-child(6){
background-color: white; /* soll whit ebleiben! */
}
.Patient, button.tabbutton:nth-child(2){
background-color: var(--accen-secondary);
.Patient, button.tabbutton:nth-child(2), .button.tabbutton:nth-child(7), .skin{
background-color: var(--accen-secondary) !important;
}
.Medical, button.tabbutton:nth-child(3){
.Medical, button.tabbutton:nth-child(3), .button.tabbutton:nth-child(8), .mucosa{
background-color: var(--accent-primary);
}
.Academia, .Research, button.tabbutton:nth-child(4){
.Academia, .Research, button.tabbutton:nth-child(4), button.tabbutton:nth-child(9){
background-color: var(--lightblue);
}
.Industry, button.tabbutton:nth-child(5){
background-color: var(--mediumpurple);
}
.Activist, button.tabbutton:nth-child(6){
.Activist, .Milestone{
background-color: var(--igemmediumgreen) !important;
}
.Education, .Outreach{
background-color: var(--igemlightgreen);
}
.Ethics{
.Other{
background-color: var(--offblack);
}
......@@ -223,7 +226,7 @@ button.tabbutton:nth-child(1){
.timeline-item-content {
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
border-radius: 5px;
background-color: #fff;
background-color: white; /* Soll white bleiben! */
display: flex;
flex-direction: column;
align-items: flex-end;
......@@ -239,7 +242,7 @@ button.tabbutton:nth-child(1){
/* Tags */
.timeline-item-content .tag {
color: #fff;
color: var(--ourbeige);
font-size: 12px;
font-weight: bold;
top: 5px;
......@@ -258,7 +261,7 @@ button.tabbutton:nth-child(1){
}
/* Title design */
.timeline-item-content time {
color: black;
color: var(--offblack);
font-size: 16px;
font-weight: bold;
}
......@@ -275,7 +278,7 @@ button.tabbutton:nth-child(1){
.timeline-end{
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
border-radius: 5px;
background-color: #fff;
background-color: white; /* soll white bleiben */
padding: 15px;
position: relative;
text-align: center;
......@@ -285,7 +288,7 @@ margin-top: 8vw;
.timeline-begin{
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
border-radius: 5px;
background-color: #fff;
background-color: white; /* soll white bleiben */
padding: 15px;
position: relative;
text-align: center;
......@@ -304,7 +307,7 @@ margin-bottom: 8vw;
/* Circle */
.timeline-item-content .circle {
background-color: #fff !important;
background-color: var(--ourbeige) !important;
border: 3px solid var(--text-primary);
border-radius: 50%;
position: absolute;
......@@ -327,70 +330,6 @@ z-index: 100;
/* Checken ob wir das echt brauchen */
/* .timeline ol li:not(:first-child) {
margin-left: 14px;
}
.timeline-item-content::after {
background-color: #fff;
box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.2);
position: absolute;
right: -7.5px;
top: calc(50% - 7.5px);
transform: rotate(45deg);
width: 15px;
height: 15px;
}
.timeline-item:nth-child(odd) .timeline-item-content::after {
right: auto;
left: -7.5px;
box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.2);
}
.timeline-item-content p {
font-size: 16px;
line-height: 24px;
margin: 15px 0;
}
.timeline-item-content a::after {
font-size: 12px;
}
.card {
border-radius: 4px;
background-color: #fff;
color: #333;
padding: 10px;
box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
width: 100%;
max-width: 560px;
}
.date {
background-color: var(--text-primary) !important;
padding: 4px !important;
color: #fff !important;
border-radius: 4px !important;
font-weight: 500;
font-size: .85rem;
}
.date-col{
position: relative;
background-color: #fff ;
padding: 10px;
width: 10%;
border-right: #000;
border-right-width: 2px;
}
.imageAtom{
object-fit: cover;
overflow: hidden;
width: 100%;
max-height: 400px;
}
*/
.hpbuttonrow {
display: flex; /* Flex-Layout für die untere Reihe */
......@@ -425,5 +364,19 @@ display: flex;
.timeline-item figcaption{
background-color: var(--ourbeige) !important;
}
.timeline-item figcaption, .timeline-item figure, .timeline-item figcaption h3 {
background-color: white !important;
}
.timeline-item .img-cube{
height: 120px;
max-height: 13vh;
object-fit: cover !important;
}
\ No newline at end of file
src/App/calendar.css
View file @ 3fd292fd
......@@ -34,7 +34,7 @@
}
.month ul li {
color: white !important;
color: var(--ourbeige) !important;
font-size: 20px;
text-transform: uppercase;
letter-spacing: 3px;
......@@ -42,7 +42,7 @@
}
.prev a, .next a{
color: white !important;
color: var(--ourbeige) !important;
}
.month .prev {
float: left;
......@@ -88,7 +88,7 @@
.days li .active {
padding: 5px;
background: #1abc9c;
color: white !important
color: var(--ourbeige) !important
}
/* Add media queries for smaller screens */
......
src/App/mediarules.css
View file @ 3fd292fd
......@@ -27,9 +27,6 @@
align-items: center;
}
h1 {
font-size: 2rem;
}
.col-6 {
width: 100%; /* Full width on tablets */
......@@ -50,12 +47,183 @@
max-width: 100% !important;
}
.col-6 {
width: 100%; /* Full width for smartphone */
width: 100% ;
}
.container-fluid {
min-height: 100vh; /* Füllt den gesamten Bildschirm aus */
min-height: 100vh;
}
/***heading***/
.header-title{
min-height: 400px;
text-align: center;
align-items: center;
margin: auto !important;
padding: 0 30px;
font-size: 130px;
font-weight: 900;
line-height: 130px;
}
.header-container{
padding-top: 170px !important;
padding-bottom: 0px !important;
background-color: var(--ourbeige);
}
.base {
width: 100%;
background-color: var(--lightblue);
padding: 0px;
}
/***footer***/
footer {
width: 100% !important;
box-sizing: border-box !important;
padding: 15px !important;
}
.col {
width: 100% !important;
margin-bottom: 20px;
}
.col-sm-4, .col-sm-8, .col-6 {
width: 100%;
}
footer a, footer p {
font-size: 14px;
line-height: 1.4;
}
footer .socials {
display: flex;
justify-content: center !important;
margin-bottom: 10px;
}
.contact-info {
font-size: 14px;
text-align: center;
}
.img-sponsor {
width: 100px;
height: auto;
margin: 0 auto;
}
.footer-slider {
width: 100%;
margin-top: 20px;
}
footer a {
word-wrap: break-word;
overflow-wrap: break-word;
}
hr {
margin: 20px 0;
}
/***gif***/
.CFTR-gif {
width: 1000px !important;
max-width: 100%;
height: auto;
}
/***home***/
#breatht {
font-size: 1.5em !important; /* Adjust font size for smaller screens */
text-align: left; /* Optional: center text for mobile */
}
#breathf {
left: 48vw !important;
width: 65vw !important;
}
/*#breatht1 {
left: 0 !important;
position:initial!important;
font-size: 0.5em !important;
}*/
img[src*="200k-anim-transparent-bg.gif"] {
width: 100%;
height: auto;
}
/***Biosafty***/
#safehead {
background-size: contain; /* Adjust the image to fit within the container */
background-position: center 25%; /* Push the image down for better visibility */
height: 10px; /* Adjust the height for mobile screens */
}
/***contribution***/
.timeline-item{
padding-right: 0px !important;
padding-left: 5%;
width: 50% !important;
box-sizing: content-box;
text-align: left !important;
}
.timeline-item:nth-child(odd) {
align-self: flex-end !important;
justify-content: flex-start;
padding-left: 30px;
padding-right: 0;
}
figure.snipp1113{
min-width: 0px !important ;
max-width: 120px ;
width: 100% ;
margin-left: 80px;
}
.timeline-item-content{
text-align:initial !important;
align-items: flex-end ;
padding-left: 30px;
font-display: initial !important;
display: flex;
position: inherit;
}
.timeline-item-content .tag{
padding: 0px !important;
}
/***engineering***/
.col-2{
width: 50% !important;
}
/***Description***/
.pie-chart-container-small {
width: 300px !important; /* Make smaller for mobile */
height: 300px !important; /* Adjust height accordingly */
}
.quiz-wrapper {
flex-direction: column;
padding: 10px;
width: 100% !important; /* Set width to 100% for mobile screens */
}
.quiz-front, .quiz-back {
padding: 10px !important;
}
.quiz-heading {
font-size: 1.2em;
}
.quiz-text {
font-size: 1em;
margin-bottom: 10px !important;
word-wrap: break-word; /* Keep word breaking for mobile */
}
.quiz-button-box {
margin-top: 5px !important;
justify-content: space-evenly;
}
.row-if-small{
--bs-gutter-x: 1.5rem;
--bs-gutter-y: 0;
......@@ -90,17 +258,6 @@
width: 100em !important;
max-width: 250px !important;
}
.sidebar, #eng-sidebar {
display: block; /* Sidebar wird links angezeigt */
width: 250px; /* Feste Breite für Sidebar */
position: fixed; /* Sidebar bleibt links fixiert */
height: 100%; /* Sidebar nimmt die gesamte Höhe ein */
left: 0;
top: 0;
background-color: #f8f9fa;
padding: 20px;
z-index: 1000;
}
.tag{
width: min-content !important;
......@@ -116,9 +273,6 @@
.winner{
font-size: x-large;
}
/*h3{
margin-bottom: 4vw !important;
}*/
.small-only{
display: block !important;
}
......@@ -145,7 +299,7 @@ svg text{
.village-style-button{
box-shadow: 1px 1px 1px gray;
border-radius: 10px;
border-color: black;
border-color: var(--offblack);
padding: 10px;
}
......@@ -158,27 +312,24 @@ svg text{
padding-top: 10px;
padding-bottom: 5px;
}
h1 {
font-size: 1vw !important;
line-height: 1.0 !important;
}
h2, h3 {
font-size: 24px !important;
}
.bigtitle {
width: 450px !important;
height: 200px !important;
word-wrap: break-word;
}
.framecycletab{
margin-left: 0 !important;
}
body {
padding: 10px !important;
width: 202% ;
overflow-x: hidden; /* Prevents horizontal scrolling */
/* padding: 10px !important; */
width: 202% !important;
overflow-x: hidden ; /* Prevents horizontal scrolling */
margin: 0;
padding: 0;
background-size: cover; /* Ensures the background scales to cover the entire screen */
background-position: center; /* Keeps the background centered */
background-size: cover !important; /* Ensures the background scales to cover the entire screen */
background-position: center !important; /* Keeps the background centered */
background-repeat: no-repeat;
}
......@@ -187,17 +338,34 @@ body {
max-width: 100% !important;
height: auto !important;
}
.container {
/*.container {
padding: 10px;
}
}*/
.row{
display: grid !important;
}
.full-col-phone{
width: 100vw !important;
}
}
/*For small Smartphones (iphone 13 or similars)*/
@media screen and (max-width: 400px){
.figure-wrapper:first-of-type img {
width: 100% !important; /* Full width on small screens */
height: 10% !important; /* Maintain aspect ratio */
max-width: 100% !important; /* Limit the image width to fit the screen */
margin: 0 auto; /* Center the image horizontally */
overflow: visible !important;
}
.figure-wrapper:first-of-type img{
text-align: center; /* Ensure the figure caption is centered */
}
/*For small Smartphones*/
@media screen and (max-width: 750px){
}
/* Big computer screens */
......@@ -225,6 +393,13 @@ body {
}
/***description***/
.pie-chart-container {
width: 600px; /* Set the width of the container */
height: 600px; /* Set the height of the container */
position: relative;
margin: 0 auto; /* Center the chart */
}
@media screen and (max-width: 1300px){
.one-pdf-line{
......
src/components/.DS_Store 0 → 100644
View file @ 3fd292fd
File added
src/components/BFH-Timeline.tsx
View file @ 3fd292fd
import { NoButtTimelineItem, PanelTimelineItem, TimelineItemPic, TimelineItemTwoPic } from "./VerticalTimeline";
import SimpleSlider from "./Slider";
import { ScrollLink, SupScrollLink } from "./ScrollLink";
import { useNavigation } from "../utils";
export function BFHTimeline () {
const {goToPagesAndOpenTab} = useNavigation();
return(
<>
<div className="timeline-container">
......@@ -41,11 +43,13 @@ export function BFHTimeline () {
csstag="talkonek"
vorname="Kristian"
nachname="Müller"
heading=""
text=""
heading="Gene Therapy, AAVs and Innovations in Synthetic Biology"
text="Prof. Dr. Kristian Müller from Bielefeld University reflects on his long-term involvement with the iGEM competition, emphasizing advancements in gene therapy, particularly using adeno-associated viruses (AAVs) as viral vectors for gene delivery. He discusses innovations in virus production and targeting, while acknowledging ongoing challenges such as product purity, production efficiency, and side effects. Additionally, he addresses recent developments in nanopore sequencing for quality control and the use of non-natural nucleotides and methylation to improve therapeutic outcomes."
>
<div id="talkonek" style={{display: "none"}}>
Ask Sinan
<p>Prof. Dr. Kristian Müller from Research Group Cellular and Molecular Biotechnology at the Technical Faculty of Bielefeld University, delivered an insightful presentation on the integration of AI and advanced biotechnology, focusing on the production and refinement of AAV vectors. The presentation highlighted how AI-driven innovations are transforming research methodologies, especially in areas such as AAV production, genetic targeting, and quality control. Prof. Dr. Müller showcased practical applications of AI in optimizing these biotechnological processes, making them more efficient, scalable, and precise, particularly in therapeutic applications.</p>
<p>The speaker began by drawing parallels between technological advancements in fields like space exploration and breakthroughs in genetic research, emphasizing the rapid progression within a short span of time. This context set the stage for discussing recent developments in AAV technology, where the application of AI has been pivotal. A key takeaway was how AI is being used to enhance the stability of viral vectors and optimize gene delivery, allowing for the production of high-quality AAV vectors with improved precision. Real-world examples, such as the use of AI to monitor genetic purity during nanopore sequencing and to streamline plasmid engineering processes, showcased the tangible impact of these technologies on therapeutic research. The discussion also highlighted the importance of collaborations between academia and industry, drawing parallels to the historic partnership that sparked the recombinant DNA revolution.</p>
<p>The presentation provided attendees with a deeper understanding of how AI can significantly enhance lab work, particularly in scaling up AAV production and ensuring the quality of therapeutic vectors. Participants left with valuable insights on leveraging AI and advanced technologies to drive their own research projects forward, especially in fields like gene therapy, plasmid engineering, and synthetic biology.</p>
</div>
</TimelineItemPic>
......@@ -189,9 +193,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>
......@@ -317,8 +326,8 @@ export function BFHTimeline () {
<p>
Afterwards, the attending iGEM teams talked about their science communication plans and how they could improve them
using the skills learned in this workshop. Our team revised their plans for explaining gene editing to
children and started developing experiments to help them better understand cystic fibrosis, which we
presented later onto the public at “Der Teuto ruft!” [Link], an event in Bielefeld to connect the local
children and started developing experiments to help them better understand Cystic Fibrosis, which we
presented later onto the public at <a onClick={() => goToPagesAndOpenTab("teutoruft", "human-practices")}>“Der Teuto ruft!”</a>, an event in Bielefeld to connect the local
population with regional companies and institutes to inform them about their work - including our iGEM team!
</p>
<h6>References</h6>
......@@ -482,12 +491,12 @@ export function BFHTimeline () {
heading="ChatGPT and Large Language Models"
nachname="Vaquet"
vorname="Jonas"
text="At this year's BFH Meetup, experienced slammers and FameLab [Link] participants were once again able to take
text="At this year's BFH Meetup, experienced slammers and FameLab participants were once again able to take
to the stage and present their scientific topic as simply as possible in 5 minutes. "
>
<div id="slam1" style={{display: "none"}}>
<p>With Jonas Vaquet, a
research associate of the EU project ERC Waterfutures [Link], the audience explored Large Language Models
research associate of the EU project <a href="https://waterfutures.eu/project/">ERC Waterfutures</a>, the audience explored Large Language Models
(LLMs) such as ChatGPT. The speaker humorously engaged the crowd, asking who had used such models, and
nearly all hands were raised in response. </p>
<p>The speaker introduced ChatGPT, a "Generative Pre-trained Transformer," using an interactive experiment where
......
src/components/Boxes.tsx
View file @ 3fd292fd
......@@ -57,9 +57,9 @@ export function InfoBox({title, children, id}:{title: string, children: React.Re
{title}
</p>
<div className="v-card-text">
<p>
<div>
{children}
</p>
</div>
</div>
</aside>
)
......