Difference between revisions of "Team:Pasteur Paris/Experiments"

 
(18 intermediate revisions by 5 users not shown)
Line 4: Line 4:
 
     <style type="text/css">
 
     <style type="text/css">
 
         #runningchip {
 
         #runningchip {
−
             left: 245px;
+
             left: 605px;
 
         }
 
         }
 
         #labwork_small {
 
         #labwork_small {
 
             background-color: #292929;
 
             background-color: #292929;
−
        }
+
}
−
        #banner {
+
#bannerchanged{
−
            background-image: ;
+
    width: 100%;
−
        }
+
    overflow: hidden;
−
        @media screen and (max-width: 760px) {
+
    margin: 0 auto;
−
            #banner {
+
}
−
                background-image: ;
+
@media screen and (max-width: 760px) {
−
        }  
+
/*#wrapper {
−
    </style>
+
    width: 100%;
 +
    overflow: hidden;
 +
}
 +
#container {
 +
  width: 100%;
 +
    margin: 0 auto;
 +
}*/
 +
.banner-img {
 +
    width: 100%;
 +
}
 +
}
  
 +
</style>
  
−
 
+
<div id="bannerchanged">
−
    <div id="banner">
+
                <img class="banner-img" src="https://static.igem.org/mediawiki/2018/3/3e/T--Pasteur_Paris--Banner_Protocols.jpg">
−
         <h1>PROTOCOLS</h1>
+
         </div>
−
 
+
<h1></h1>
−
    </div>
+
</div>
  
 
     <div id="GeneralContent">
 
     <div id="GeneralContent">
Line 29: Line 40:
  
 
<a href="https://2018.igem.org/Team:Pasteur_Paris/Protocols/CellBio">
 
<a href="https://2018.igem.org/Team:Pasteur_Paris/Protocols/CellBio">
−
<div class="block half onglet">
+
<div class="block onglet">
−
<div class="ongletImg" style="background-image: url();">
+
<div class="ongletImg" style="background-image: url(https://static.igem.org/mediawiki/2018/c/c1/T--Pasteur_Paris--Logo-Big-Vignette-Cellular-Biology.png);">
 
</div>
 
</div>
−
<div class= "textOnglet">
+
<div class= "textOnglet" style="background-color: #dedede;">
−
<h1>Molecular Biology</h1>
+
<h1>Microbiology</h1>
 
</div>
 
</div>
 
</div>
 
</div>
 
</a>
 
</a>
 
<a href="https://2018.igem.org/Team:Pasteur_Paris/Experiments/Microflu">
 
<a href="https://2018.igem.org/Team:Pasteur_Paris/Experiments/Microflu">
−
<div class="block half onglet">
+
<div class="block onglet">
 
<div class="ongletImg" style="background-image: url(https://static.igem.org/mediawiki/2018/1/13/T--Pasteur_Paris--Logo-Big-Vignette-Microfluidics.png);">
 
<div class="ongletImg" style="background-image: url(https://static.igem.org/mediawiki/2018/1/13/T--Pasteur_Paris--Logo-Big-Vignette-Microfluidics.png);">
 
</div>
 
</div>
−
<div class= "textOnglet">
+
<div class= "textOnglet" style="background-color: #dedede;">
 
<h1>Microfluidics</h1>
 
<h1>Microfluidics</h1>
 
</div>
 
</div>
 
</div>
 
</div>
 
</a>
 
</a>
−
<a href="">
+
<a href="https://2018.igem.org/Team:Pasteur_Paris/Protocols/CellBio2">
−
<div class="block half onglet">
+
<div class="block onglet">
−
<div class="ongletImg" style="background-image: url(https://static.igem.org/mediawiki/2018/c/c1/T--Pasteur_Paris--Logo-Big-Vignette-Cellular-Biology.png);">
+
<div class="ongletImg" style="background-image: url(https://static.igem.org/mediawiki/2018/3/3c/T--Pasteur_Paris--Logo-Big-Vignette-Molecular-Biology.png);">
 
</div>
 
</div>
−
<div class= "textOnglet">
+
<div class= "textOnglet" style="background-color: #dedede;">
 
<h1>Cellular Biology</h1>
 
<h1>Cellular Biology</h1>
 
</div>
 
</div>
Line 57: Line 68:
  
  
 +
<a href="https://2018.igem.org/Team:Pasteur_Paris/Technicals">
 +
<div class="block onglet">
 +
<div class="ongletImg" style="background-image: url(https://static.igem.org/mediawiki/2018/e/ed/T--Pasteur_Paris--Big-Vignette-Design.png);">
 +
</div>
 +
<div class= "textOnglet" style="background-color: #dedede;">
 +
<h1>Design*</h1>
 +
</div>
 +
                        </a>
 +
</div>
  
  
−
       
+
            <p> (*) There are not really protocols in design, but rather methodologies. You will be redirected to Product Design - Methodology. </p>
−
        <div class="block separator-mark">
+
−
        </div>
+
−
       
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
       
+
−
      <script>
+
−
 
+
−
        /*panels and vignettes flexbox automatic order*/
+
−
 
