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 = [
{
node: <BFHpdf></BFHpdf>,
cssname: "pdf",
buttonname: "PDFs"
buttonname: "PDFs",
visibility: "block"
},
{
node: <BFHTimeline></BFHTimeline>,
cssname: "timeline",
buttonname: "Timeline"
buttonname: "Timeline",
visibility: "none"
},
{
node: <GuidePDF></GuidePDF>,
cssname: "guide",
buttonname: "Guide"
buttonname: "Guide",
visibility: "none"
},
{
node: <BFHGallery/>,
cssname: "gall",
buttonname: "Gallery"
buttonname: "Gallery",
visibility: "none"
},
{
node: <About/>,
cssname: "about",
buttonname: "About"
buttonname: "About",
visibility: "none"
},
{
node: <PosterGallery/>,
cssname: "posters",
buttonname: "Poster"
buttonname: "Poster",
visibility: "none"
}
]
......
src/contents/safety.tsx
+ 3
− 3
View file @ a5901f2a
......@@ -37,17 +37,17 @@ export function Safety() {
return (
<>
<div className="col">
<section id="obeninsafety" className="section">
<section id="RoleH" className="section">
<div id="Role"><H2 text="Role in iGem"/></div>
</section>
</div>
<div className="col">
<section className="section">
<section id="ChecksH" className="section">
<div id="Checks"><H2 text="Check-Ins"/></div>
</section>
</div>
<div className="col">
<section className="section">
<section id="LabH" className="section">
<div id="Lab"><H2 text="Our Lab"/></div>
</section>
</div>
......
src/sidebars/safeS.tsx
+ 166
− 119
View file @ a5901f2a
......@@ -3,136 +3,183 @@ import { NewHighlight, Highlight } from "../utils/Highlight-functions";
import { ScrollLink } from "../components/ScrollLink";
import { openAndCloseAndScroll } from "../utils/openAndScroll";
export function SafetySidebar() {
let numsBig = ["RoleH", "ChecksH", "LabH", "BiosafetyH", "BiosecurityH", "BioethicsH"];
let numsSub = ["BS1", "BS2"];
export function SafetySidebar(){
let numsBig = ["Role", "Checks", "Lab", "BiosafetyH", "BiosecurityH", "BioethicsH"]
let numsSub = [ "BS1", "BS2"]
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
useEffect(() => {
window.addEventListener('scroll', handleScroll);
return () => window.removeEventListener('scroll', handleScroll);
}, []);
console.log("We are looking at 'item' = " + numsSub[idx])
console.log("ind is: " + ind)
console.log("subdi is: " + subdi)
console.log("we use " + document.getElementById(item)?.id + " and " + document.getElementById(subdi)?.id)
NewHighlight({el: document.getElementById(item)!}, {subtitle: document.getElementById(subdi)!});
}
for(let idx in numsBig){
const item = numsBig[idx];
let ind = numsBig.findIndex((e) => e == item)
let subdi = "subtitle" + ind
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' = " + numsBig[idx])
console.log("ind is: " + ind)
console.log("subdi is: " + 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")
NewHighlight(
{ el: document.getElementById(item) },
{ subtitle: document.getElementById(subdi) }
);
}
/* console.log(nums) */
for (let idx in numsBig) {
const item = numsBig[idx];
let ind = numsBig.findIndex((e) => e === item);
let subdi = "subtitle" + ind;
return(
<div className="col-2 d-none d-lg-block">
<br/>
<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">
<div id="parent-Role" className="sideitem">
<summary>Role in iGem</summary>
</div>
</div>
Highlight(
{ el: document.getElementById(item) },
{ subtitle: document.getElementById(subdi) }
);
}
};
return (
<div className="col-2 d-none d-lg-block">
<br />
<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">
<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>
<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>
<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>
</div>
<div>
<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>
<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>
</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>
</div>
<div>
{/* Fznktioniert: <a onClick={openThem({it: "tab-Cystic-Fibrosis"})} > */}
<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>
<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>
{/* 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>
<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>
);
}
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