Team:OUC-China/Safety

From 2014.igem.org

(Difference between revisions)
(Prototype team page)
Line 1: Line 1:
-
<!-- *** What falls between these lines is the Alert Box!  You can remove it from your pages once you have read and understood the alert *** -->
 
-
 
-
 
{{CSS/Main}}
{{CSS/Main}}
-
 
-
 
<html>
<html>
-
 
+
    <link href="https://2014.igem.org/Team:OUC-China/css/bootstrap.css?action=raw&amp;ctype=text/css" rel="stylesheet" />
-
<!--main content -->
+
    <link href="https://2014.igem.org/Team:OUC-China/css/topsection.css?action=raw&ctype=text/css" rel="stylesheet" />
-
<table width="70%" align="center">
+
    <script src="https://2014.igem.org/Team:OUC-China/js/jquery.js?action=raw&ctype=text/javascript"></script>
-
 
+
    <script src="https://2014.igem.org/Team:OUC-China/js/bootstrap.js?action=raw&ctype=text/javascript"></script>
-
 
+
    <style>
-
<!--welcome box -->
+
        body {
-
<tr>
+
            background-color: #609fd2;
-
<td style="border:1px solid black;" colspan="3" align="center" height="150px" bgColor=#FF404B>
+
            background-repeat: repeat;
-
<h1 >WELCOME TO iGEM 2014! </h1>
+
            background-image: url(https://static.igem.org/mediawiki/2014/1/19/OUC-China_Content_Background.png);
-
<p>Your team has been approved and you are ready to start the iGEM season!
+
            position: relative;
-
<br>On this page you can document your project, introduce your team members, document your progress <br> and share your iGEM experience with the rest of the world! </p>
+
        }
-
<br>
+
        header {
-
<p style="color:#E7E7E7"> <a href="https://2014.igem.org/wiki/index.php?title=Team:OUC-China/Safety&action=edit"style="color:#FFFFFF"> Click here  to edit this page!</a> </p>
+
            background-color: #609fd2;
-
</td>
+
        }
-
</tr>
+
        header > div {
-
 
+
            margin: 0 auto;
-
<tr> <td colspan="3"  height="5px"> </td></tr>
+
            margin-bottom: 0 !important;
-
<!-- end welcome box -->
+
            width: 778px;
-
<tr>  
+
        }
-
 
+
        .member > img {
-
<!--navigation menu -->
+
            width: 250px;
-
<td align="center" colspan="3">
+
            height: 250px;
-
 
+
            border: 5px solid #ffffff;
-
<table  width="100%">
+
            border-radius: 50%;
-
<tr heigth="15px"></tr>
+
            display: inline-block;
-
<tr heigth="75px">  
+
            margin: 20px;
-
 
+
            position: inherit;
-
 
+
        }
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
        .member > div {
-
<a href="https://2014.igem.org/Team:OUC-China"style="color:#000000">Home </a> </td>
+
            display: inline-block;
-
 
+
            position: relative;
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
        }
-
<a href="https://2014.igem.org/Team:OUC-China/Team"style="color:#000000"> Team </a> </td>
+
        .memberight {
-
 
+
            text-align: right;
-
<td style="border:1px solid black;" align="center"  height ="45px"  onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
        }
-
<a href="https://igem.org/Team.cgi?year=2014&team_name=OUC-China"style="color:#000000"> Official Team Profile </a></td>
+
        .nav > li > a,.nav > li.dropdown > a,.navbar .dropdown-menu>li>a, .navbar .dropdown-menu>li>a:focus {
-
 
+
            color: #ffffff !important;
-
<td style="border:1px solid black" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
            font-size: 20px;
-
<a href="https://2014.igem.org/Team:OUC-China/Project"style="color:#000000"> Project</a></td>
+
        }
-
 
+
        .popover {
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
            z-index: 1 !important;
-
<a href="https://2014.igem.org/Team:OUC-China/Parts"style="color:#000000"> Parts</a></td>
+
        }
-
 
+
        .affix{
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
            position: fixed;
-
<a href="https://2014.igem.org/Team:OUC-China/Modeling"style="color:#000000"> Modeling</a></td>
+
            top: 0;
-
 
+
        }
-
<td style="border:1px solid black;" align="center" height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>
+
        .affix-top{
-
<a href="https://2014.igem.org/Team:OUC-China/Notebook"style="color:#000000"> Notebook</a></td>
+
            position: absolute;
-
 
+
            top: 286px;
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
        }
-
<a href="https://2014.igem.org/Team:OUC-China/Safety"style=" color:#000000"> Safety </a></td>
+
        .affix a:hover, .affix-top a:hover, .affix li.active, .affix-top li.active, .affix li.active a, .affix-top li.active a {
-
 
+
            background-color: #d2e9fd !important;
-
<td style="border:1px solid black;" align="center"  height ="45px" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7>  
+
            color: #000000 !important;
-
<a href="https://2014.igem.org/Team:OUC-China/Attributions"style="color:#000000"> Attributions </a></td>
+
        }
-
 
+
        #childNavigator .nav {
-
 
+
            margin-left: 0!important;
-
<td align ="center"> <a href="https://2014.igem.org/Main_Page"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a> </td>
+
        }