+
−
        function redim() {
+
−
            if("matchMedia" in window) {
+
−
                var vign_lis = document.getElementsByClassName("vignette");
+
−
                var pan_lis = document.getElementsByClassName("panel");
+
−
                var i;
+
−
                if(window.matchMedia("(min-width:850px)").matches) {
+
−
                    /*big*/
+
−
                    for (i = 0; i < vign_lis.length; i++) {
+
−
                        var act_vign = vign_lis[i];
+
−
                        var act_pan = pan_lis[i];
+
−
                        var index = String(act_vign.id).substring(7,9);
+
−
                        switch (index) {
+
−
                            case '00':
+
−
                                act_vign.style.order="3";
+
−
                                act_pan.style.order="6" ;
+
−
                                break;
+
−
                            case '01':
+
−
                                act_vign.style.order="4";
+
−
                                act_pan.style.order="7";
+
−
                                break;
+
−
                            case '02':
+
−
                                act_vign.style.order="5";
+
−
                                act_pan.style.order="8";
+
−
                                break;
+
−
                            case '03':
+
−
                                act_vign.style.order="9";
+
−
                                act_pan.style.order="12"; 
+
−
                                break;
+
−
                            case '04':
+
−
                                act_vign.style.order="10";
+
−
                                act_pan.style.order="13";
+
−
                                break;
+
−
                            case '05':
+
−
                                act_vign.style.order="11";
+
−
                                act_pan.style.order="14";
+
−
                                break;
+
−
                            case '06':
+
−
                                act_vign.style.order="15";
+
−
                                act_pan.style.order="18";
+
−
                                break; 
+
−
                            case '07':
+
−
                                act_vign.style.order="16";
+
−
                                act_pan.style.order="19";
+
−
                                break;                       
+
−
                        }
+
−
                    }
+
−
                } else if (window.matchMedia("(max-width:760px)").matches) {
+
−
                    /* very small*/
+
−
                    for (i = 0; i < vign_lis.length; i++) {
+
−
                        var act_vign = vign_lis[i];
+
−
                        var act_pan = pan_lis[i];
+
−
                        var index = String(act_vign.id).substring(7,9);
+
−
                        switch (index) {
+
−
                            case '00':
+
−
                                act_vign.style.order="3";
+
−
                                act_pan.style.order="4" ;
+
−
                                break;
+
−
                            case '01':
+
−
                                act_vign.style.order="5";
+
−
                                act_pan.style.order="6";
+
−
                                break;
+
−
                            case '02':
+
−
                                act_vign.style.order="7";
+
−
                                act_pan.style.order="8";
+
−
                                break;
+
−
                            case '03':
+
−
                                act_vign.style.order="9";
+
−
                                act_pan.style.order="10";
+
−
                                break;
+
−
                            case '04':
+
−
                                act_vign.style.order="11";
+
−
                                act_pan.style.order="12";
+
−
                                break;
+
−
                            case '05':
+
−
                                act_vign.style.order="12";
+
−
                                act_pan.style.order="13";
+
−
                                break;
+
−
                            case '06':
+
−
                                act_vign.style.order="14";
+
−
                                act_pan.style.order="15"; 
+
−
                                break; 
+
−
                            case '07':
+
−
                                act_vign.style.order="16";
+
−
                                act_pan.style.order="17";
+
−
                                break;                             
+
−
                        }
+
−
                    }   
+
−
                } else {
+
−
                    /*small*/
+
−
                    for (i = 0; i < vign_lis.length; i++) {
+
−
                        var act_vign = vign_lis[i];
+
−
                        var act_pan = pan_lis[i];
+
−
                        var index = String(act_vign.id).substring(7,9);
+
−
                        switch (index) {
+
−
                            case '00':
+
−
                                act_vign.style.order="3";
+
−
                                act_pan.style.order="5" ;
+
−
                                break;
+
−
                            case '01':
+
−
                                act_vign.style.order="4";
+
−
                                act_pan.style.order="6";
+
−
                                break;
+
−
                            case '02':
+
−
                                act_vign.style.order="7";
+
−
                                act_pan.style.order="9";
+
−
                                break;
+
−
                            case '03':
+
−
                                act_vign.style.order="8";
+
−
                                act_pan.style.order="10";
+
−
                                break;
+
−
                            case '04':
+
−
                                act_vign.style.order="11";
+
−
                                act_pan.style.order="13";
+
−
                                break;
+
−
                            case '05':
+
−
                                act_vign.style.order="12";
+
−
                                act_pan.style.order="14";
+
−
                                break;
+
−
                            case '06':
+
−
                                act_vign.style.order="15";
+
−
                                act_pan.style.order="17";
+
−
                                break; 
+
−
                            case '07':
+
−
                                act_vign.style.order="16";
+
−
                                act_pan.style.order="18";
+
−
                                break;                             
+
−
                        }
+
−
                    }
+
−
                }
+
−
            }
+
−
        }
+
−
 
+
−
        window.addEventListener('resize', redim, false);
+
−
 
+
−
        redim();
+
−
 
+
−
        </script>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
        <script>
+
−
 
+
−
        /*close buttons*/
+
−
 
+
−
                var acc = document.getElementsByClassName("close_button");
+
−
 
+
−
                for (i = 0; i < acc.length; i++) {
+
−
                    acc[i].addEventListener("click", function() {
+
−
                        var panel = this.parentElement;
+
−
                        var index = String(panel.id).substring(4,8);
+
−
                        var vignBack = document.getElementById("back_"+index);
+
−
                        var vignFor = vignBack.previousElementSibling;
+
−
                        var vignText = vignBack.nextElementSibling;
+
−
                        panel.style.maxHeight = null;
+
−
                        vignFor.style.opacity = 1;
+
−
                        vignText.style.opacity = 0.8;
+
−
                        vignText.style.top = "4em";
+
−
                    });
+
−
                }
+
−
 
+
−
 
+
−
        </script>
+
−
 
+
−
 
+
  
  

Latest revision as of 03:48, 18 October 2018

""

Microbiology

Microfluidics

Cellular Biology

Design*

(*) There are not really protocols in design, but rather methodologies. You will be redirected to Product Design - Methodology.