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

safety

parent 9a38522e
No related branches found
No related tags found
No related merge requests found
Pipeline #426677 passed
Stage: build
Stage: deploy
Hide whitespace changes
Inline Side-by-side
src/contents/contribution.tsx
+ 12
− 6
View file @ a5901f2a
...@@ -73,32 +73,38 @@ let tabbys = [ ...@@ -73,32 +73,38 @@ let tabbys = [
{ {
node: <BFHpdf></BFHpdf>, node: <BFHpdf></BFHpdf>,
cssname: "pdf", cssname: "pdf",
buttonname: "PDFs" buttonname: "PDFs",
visibility: "block"
}, },
{ {
node: <BFHTimeline></BFHTimeline>, node: <BFHTimeline></BFHTimeline>,
cssname: "timeline", cssname: "timeline",
buttonname: "Timeline" buttonname: "Timeline",
visibility: "none"
}, },
{ {
node: <GuidePDF></GuidePDF>, node: <GuidePDF></GuidePDF>,
cssname: "guide", cssname: "guide",
buttonname: "Guide" buttonname: "Guide",
visibility: "none"
}, },
{ {
node: <BFHGallery/>, node: <BFHGallery/>,
cssname: "gall", cssname: "gall",
buttonname: "Gallery" buttonname: "Gallery",
visibility: "none"
}, },
{ {
node: <About/>, node: <About/>,
cssname: "about", cssname: "about",
buttonname: "About" buttonname: "About",
visibility: "none"
}, },
{ {
node: <PosterGallery/>, node: <PosterGallery/>,
cssname: "posters", cssname: "posters",
buttonname: "Poster" buttonname: "Poster",
visibility: "none"
} }
] ]
......
src/contents/safety.tsx
+ 3
− 3
View file @ a5901f2a
...@@ -37,17 +37,17 @@ export function Safety() { ...@@ -37,17 +37,17 @@ export function Safety() {
return ( return (
<> <>
<div className="col"> <div className="col">
<section id="obeninsafety" className="section"> <section id="RoleH" className="section">
<div id="Role"><H2 text="Role in iGem"/></div> <div id="Role"><H2 text="Role in iGem"/></div>
</section> </section>
</div> </div>
<div className="col"> <div className="col">
<section className="section"> <section id="ChecksH" className="section">
<div id="Checks"><H2 text="Check-Ins"/></div> <div id="Checks"><H2 text="Check-Ins"/></div>
</section> </section>
</div> </div>
<div className="col"> <div className="col">
<section className="section"> <section id="LabH" className="section">
<div id="Lab"><H2 text="Our Lab"/></div> <div id="Lab"><H2 text="Our Lab"/></div>
</section> </section>
</div> </div>
......
src/sidebars/safeS.tsx
+ 166
− 119
View file @ a5901f2a
...@@ -3,136 +3,183 @@ import { NewHighlight, Highlight } from "../utils/Highlight-functions"; ...@@ -3,136 +3,183 @@ import { NewHighlight, Highlight } from "../utils/Highlight-functions";
import { ScrollLink } from "../components/ScrollLink"; import { ScrollLink } from "../components/ScrollLink";
import { openAndCloseAndScroll } from "../utils/openAndScroll"; import { openAndCloseAndScroll } from "../utils/openAndScroll";
export function SafetySidebar() {
let numsBig = ["RoleH", "ChecksH", "LabH", "BiosafetyH", "BiosecurityH", "BioethicsH"];
let numsSub = ["BS1", "BS2"];
export function SafetySidebar(){ useEffect(() => {
let numsBig = ["Role", "Checks", "Lab", "BiosafetyH", "BiosecurityH", "BioethicsH"] window.addEventListener('scroll', handleScroll);
let numsSub = [ "BS1", "BS2"] return () => window.removeEventListener('scroll', handleScroll);
useEffect(() => { }, []);
window.addEventListener('scroll', handleScroll);
return () => window.removeEventListener('scroll', handleScroll);
}, []);
const handleScroll = () => {
for(let idx in numsSub){
const item = numsSub[idx];
let ind = numsSub.findIndex((e) => e == item)
let subdi = "newsubtitle" + ind
console.log("We are looking at 'item' = " + numsSub[idx]) const handleScroll = () => {
console.log("ind is: " + ind) for (let idx in numsSub) {
console.log("subdi is: " + subdi) const item = numsSub[idx];
console.log("we use " + document.getElementById(item)?.id + " and " + document.getElementById(subdi)?.id) let ind = numsSub.findIndex((e) => e === item);
NewHighlight({el: document.getElementById(item)!}, {subtitle: document.getElementById(subdi)!}); let subdi = "newsubtitle" + ind;
}
for(let idx in numsBig){
const item = numsBig[idx];
let ind = numsBig.findIndex((e) => e == item)
let subdi = "subtitle" + ind
console.log("We are looking at 'item' = " + numsBig[idx]) NewHighlight(
console.log("ind is: " + ind) { el: document.getElementById(item) },
console.log("subdi is: " + subdi) { subtitle: document.getElementById(subdi) }
console.log("we use " + document.getElementById(item)?.id + " and " + document.getElementById(subdi)?.id) );
Highlight({el: document.getElementById(item)!}, {subtitle: document.getElementById(subdi)!});
}
console.log("function HighlightCheck")
} }
/* console.log(nums) */
for (let idx in numsBig) {
const item = numsBig[idx];
let ind = numsBig.findIndex((e) => e === item);
let subdi = "subtitle" + ind;
return( Highlight(
<div className="col-2 d-none d-lg-block"> { el: document.getElementById(item) },
<br/> { subtitle: document.getElementById(subdi) }
<div className="sticky-top"> );
<nav className="sidebar"> }
<div> };
<a onClick={openAndCloseAndScroll({ it: "tab-Role", scrollTarget: "Role", close: ["Bioethics", "Biosafety", "Biosecurity"]})}>
<div id="subtitle0" className="detail-sideitem"> return (
<div id="parent-Role" className="sideitem"> <div className="col-2 d-none d-lg-block">
<summary>Role in iGem</summary> <br />
</div> <div className="sticky-top">
</div> <nav className="sidebar">
<div>
<a
onClick={openAndCloseAndScroll({
it: "tab-Role",
scrollTarget: "Role",
close: ["Bioethics", "Biosafety", "Biosecurity"],
})}
>
<div id="subtitle0" className="detail-sideitem">
<div id="parent-Role" className="sideitem">
<summary>Role in iGem</summary>
</div>
</div>
</a>
</div>
<div>
<a
onClick={openAndCloseAndScroll({
it: "tab-Checks",
scrollTarget: "Checks",
close: ["Bioethics", "Biosafety", "Biosecurity"],
})}
>
<div id="subtitle1" className="detail-sideitem">
<div id="parent-Checks" className="sideitem">
<summary>Check-Ins</summary>
</div>
</div>
</a>
</div>
<div>
<a
onClick={openAndCloseAndScroll({
it: "tab-Lab",
scrollTarget: "Lab",
close: ["Bioethics", "Biosafety", "Biosecurity"],
})}
>
<div id="subtitle2" className="detail-sideitem">
<div id="parent-Lab" className="sideitem">
<summary>Our Lab</summary>
</div>
</div>
</a>
</div>
<div>
<div className="detail-sideitem" id="subtitle3">
<div id="parent-Biosafety" className="sideitem">
<a
onClick={openAndCloseAndScroll({
it: "tab-Biosafety",
scrollTarget: "Biosafety",
close: ["Bioethics", "Biosecurity"],
})}
>
<summary>Biosafety</summary>
</a> </a>
<span id="tab-Biosafety" className="sidesubtab" style={{ display: "none" }}>
<ul>
<li id="newsubtitle0">
<ScrollLink label="Mechanism" targetId="BS1" />
</li>
<li id="newsubtitle1">
<ScrollLink label="Delivery" targetId="BS2" />
</li>
</ul>
</span>
</div>
</div> </div>
</div>
<div>
<a onClick={openAndCloseAndScroll({ it: "tab-Checks", scrollTarget: "Checks", close: ["Bioethics", "Biosafety", "Biosecurity"] })}> <div>
<div id="subtitle1" className="detail-sideitem"> <div className="detail-sideitem" id="subtitle4">
<div id="parent-Checks" className="sideitem"> <div id="parent-Biosecurity" className="sideitem">
<summary>Check-Ins</summary> <a
</div> onClick={openAndCloseAndScroll({
</div> it: "tab-Biosecurity",
scrollTarget: "Biosecurity",
close: ["Biosafety", "Bioethics"],
})}
>
<summary>Biosecurity</summary>
</a> </a>
<span id="tab-Biosecurity" className="sidesubtab" style={{ display: "none" }}>
<ul>
<li>
<ScrollLink label="Our Project" targetId="BSec1" />
</li>
<li>
<ScrollLink label="Risk Assesment" targetId="BSec2" />
</li>
<li>
<ScrollLink label="Managing Risks" targetId="BSec3" />
</li>
</ul>
</span>
</div>
</div> </div>
<div> </div>
<a onClick={openAndCloseAndScroll({ it: "tab-Lab", scrollTarget: "Lab", close: ["Bioethics", "Biosafety", "Biosecurity"] })}>
<div id="subtitle2" className="detail-sideitem"> <div>
<div id="parent-Lab" className="sideitem"> <div className="detail-sideitem" id="subtitle5">
<summary>Our Lab</summary> <div id="parent-Bioethics" className="sideitem">
</div> <a
</div> onClick={openAndCloseAndScroll({
it: "tab-Bioethics",
scrollTarget: "Bioethics",
close: ["Biosafety", "Biosecurity"],
})}
>
<summary>Bioethics</summary>
</a> </a>
</div> <span id="tab-Bioethics" className="sidesubtab" style={{ display: "none" }}>
<div> <ul>
{/* Fznktioniert: <a onClick={openThem({it: "tab-Cystic-Fibrosis"})} > */} <li>
<div className="detail-sideitem" id="subtitle3"> <ScrollLink label="Gene Therapy" targetId="BE1" />
<div id="parent-Biosafety" className="sideitem"> </li>
<a onClick={openAndCloseAndScroll({ it: "tab-Biosafety", scrollTarget: "Biosafety", close: ["Bioethics", "Biosecurity"] })}><summary>Biosafety</summary></a> <li>
<span id="tab-Biosafety" className="sidesubtab" style={{display: "none"}}> <ScrollLink label="Primary Cells" targetId="BE2" />
<ul> </li>
<li id="newsubtitle0"><ScrollLink label="Mechanism" targetId="BS1"/></li> <li>
<li id="newsubtitle1"><ScrollLink label="Delivery" targetId="BS2"/></li> <ScrollLink label="Consent and Guidelines" targetId="BE3" />
</ul> </li>
</span> </ul>
</div> </span>
</div> </div>
</div>
<div>
{/* Fznktioniert: <a onClick={openThem({it: "tab-Cystic-Fibrosis"})} > */}
<div className="detail-sideitem" id="subtitle4">
<div id="parent-Biosecurity" className="sideitem">
<a onClick={openAndCloseAndScroll({ it: "tab-Biosecurity", scrollTarget: "Biosecurity", close: ["Biosafety", "Bioethics"]})}><summary>Biosecurity</summary></a>
<span id="tab-Biosecurity" className="sidesubtab" style={{display: "none"}}>
<ul>
<li><ScrollLink label="Our Project" targetId="BSec1"/></li>
<li><ScrollLink label="Risk Assesment" targetId="BSec2"/></li>
<li><ScrollLink label="Managing Risks" targetId="BSec3"/></li>
</ul>
</span>
</div>
</div>
</div>
<div>
<div className="detail-sideitem" id="subtitle5">
<div id="parent-Bioethics" className="sideitem">
<a onClick={openAndCloseAndScroll({ it: "tab-Bioethics", scrollTarget: "Bioethics", close: ["Biosafety", "Biosecurity"]})}><summary>Bioethics</summary></a>
<span id="tab-Bioethics" className="sidesubtab" style={{display: "none"}}>
<ul>
<li><ScrollLink label="Gene Therapy" targetId="BE1"/></li>
<li><ScrollLink label="Primary Cells" targetId="BE2"/></li>
<li><ScrollLink label="Consent and Guidelines" targetId="BE3"/></li>
</ul>
</span>
</div>
</div>
</div>
</nav>
<br/>
<div className="col" style={{display: "flex", alignItems: "right"}}>
<a href='#' className="backtotop">
Back to Top &#8593;
</a>
</div>
</div> </div>
</div>
</nav>
<br />
<div className="col" style={{ display: "flex", alignItems: "right" }}>
<a href="#" className="backtotop">
Back to Top &#8593;
</a>
</div> </div>
</div>
) </div>
);
} }
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment