Sophia wth (Talk | contribs) (Replaced content with "{{IGEM_TopBar}} {{NDNF_China}} <html> </html>") |
Evelyn-Rui (Talk | contribs) |
||
Line 1: | Line 1: | ||
− | |||
{{NDNF_China}} | {{NDNF_China}} | ||
+ | {{NDNF China/Nav}} | ||
<html> | <html> | ||
+ | <head> | ||
+ | <meta charset="UTF-8"> | ||
+ | <style type="text/css"> | ||
+ | |||
+ | @font-face { | ||
+ | font-family: 'Mango'; | ||
+ | src: url("https://static.igem.org/mediawiki/2021/8/87/T--NDNF_China--font--cute.otf"); | ||
+ | } | ||
+ | @font-face { | ||
+ | font-family: 'Sary-Soft-6'; | ||
+ | src:url("https://static.igem.org/mediawiki/2021/9/91/T--NDNF_China--font--Sary-Soft-6.otf"); | ||
+ | } | ||
+ | |||
+ | @font-face { | ||
+ | font-family: 'Sary-Soft-Light-3'; | ||
+ | src:url("https://static.igem.org/mediawiki/2021/f/f2/T--NDNF_China--font--Sary-Soft-Light-3_%282%29.otf"); | ||
+ | } | ||
+ | |||
+ | .videooo{ | ||
+ | width:100%; | ||
+ | position:absolute; | ||
+ | position:fixed; | ||
+ | z-index:001; | ||
+ | } | ||
+ | |||
+ | .intro2{ | ||
+ | height:138rem; | ||
+ | width:80%; | ||
+ | left:0rem; | ||
+ | position:absolute; | ||
+ | top:41rem; | ||
+ | background-color:white; | ||
+ | z-index:003; | ||
+ | } | ||
+ | |||
+ | .intro1{ | ||
+ | height:138rem; | ||
+ | width:20%; | ||
+ | right:0rem; | ||
+ | position:absolute; | ||
+ | top:41rem; | ||
+ | background-color:#E3E0F1; | ||
+ | background-image: linear-gradient(to bottom, #E3E0F1 50%, #D1E9F3 100%); | ||
+ | z-index:003; | ||
+ | } | ||
+ | |||
+ | .div{ | ||
+ | padding-left:5rem; | ||
+ | text-align:justify; | ||
+ | position:relative; | ||
+ | padding-top:6rem; | ||
+ | left:3.6rem; | ||
+ | width:48rem; | ||
+ | } | ||
+ | |||
+ | h2,h3{ | ||
+ | font-family:Mango; | ||
+ | color:#333333; | ||
+ | font-weight:bold; | ||
+ | } | ||
+ | |||
+ | h2{ | ||
+ | font-size:30px; | ||
+ | position:relative; | ||
+ | color:#536998; | ||
+ | } | ||
+ | |||
+ | h3{ | ||
+ | font-size:25px; | ||
+ | color:#92C2E8; | ||
+ | } | ||
+ | |||
+ | .icon{ | ||
+ | width:2.5rem; | ||
+ | position:absolute; | ||
+ | left:2.5%; | ||
+ | display:inline-block; | ||
+ | } | ||
+ | |||
+ | .tu1{ | ||
+ | position:relative; | ||
+ | left:2.5rem; | ||
+ | top:2.5rem; | ||
+ | height:15.625rem; | ||
+ | } | ||
+ | |||
+ | .tu2{ | ||
+ | position:relative; | ||
+ | height:15.625rem; | ||
+ | top:2.5rem; | ||
+ | left:9.375rem; | ||
+ | } | ||
+ | |||
+ | li{ | ||
+ | list-style: none; | ||
+ | margin: 0; | ||
+ | vertical-align: top; | ||
+ | } | ||
+ | ul{ | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | .directory-nav{ | ||
+ | position: fixed; | ||
+ | right:0px; | ||
+ | width:12.5rem; | ||
+ | bottom:5rem; | ||
+ | padding: 0.75rem 0 1.25rem 2rem; | ||
+ | display: none; | ||
+ | z-index:006; | ||
+ | } | ||
+ | .directory-nav li{ | ||
+ | height:2.125rem; | ||
+ | line-height:2.125rem; | ||
+ | position: relative; | ||
+ | } | ||
+ | .directory-nav li a{ | ||
+ | text-decoration:none; | ||
+ | } | ||
+ | .directory-nav .l1{ | ||
+ | } | ||
+ | .directory-nav .l2{ | ||
+ | text-indent:0.6rem; | ||
+ | } | ||
+ | .directory-nav .l1 a{ | ||
+ | font-size: 16px; | ||
+ | font-family: Sary-Soft-Light-3 | ||
+ | } | ||
+ | .directory-nav .l2 a{ | ||
+ | font-size: 14px; | ||
+ | font-family: Sary-Soft-Light-3 | ||
+ | } | ||
+ | .directory-nav,.directory-nav a{ | ||
+ | color:#333333; | ||
+ | } | ||
+ | .directory-nav .cur a{ | ||
+ | color:#483D8B; | ||
+ | font-weight:bold; | ||
+ | } | ||
+ | .directory-nav .line{ | ||
+ | position: absolute; | ||
+ | left:4px; | ||
+ | top: 5px; | ||
+ | bottom: 5px; | ||
+ | z-index: 1; | ||
+ | width: 2px; | ||
+ | background: #ddd; | ||
+ | } | ||
+ | .directory-nav .c-top,.directory-nav .c-bottom{ | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | z-index: 2; | ||
+ | display: block; | ||
+ | width: 10px; | ||
+ | height: 10px; | ||
+ | font-size: 0; | ||
+ | line-height: 0; | ||
+ | background: url(https://static.igem.org/mediawiki/2021/a/ac/T--NDNF_China--directory-nav2.png) no-repeat 0 -69px; | ||
+ | } | ||
+ | .directory-nav .c-dot{ | ||
+ | position: absolute; | ||
+ | left:-32px; | ||
+ | top: 50%; | ||
+ | z-index: 2; | ||
+ | margin-top:-5px; | ||
+ | display: block; | ||
+ | width: 10px; | ||
+ | height: 10px; | ||
+ | font-size: 0; | ||
+ | line-height: 0; | ||
+ | background: url(https://static.igem.org/mediawiki/2021/1/11/T--NDNF_China--directory-nav3.png) no-repeat -275px 0; | ||
+ | } | ||
+ | .directory-nav .c-top{ | ||
+ | top: 0; | ||
+ | } | ||
+ | .directory-nav .c-bottom{ | ||
+ | bottom: 0; | ||
+ | } | ||
+ | .directory-nav .cur-tag{ | ||
+ | position: absolute; | ||
+ | left: -1px; | ||
+ | top:30px; | ||
+ | z-index: 5; | ||
+ | margin-top: -6px; | ||
+ | display: block; | ||
+ | width: 19px; | ||
+ | height: 13px; | ||
+ | font-size: 0; | ||
+ | line-height: 0; | ||
+ | background: url(https://static.igem.org/mediawiki/2021/3/30/T--NDNF_China--directory-nav.png) no-repeat -271px -37px; | ||
+ | -webkit-transition:top 0s ease 0s; | ||
+ | transition:top 0s ease 0s; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | |||
+ | <div class="videooo"> | ||
+ | <video width="100%" src="https://static.igem.org/mediawiki/2021/8/86/T--NDNF_China--Integrated hp.mp4" autoplay muted loop></video> | ||
+ | </div> | ||
+ | |||
+ | <div class="intro1"></div> | ||
+ | |||
+ | <div class="intro2"> | ||
+ | <div class="div" style="padding-top:2rem;"> | ||
+ | <h2 style="display:inline-block;">General Lab Safety</h2> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/0/0b/T--NDNF_China--iconfv1.png" class="icon"> | ||
+ | |||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">Given the importance of laboratory safety, we have received training from Bluepha Lab on standard experimental procedures and common operation rules of bio-lab including the prohibition actions in the lab, the emergency safety measures, laboratory fire safety, the storage and use of hazardous chemicals, the disposal of laboratory waste, the daily management of the laboratory, and the notes for the use of laboratory instruments. In addition, each of us was given a laboratory notebook informing us on some basic experiment protocols. Furthermore, each team member had to pass the test of Safety Operating Rules for BSL-1 laboratories, which ensured we were all familiar with what we had previously been taught.</p> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/a/a5/T--NDNF_China--Safety_Laboratory_Notebook.jpg" class="tu1"> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/7/72/T--NDNF_China--Safety_Education.png" class="tu2"> | ||
+ | </div> | ||
+ | |||
+ | <div class="div"> | ||
+ | <h2 style="display:inline-block;">Specific Safety Rules</h2> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/1/13/T--NDNF_China--iconfv2.png" class="icon"> | ||
+ | |||
+ | <h3>Appropriate clothing</h3> | ||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">- Wear at least one layer of rubber gloves, and if necessary, wear a layer of PE gloves, such as while operating some contaminated reagents.</p> | ||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">- Wear lab coats, no rolling up of sleeves.</p> | ||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">- Wear below-knee-pants or skirts and shoes that don't expose skin.</p> | ||
+ | <br> | ||
+ | <h3>Electric safety</h3> | ||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">- Do not touch plugs with wet gloves or hands.</p> | ||
+ | <br> | ||
+ | <h3>Hazardous chemicals</h3> | ||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">All dangerous chemicals in the laboratory are stored in safety cabinets. If we need to use dangerous chemicals, we must ask the instructor and use them under guidance and supervision of the instructor.</p> | ||
+ | <br> | ||
+ | <h3>Emergencies</h3> | ||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">We have learned some basic first aid measures for burns, glass cuts or other mechanical scratches, chemical burns, and electric shock. In addition, in case of emergency, we can ask teachers in the laboratory for help.</p> | ||
+ | </div> | ||
+ | |||
+ | <div class="div"> | ||
+ | <h2 style="display:inline-block;">Safe Organism</h2> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/1/17/T--NDNF_China--iconfv3.png" class="icon"> | ||
+ | |||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">In our experiments, we only used E.coli (BL21) (DH5α) (Top 10),Yeast, and B.subtilis (ATCC14580). Despite the fact that they may be responsible for a range of diseases (namely bacterial infections), normal contact, both within and beyond laboratory conditions, would unlikely lead to noticeable afflictions.</p> | ||
+ | </div> | ||
+ | |||
+ | <div class="div"> | ||
+ | <h2 style="display:inline-block;">Specific Safety Problems</h2> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/7/7a/T--NDNF_China--iconfv4.png" class="icon"> | ||
+ | |||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">During preparation of the hydrogel material, we used mercuric nitrate, acrylamide and TEMED, all of which are toxic. So, in relevant experimental procedures, we strictly abided by the laboratory’s dress requirements such as wearing protective gloves and masks all the time to fully prevent exposure to toxins, and carried out the experiments in a well-ventilated environment. Furthermore, we strictly followed the safety rules, and avoided contamination of clean areas by restricting handling of the above chemicals to a specified zone.</p> | ||
+ | <p style="font-size:17px;font-family:Sary-Soft-6">Our team instructors, who have rich experimental experiences and are well educated, also supervised us when we conducted experiments that involved toxic materials, and gave us necessary instructions to prevent accidents.</p> | ||
+ | </div> | ||
+ | |||
+ | <div class="div"> | ||
+ | <h2 style="display:inline-block;">COVID Precautions</h2> | ||
+ | <img src="https://static.igem.org/mediawiki/2021/a/a9/T--NDNF_China--iconfv5.png" class="icon"> | ||
+ | |||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">Our temperature was taken before we entered the building and we also scanned a QR code using "Health Kit" (a WeChat Mini-program that can record your visit to certain public places). We were also asked to wear our masks all the time when we were in the lab, as it is also corresponded to the national and regional pandemic policy.</p> | ||
+ | <p style="font-size:18px;font-family:Sary-Soft-6">After a small outbreak in Beijing, only one student could go to the lab per week. Negative COVID test result and letter of assurance signed by parents was also required.</p> | ||
+ | </div> | ||
+ | </div> | ||
+ | |||
+ | <div class="footer"> | ||
+ | <img style="top:177rem;position:absolute;height:7.75rem;width:100%;z-index:003;" src="https://static.igem.org/mediawiki/2021/d/d8/T--NDNF_China--footerff.png"> | ||
+ | </div> | ||
+ | |||
+ | <script src="https://2021.igem.org/Team:NDNF_China/js2"></script> | ||
+ | <script> | ||
+ | |||
+ | function DirectoryNav($h,config){ | ||
+ | this.opts = $.extend(true,{ | ||
+ | scrollThreshold:0.3, | ||
+ | scrollSpeed:500, | ||
+ | scrollTopBorder:400, | ||
+ | easing: 'swing', | ||
+ | delayDetection:200, | ||
+ | scrollChange:function(){} | ||
+ | },config); | ||
+ | this.$win = $(window); | ||
+ | this.$h = $h; | ||
+ | this.$pageNavList = ""; | ||
+ | this.$pageNavListLis =""; | ||
+ | this.$curTag = ""; | ||
+ | this.$pageNavListLiH = ""; | ||
+ | this.offArr = []; | ||
+ | this.curIndex = 0; | ||
+ | this.scrollIng = false; | ||
+ | this.init(); | ||
+ | } | ||
+ | |||
+ | DirectoryNav.prototype = { | ||
+ | init:function(){ | ||
+ | this.make(); | ||
+ | this.setArr(); | ||
+ | this.bindEvent(); | ||
+ | }, | ||
+ | make:function(){ | ||
+ | $("body").append('<div class="directory-nav" id="directoryNav"><ul></ul><span class="cur-tag"></span><span class="c-top"></span><span class="c-bottom"></span><span class="line"></span></div>>'); | ||
+ | var $hs = this.$h, | ||
+ | $directoryNav = $("#directoryNav"), | ||
+ | temp = [], | ||
+ | index1 = 0, | ||
+ | index2 = 0; | ||
+ | $hs.each(function(index){ | ||
+ | var $this = $(this), | ||
+ | text = $this.text(); | ||
+ | if(this.tagName.toLowerCase()=='h2'){ | ||
+ | index1++; | ||
+ | if(index1%2==0) index2 = 0; | ||
+ | temp.push('<li class="l1"><span class="c-dot"></span>'+index1+'. <a class="l1-text">'+text+'</a></li>'); | ||
+ | }else{ | ||
+ | index2++; | ||
+ | temp.push('<li class="l2">'+index1+'.'+index2+' <a class="l2-text">'+text+'</a></li>'); | ||
+ | |||
+ | } | ||
+ | }); | ||
+ | $directoryNav.find("ul").html(temp.join("")); | ||
+ | |||
+ | this.$pageNavList = $directoryNav; | ||
+ | this.$pageNavListLis = this.$pageNavList.find("li"); | ||
+ | this.$curTag = this.$pageNavList.find(".cur-tag"); | ||
+ | this.$pageNavListLiH = this.$pageNavListLis.eq(0).height(); | ||
+ | |||
+ | if(!this.opts.scrollTopBorder){ | ||
+ | this.$pageNavList.show(); | ||
+ | } | ||
+ | }, | ||
+ | setArr:function(){ | ||
+ | var This = this; | ||
+ | this.$h.each(function(){ | ||
+ | var $this = $(this), | ||
+ | offT = Math.round($this.offset().top); | ||
+ | This.offArr.push(offT); | ||
+ | }); | ||
+ | }, | ||
+ | posTag:function(top){ | ||
+ | this.$curTag.css({top:top+'px'}); | ||
+ | }, | ||
+ | ifPos:function(st){ | ||
+ | var offArr = this.offArr; | ||
+ | //console.log(st); | ||
+ | var windowHeight = Math.round(this.$win.height() * this.opts.scrollThreshold); | ||
+ | for(var i=0;i<offArr.length;i++){ | ||
+ | if((offArr[i] - windowHeight) < st) { | ||
+ | var $curLi = this.$pageNavListLis.eq(i), | ||
+ | tagTop = $curLi.position().top; | ||
+ | $curLi.addClass("cur").siblings("li").removeClass("cur"); | ||
+ | this.curIndex = i; | ||
+ | this.posTag(tagTop+this.$pageNavListLiH*0.5); | ||
+ | //this.curIndex = this.$pageNavListLis.filter(".cur").index(); | ||
+ | this.opts.scrollChange.call(this); | ||
+ | } | ||
+ | } | ||
+ | }, | ||
+ | bindEvent:function(){ | ||
+ | var This = this, | ||
+ | show = false, | ||
+ | timer = 0; | ||
+ | this.$win.on("scroll",function(){ | ||
+ | var $this = $(this); | ||
+ | clearTimeout(timer); | ||
+ | timer = setTimeout(function(){ | ||
+ | This.scrollIng = true; | ||
+ | if($this.scrollTop()>This.opts.scrollTopBorder){ | ||
+ | if(!This.$pageNavListLiH) This.$pageNavListLiH = This.$pageNavListLis.eq(0).height(); | ||
+ | if(!show){ | ||
+ | This.$pageNavList.fadeIn(); | ||
+ | show = true; | ||
+ | } | ||
+ | This.ifPos( $(this).scrollTop() ); | ||
+ | }else{ | ||
+ | if(show){ | ||
+ | This.$pageNavList.fadeOut(); | ||
+ | show = false; | ||
+ | } | ||
+ | } | ||
+ | },This.opts.delayDetection); | ||
+ | }); | ||
+ | |||
+ | this.$pageNavList.on("click","li",function(){ | ||
+ | var $this = $(this), | ||
+ | index = $this.index(); | ||
+ | This.scrollTo(This.offArr[index]); | ||
+ | }) | ||
+ | }, | ||
+ | scrollTo: function(offset,callback) { | ||
+ | var This = this; | ||
+ | $('html,body').animate({ | ||
+ | scrollTop: offset - 130 | ||
+ | }, this.opts.scrollSpeed, this.opts.easing, function(){ | ||
+ | This.scrollIng = false; | ||
+ | if (callback){ | ||
+ | if (this.tagName.toLowerCase()=='body'){ | ||
+ | callback(); | ||
+ | } | ||
+ | } | ||
+ | }); | ||
+ | } | ||
+ | }; | ||
+ | |||
+ | var directoryNav = new DirectoryNav($("h2,h3"),{ | ||
+ | scrollTopBorder:400 | ||
+ | }); | ||
+ | |||
+ | </script> | ||
+ | </body> | ||
</html> | </html> |
Revision as of 07:34, 8 October 2021
General Lab Safety
Given the importance of laboratory safety, we have received training from Bluepha Lab on standard experimental procedures and common operation rules of bio-lab including the prohibition actions in the lab, the emergency safety measures, laboratory fire safety, the storage and use of hazardous chemicals, the disposal of laboratory waste, the daily management of the laboratory, and the notes for the use of laboratory instruments. In addition, each of us was given a laboratory notebook informing us on some basic experiment protocols. Furthermore, each team member had to pass the test of Safety Operating Rules for BSL-1 laboratories, which ensured we were all familiar with what we had previously been taught.
Specific Safety Rules
Appropriate clothing
- Wear at least one layer of rubber gloves, and if necessary, wear a layer of PE gloves, such as while operating some contaminated reagents.
- Wear lab coats, no rolling up of sleeves.
- Wear below-knee-pants or skirts and shoes that don't expose skin.
Electric safety
- Do not touch plugs with wet gloves or hands.
Hazardous chemicals
All dangerous chemicals in the laboratory are stored in safety cabinets. If we need to use dangerous chemicals, we must ask the instructor and use them under guidance and supervision of the instructor.
Emergencies
We have learned some basic first aid measures for burns, glass cuts or other mechanical scratches, chemical burns, and electric shock. In addition, in case of emergency, we can ask teachers in the laboratory for help.
Safe Organism
In our experiments, we only used E.coli (BL21) (DH5α) (Top 10),Yeast, and B.subtilis (ATCC14580). Despite the fact that they may be responsible for a range of diseases (namely bacterial infections), normal contact, both within and beyond laboratory conditions, would unlikely lead to noticeable afflictions.
Specific Safety Problems
During preparation of the hydrogel material, we used mercuric nitrate, acrylamide and TEMED, all of which are toxic. So, in relevant experimental procedures, we strictly abided by the laboratory’s dress requirements such as wearing protective gloves and masks all the time to fully prevent exposure to toxins, and carried out the experiments in a well-ventilated environment. Furthermore, we strictly followed the safety rules, and avoided contamination of clean areas by restricting handling of the above chemicals to a specified zone.
Our team instructors, who have rich experimental experiences and are well educated, also supervised us when we conducted experiments that involved toxic materials, and gave us necessary instructions to prevent accidents.
COVID Precautions
Our temperature was taken before we entered the building and we also scanned a QR code using "Health Kit" (a WeChat Mini-program that can record your visit to certain public places). We were also asked to wear our masks all the time when we were in the lab, as it is also corresponded to the national and regional pandemic policy.
After a small outbreak in Beijing, only one student could go to the lab per week. Negative COVID test result and letter of assurance signed by parents was also required.