-
</tr>
+
        #childNavigator > .nav > li > a {
-
</table>
+
            font-size: 16px;
-
<!--end navigation menu -->
+
        }
-
</tr>
+
        #childNavigator > .nav > li > .nav > li > a {
-
</tr>
+
            padding-left: 20%;
-
</td>
+
            font-size: 14px;
-
 
+
        }
-
<tr> <td colspan="3"  height="15px"> </td></tr>
+
        .topSection {
-
<tr><td bgColor="#e7e7e7" colspan="3" height="1px"> </tr>
+
            height: 240px;
-
<tr> <td colspan="3"  height="5px"> </td></tr>
+
            padding-top: 10px;
-
 
+
            background-color: rgb(210,233,253);
-
 
+
            margin-top: -11px;
-
<!--safety content-->
+
        }
-
<tr><td > <h3> Welcome! </h3></td>
+
        .topSection .igemLogo {
-
<td ></td >
+
            position:absolute;
-
<td > <h3> Timeline</h3></td>
+
            top: 10px;
-
</tr>
+
            left: 10px;
-
 
+
        }
-
<tr>
+
        .topSection .waveUp {
-
<td width="45%" valign="top">  
+
            margin-top: -10px;
-
<p> Visit the <a href="https://2014.igem.org/Safety" >Safety Hub</a> to see this year's safety requirements. The Safety Hub is the central page for everything related to safety in iGEM. You can also go there to learn about general biosafety topics, and how to think about the future implications of your project.</p>
+
            width: 100%;
-
 
+
            height: 110px;
-
 
+
            background: url(https://static.igem.org/mediawiki/2014/f/f0/WaveUp.png) repeat-x;
-
 
+
            z-index: 0;
-
<br>
+
        }
-
<h3> Edit this page!</h3>
+
        .topSection .waveDown {
-
<p>
+
            margin-top: -70px;
-
Please use this page to write about anything related to safety in your project. <!--Be sure to talk about both
+
            width: 100%;
-
<ul>
+
            height: 70px;
-
<li> <a href=" ">Learn about lab Safety for Today</a></li>  
+
            background: url(https://static.igem.org/mediawiki/2014/d/d0/WaveDown2.png) repeat-x;
-
<li> <a href="">Learn about Safety for the future of your project.</a></li>  
+
            z-index: 2;
-
</ul>
+
            position: relative;
-
-->
+
        }
-
</p>
+
        .topSection .leftPlas {
-
 
+
            display: block;
-
<h3> Your Lab </h3>
+
            position: absolute;
-
 
+
            top: 26px;
-
 
+
            z-index: 1;
-
<p> Use this section to tell us about your laboratory. Where is it located? What sort of equipment do you use every day? Have you decorated it for the summer? How do you look wearing a lab coat? Take pictures! Show off your space! </p>
+
            left: 211px;
-
<!--
+
            -webkit-transition: all ease 0.5s;
-
<gallery>
+
            -moz-transition: all ease 0.5s;
-
Image:Example2_Lab_1.png|The building our lab is in!
+
            -ms-transition: all ease 0.5s;
-
Image:Example2_Lab_2.png|The inside of our lab!
+
            transition: all ease 0.5s;
-
Image:Example2_Lab_3.png|Team Member 3 doing an experiment
+
        }
-
Image:Example2_Lab_4.png|Working in biosafety cabinets
+
        .topSection .leftPlas:hover {
-
Image:Example2_Lab_5.png|Team all gloved up and ready for work!
+
            margin-top: -5px;
-
Image:Example2_Lab_6.png|Equipment that we use to do SCIENCE!
+
        }
-
Image:Example2_Lab_7.png|We decorated this part of our lab
+
        .topSection .rightPlas {
-
Image:Example2_Lab_8.png|Whatever else you want
+
            display: block;
-
</gallery>-->
+
            position: absolute;
-
 
+
            top: 26px;
-
</td>
+
            z-index: 1;
-
<td></td>
+
            right: 211px;
-
 
+
        }
-
 
+
    </style>
-
<td width="45%"  valign="top">  
+
    <script>
-
 
+
        if ($('.firstHeading')) $('.firstHeading').remove();
-
 
+
    </script>
-
<ul>
+
<div class="topSection">
-
<li> <b>Now :</b>  Read the <a href="https://2014.igem.org/Safety">Safety Hub </a> and learn about safety in iGEM. Ask questions by emailing safety at <i> igem DOT org </i>. </li>
+
        <img class="igemLogo" src="https://static.igem.org/mediawiki/2014/c/c6/OUC-China_Content_IGEM.png">
-
<li><b>Now - Jamboree:</b> Complete <b>Check-Ins</b> and receive approval before acquiring and using certain materials in your lab</li>
+
        <img src="https://static.igem.org/mediawiki/2014/a/a1/OUC_China_Content_Title.png" style="display:block;margin:0 auto">
-
<li><b>Now - Wiki Freeze:</b> Edit this Safety page to tell us about what you're doing</li>
+
        <div class="waveUp"></div>
-
<li><b>June 9: </b>Submit the About Our Lab form.</li>
+
        <div class="waveDown"></div>
-
<li><b>Let us know by June 25 </b>if you will need an extension on the Preliminary Version, or your Preliminary Version will be significantly incomplete.</li>
+
        <img class="leftPlas" src="https://static.igem.org/mediawiki/2014/4/41/OUC-China_Index_Plasmid1.png" />
-
<li><b>June 30: </b>Submit the Preliminary Version of the <b>Safety Form</b>.</li>
+
        <img class="rightPlas" src="https://static.igem.org/mediawiki/2014/e/e6/OUC-China_Index_Plasmid2.png" />
-
<li>Participate in Virtual Open Office Hours to ask questions and discuss safety topics (exact date to be determined).</li>
+
    </div>
-
<li><b>September 1:</b> Submit the Final Version of the Safety Form.</li>
+
    <header>
-
<li><b>October: </b> Wiki freeze (exact date to be determined)</li>
+
        <div class="navbar navbar-inverse">
-
<li><b>October 30 - November 3: </b>GIANT JAMBOREE!</li>
+
            <div class="navbar-collapse collapse navbar-inverse-collapse">
-
 
+
                <ul class="nav navbar-nav">
-
</ul>
+
                    <li><a href="https://2014.igem.org/Team:OUC-China">HOME</a></li>
-
</td>
+
                    <li class="dropdown">
-
 
+
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">TEAM <b class="caret"></b></a>
-
</tr>
+
                        <ul class="dropdown-menu">
-
 
+
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team">Team members</a></li>
-
 
+
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Instructor">Instructor</a></li>
-
 
+
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Acknowledgment">Acknowledgment</a></li>
-
 
+
                            <li><a href="https://2014.igem.org/Team:OUC-China/Team_Lab">Lab</a></li>
-
<tr>
+
                            <li><a href="https://igem.org/Team.cgi?year=2014&team_name=OUC-China">Official team profile</a></li>
-
 
+
                        </ul>
-
 
+
                    </li>
-
 
+
                    <li class="dropdown">
-
 
+
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">PROJECT <b class="caret"></b></a>
-
 
+
                        <ul class="dropdown-menu">
-
 
+
                            <li><a href="https://2014.igem.org/Team:OUC-China/Project">Overview</a></li>
-
 
+
                            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Background">Background</a></li>
-
 
+
                            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Design">Design</a></li>
-
</table>
+
                            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Result">Result</a></li>
 +
                            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Future">Future</a></li>
 +
                            <li><a href="https://2014.igem.org/Team:OUC-China/Project_Modeling">Modeling</a></li>
 +
                        </ul>
 +
                    </li>
 +
                    <li class="dropdown">
 +
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">JUDGING <b class="caret"></b></a>
 +
                        <ul class="dropdown-menu">
 +
                            <li><a href="https://2014.igem.org/Team:OUC-China/Judging">Biobrick</a></li>
 +
                            <li><a href="https://2014.igem.org/Team:OUC-China/Judging_Achievment">Achievment</a></li>
 +
                        </ul>
 +
                    </li>
 +
                    <li class="dropdown active">
 +
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">SAFETY <b class="caret"></b></a>
 +
                        <ul class="dropdown-menu">
 +
                            <li class="active"><a href="https://2014.igem.org/Team:OUC-China/Safety">Boi safety</a></li>
 +
                            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_Lab_safety">Lab safety</a></li>
 +
                            <li><a href="https://2014.igem.org/Team:OUC-China/Safety_Policy_Practise">Policy&Practise</a></li>
 +
                        </ul>
 +
                    </li>
 +
                    <li class="dropdown">
 +
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">NOTEBOOK <b class="caret"></b></a>
 +
                        <ul class="dropdown-menu">
 +
                            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook">Lab note</a></li>
 +
                            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook_Modeling_Note">Modeling note</a></li>
 +
                            <li><a href="https://2014.igem.org/Team:OUC-China/Notebook_Protocols">Protocols</a></li>
 +
                        </ul>
 +
                    </li>
 +
                </ul>
 +
            </div>
 +
        </div>
 +
        <script>
 +
            var leftPlas = $(".topSection .leftPlas");
 +
            var originalLeft = leftPlas.offset().left;
 +
            $("header .nav > li").mouseover(function () {
 +
                if ($(this).offset().left < leftPlas.offset().left) leftPlas[0].src = "https://static.igem.org/mediawiki/2014/8/8c/ObjLeft2.png";
 +
                else leftPlas[0].src = "https://static.igem.org/mediawiki/2014/4/41/OUC-China_Index_Plasmid1.png";
 +
                leftPlas.css({ left: $(this).offset().left - 50 });
 +
            }).mouseout(function () {
 +
                leftPlas[0].src = "https://static.igem.org/mediawiki/2014/8/8c/ObjLeft2.png";
 +
                leftPlas.css({ left: originalLeft });
 +
                setTimeout(function () { leftPlas[0].src = "https://static.igem.org/mediawiki/2014/4/41/OUC-China_Index_Plasmid1.png"; }, 500);
 +
            });
 +
        </script>
 +
    </header>
 +
    <div id="mainContent" style="width:1024px;background-color:#d2e9fd;padding:10px;margin:0 auto">
 +
        <!--在这里放置文章内容-->
 +
    </div>
 +
    <script>
 +
        $(document.body).scrollspy({ target: '#childNavigator' });
 +
        $('#childNavigator').affix({ offset: { top: 285 } });
 +
    </script>
 +
<img class="anchor" onclick="document.documentElement.scrollTop = document.body.scrollTop = 0;" src="https://static.igem.org/mediawiki/2014/b/b6/ToTop.png">
</html>
</html>

Revision as of 03:43, 17 October 2014