Difference between revisions of "Team:Imperial College/Results"

(Blanked the page)
 
(8 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{:Team:Imperial_College/Templates/NavBar}}
 
  
 
<html>
 
<head>
 
<style>
 
 
#expt1, #expt2, #expt3, #expt4, #expt5, #expt6 #expt7 {
 
    width:100%;
 
    height:5px;
 
 
}
 
 
.contents ul{
 
    width:40%;
 
    margin-top:5%;
 
    float:left;
 
    box-sizing: border-box;
 
    margin-left:6.666%;
 
    list-style-type: none;
 
    background:none;
 
}
 
 
.contents ul li{
 
    width: 100%;
 
    margin-bottom:5%;
 
    cursor: pointer;
 
    border-radius:20px;
 
    background:none;
 
    transition: border 0.3s ease;
 
    box-sizing:border-box;
 
}
 
 
.contents ul li a{
 
    padding-top: 5px;
 
    padding-bottom: 0px;
 
    margin-top: 10px;
 
    margin-left: 0px;
 
    text-decoration: none;
 
    font-size: 30px;
 
    font-family: 'Varela Round', sans-serif;
 
    color: #374785;
 
    border:none;
 
    background:none;
 
 
 
}
 
 
.contents ul li a:hover{
 
    font-weight:bold;
 
}
 
 
 
 
.allButton {
 
    font-size: 30px;
 
    color: #374785;
 
    font-family: "Varela Round", sans-serif;
 
    font-weight:normal;
 
    background-color:none;
 
   
 
}
 
 
.open{
 
    float:right;
 
    width:auto;
 
    box-sizing: border-box;
 
    margin-top:20px;
 
    margin-right:10%;
 
    font-size:30px;
 
    font-family:"Varela Round", sans-serif;
 
    color:#374785;
 
}
 
 
.expandButton:hover {
 
    cursor:pointer;
 
    background-color:red;
 
    color:#F76C6C;
 
}
 
 
 
.accordion {
 
    float: left;
 
    padding-top: 5px;
 
    margin-bottom:5px;
 
    margin-left:10%;
 
    cursor: pointer;
 
    text-align:left;
 
    margin-left:20%;
 
    border:none;
 
    transition: border-bottom 0.1s linear;
 
    font-size: 25px;
 
    font-weight:bold;
 
    line-height: 50px;
 
    font-family:"Varela Round", sans-serif;
 
    color:#374785;
 
}
 
 
 
.accordion:hover {
 
    border-bottom: solid #F8E9A1 3px;
 
}
 
 
 
 
.description {
 
    margin-bottom:5px;
 
    width: 70%;
 
    margin-left:23%;
 
    float:left;
 
    border:none;
 
    max-height: auto;
 
}
 
 
.colorChange{
 
    transition: color 0.5s ease;
 
}
 
 
 
 
.highlight{
 
    color:#374785;
 
    font-weight:bold;
 
    text-decoration:none;
 
}
 
 
.figure{
 
    width: 30%;
 
    margin-top:5px;
 
    margin-left:35%;
 
    box-sizing: border-box;
 
}
 
 
</style>
 
 
</head>
 
 
<body>
 
<div class="container">         
 
        <div class="content">
 
 
            <div class="titleimg">
 
                    <h1>Results</h1>
 
                    <br/>
 
                    <br/>
 
            <img src="" alt="" width="28%"; >
 
            </div>
 
               
 
 
                <h3>Building Constructs</h3>
 
 
         
 
         
 
                <!--Start Experiment 1-->
 
                <div id="expt1"></div>
 
                <h4 > 1-State Construct Assembly</h4>
 
                <div onclick="openAll('expt1p');" class="expandButton">
 
                              <p class="open expt1p colorChange" style="font-size:25px;padding-top:1px;" >Access All</p>
 
                    <div class="open" style="margin-right:5px;">
 
                   
 
   
 
                    </div>
 
                </div>
 
     
 
                <div class="clr"></div>
 
   
 
                <div type="button" class="accordion"> Description </div>
 
                <div class="description">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
           
 
                <div type="button" class="accordion">Relevance</div>
 
                <div class="panel expt1p">
 
                    <p >Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
 
                  <div type="button" class="accordion">Results</div>
 
  <div class="panel expt1p" style="transition:max-height 1s ease-in-out;">
 
      <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.
 
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
     
 
      <img class="figure" src="C:\Users\Shivang\Desktop\iGEM-wiki\Images\gel2.jpg">
 
     
 
      <div class="caption">
 
          <p><b>Figure 1.</b> PCR results of genomic extraction of SoxR from E. coli (including bi-directional promoter and SoxR protein gene)</p>
 
      </div>
 
     
 
      <div class="clr"></div>
 
 
      <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!
 
      Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!</p>
 
 
 
   
 
  </div>
 
 
               
 
               
 
                   
 
                <div type="button" class="accordion" >Summary</div>
 
                <div class="panel expt1p">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
                <div class="clr"></div>
 
            <!--End Experiment-->
 
 
       
 
                <!--Start Experiment 2-->
 
                <div id="expt2">
 
                <h4> In-solution Electrode Testing</h4>
 
                <div onclick="openAll('expt2p');" class="expandButton">
 
                    <p class="open expt2p colorChange" style="font-size:25px;padding-top:1px;" >Access All</p>
 
                    <div class="open" style="margin-right:5px;">
 
                        <i  class="fas fa-arrow-circle-down expt2p slowRotate"></i>
 
                    </div>
 
                </div>
 
                </div>
 
                <div class="clr"></div>
 
               
 
                <div type="button" class="accordion"> Description </div>
 
                <div class="description">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
           
 
                <div type="button" class="accordion">Relevance</div>
 
                <div class="panel expt2p">
 
                    <p >Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
 
                  <div type="button" class="accordion">Results</div>
 
  <div class="panel expt2p" style="transition:max-height 1s ease-in-out;">
 
      <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.
 
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
     
 
      <img class="figure" src="C:\Users\Shivang\Desktop\iGEM-wiki\Images\gel2.jpg">
 
     
 
      <div class="caption">
 
          <p><b>Figure 1.</b> PCR results of genomic extraction of SoxR from E. coli (including bi-directional promoter and SoxR protein gene)</p>
 
      </div>
 
     
 
      <div class="clr"></div>
 
 
      <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!
 
      Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!</p>
 
 
 
   
 
  </div>
 
 
               
 
                  <div type="button" class="accordion" >Summary</div>
 
                <div class="panel expt2p">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
                <div class="clr"></div>
 
            <!--End Experiment-->
 
         
 
   
 
         
 
                <!--Start Experiment 3-->
 
                <div id="expt3"></div>
 
                <h4 > On-agar Electrode Testing</h4>
 
                <div onclick="openAll('expt3p');" class="expandButton">
 
                    <p class="open expt3p colorChange" style="font-size:25px;padding-top:1px;" >Access All</p>
 
                    <div class="open" style="margin-right:5px;">
 
                        <i  class="fas fa-arrow-circle-down expt3p slowRotate"></i>
 
                    </div>
 
                </div>
 
               
 
                <div class="clr"></div>
 
               
 
                <div type="button" class="accordion"> Description </div>
 
                <div class="description">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
           
 
                <div type="button" class="accordion">Relevance</div>
 
                <div class="panel expt3p">
 
                    <p >Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
 
                  <div type="button" class="accordion">Results</div>
 
  <div class="panel expt3p" style="transition:max-height 1s ease-in-out;">
 
      <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.
 
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
     
 
      <img class="figure" src="C:\Users\Shivang\Desktop\iGEM-wiki\Images\gel2.jpg">
 
     
 
      <div class="caption">
 
          <p><b>Figure 1.</b> PCR results of genomic extraction of SoxR from E. coli (including bi-directional promoter and SoxR protein gene)</p>
 
      </div>
 
     
 
      <div class="clr"></div>
 
 
      <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!
 
      Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!</p>
 
 
 
   
 
  </div>
 
 
               
 
                   
 
                <div type="button" class="accordion" >Summary</div>
 
                <div class="panel expt3p">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
                <div class="clr"></div>
 
            <!--End Experiment-->
 
 
 
 
                <!--Start Experiment 4-->
 
                <div id="expt4"></div>
 
                <h4 > 1-State Expression In-solution</h4>
 
                <div onclick="openAll('expt4p');" class="expandButton">
 
                    <p class="open expt4p colorChange" style="font-size:25px;padding-top:1px;" >Access All</p>
 
                    <div class="open" style="margin-right:5px;">
 
                        <i  class="fas fa-arrow-circle-down expt4p slowRotate"></i>
 
                    </div>
 
                </div>
 
               
 
                <div class="clr"></div>
 
               
 
                <div type="button" class="accordion"> Description </div>
 
                <div class="description">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
           
 
                <div type="button" class="accordion">Relevance</div>
 
                <div class="panel expt4p">
 
                    <p >Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
 
                  <div type="button" class="accordion">Results</div>
 
  <div class="panel expt4p" style="transition:max-height 1s ease-in-out;">
 
      <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.
 
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
     
 
      <img class="figure" src="C:\Users\Shivang\Desktop\iGEM-wiki\Images\gel2.jpg">
 
     
 
      <div class="caption">
 
          <p><b>Figure 1.</b> PCR results of genomic extraction of SoxR from E. coli (including bi-directional promoter and SoxR protein gene)</p>
 
      </div>
 
     
 
      <div class="clr"></div>
 
 
      <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!
 
      Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!</p>
 
 
 
   
 
  </div>
 
 
               
 
               
 
                <div type="button" class="accordion" >Summary</div>
 
                <div class="panel expt4p">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
                <div class="clr"></div>
 
            <!--End Experiment-->
 
 
 
                <!--Start Experiment 5-->
 
                <div id="expt5"></div>
 
                <h4> 1-State Expression On-Agar</h4>
 
                <div onclick="openAll('expt5p');" class="expandButton">
 
                    <p class="open expt5p colorChange" style="font-size:25px;padding-top:1px;" >Access All</p>
 
                    <div class="open" style="margin-right:5px;">
 
                        <i  class="fas fa-arrow-circle-down expt5p slowRotate"></i>
 
                    </div>
 
                </div>
 
               
 
                <div class="clr"></div>
 
               
 
                <div type="button" class="accordion"> Description </div>
 
                <div class="description">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
           
 
                <div type="button" class="accordion">Relevance</div>
 
                <div class="panel expt5p">
 
                    <p >Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
 
                  <div type="button" class="accordion">Results</div>
 
  <div class="panel expt5p" style="transition:max-height 1s ease-in-out;">
 
      <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.
 
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
     
 
      <img class="figure" src="C:\Users\Shivang\Desktop\iGEM-wiki\Images\gel2.jpg">
 
     
 
      <div class="caption">
 
          <p><b>Figure 1.</b> PCR results of genomic extraction of SoxR from E. coli (including bi-directional promoter and SoxR protein gene)</p>
 
      </div>
 
     
 
      <div class="clr"></div>
 
 
      <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!
 
      Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!</p>
 
 
 
   
 
  </div>
 
 
           
 
                   
 
                <div type="button" class="accordion" >Summary</div>
 
                <div class="panel expt5p">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
                <div class="clr"></div>
 
            <!--End Experiment-->
 
 
           
 
 
                <!--Start Experiment 6-->
 
                <div id="expt6"></div>
 
                <h4 > 2-State Construct Assembly</h4>
 
                <div onclick="openAll('expt6p');" class="expandButton">
 
                    <p class="open expt5p colorChange" style="font-size:25px;padding-top:1px;" >Access All</p>
 
                    <div class="open" style="margin-right:5px;">
 
                        <i  class="fas fa-arrow-circle-down expt6p slowRotate"></i>
 
                    </div>
 
                </div>
 
               
 
                <div class="clr"></div>
 
               
 
                <div type="button" class="accordion"> Description </div>
 
                <div class="description">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
           
 
                <div type="button" class="accordion">Relevance</div>
 
                <div class="panel expt6p">
 
                    <p >Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
 
                  <div type="button" class="accordion">Results</div>
 
  <div class="panel expt6p" style="transition:max-height 1s ease-in-out;">
 
      <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.
 
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
     
 
      <img class="figure" src="C:\Users\Shivang\Desktop\iGEM-wiki\Images\gel2.jpg">
 
     
 
      <div class="caption">
 
          <p><b>Figure 1.</b> PCR results of genomic extraction of SoxR from E. coli (including bi-directional promoter and SoxR protein gene)</p>
 
      </div>
 
     
 
      <div class="clr"></div>
 
 
      <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!
 
      Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!</p>
 
 
 
   
 
  </div>
 
 
               
 
                   
 
                <div type="button" class="accordion" >Summary</div>
 
                <div class="panel expt6p">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
                <div class="clr"></div>
 
            <!--End Experiment-->
 
 
               
 
 
                <!--Start Experiment 7-->
 
                <div id="expt7"></div>
 
                <h4 > 2-State Expression In-solution</h4>
 
                <div onclick="openAll('expt7p');" class="expandButton">
 
                    <p class="open expt7p colorChange" style="font-size:25px;padding-top:1px;" >Access All</p>
 
                    <div class="open" style="margin-right:5px;">
 
                        <i  class="fas fa-arrow-circle-down expt7p slowRotate"></i>
 
                    </div>
 
                </div>
 
               
 
                <div class="clr"></div>
 
               
 
                <div type="button" class="accordion"> Description </div>
 
                <div class="description">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
           
 
                <div type="button" class="accordion">Relevance</div>
 
                <div class="panel expt7p">
 
                    <p >Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
 
                  <div type="button" class="accordion">Results</div>
 
  <div class="panel expt7p" style="transition:max-height 1s ease-in-out;">
 
      <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.
 
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
     
 
      <img class="figure" src="C:\Users\Shivang\Desktop\iGEM-wiki\Images\gel2.jpg">
 
     
 
      <div class="caption">
 
          <p><b>Figure 1.</b> PCR results of genomic extraction of SoxR from E. coli (including bi-directional promoter and SoxR protein gene)</p>
 
      </div>
 
     
 
      <div class="clr"></div>
 
 
      <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!
 
      Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!</p>
 
 
 
   
 
  </div>
 
 
               
 
               
 
                <div type="button" class="accordion" >Summary</div>
 
                <div class="panel expt7p">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
                <div class="clr"></div>
 
            <!--End Experiment-->
 
 
 
 
                <!--Start Experiment 8-->
 
                <div id="expt8"></div>
 
                <h4 > 2-State Expression On-agar</h4>
 
                <div onclick="openAll('expt8p');" class="expandButton">
 
                    <p class="open expt8p colorChange" style="font-size:25px;padding-top:1px;" >Access All</p>
 
                    <div class="open" style="margin-right:5px;">
 
                        <i  class="fas fa-arrow-circle-down expt8p slowRotate"></i>
 
                    </div>
 
                </div>
 
               
 
                <div class="clr"></div>
 
               
 
                <div type="button" class="accordion"> Description </div>
 
                <div class="description">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
           
 
                <div type="button" class="accordion">Relevance</div>
 
                <div class="panel expt8p">
 
                    <p >Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
 
                  <div type="button" class="accordion">Results</div>
 
  <div class="panel expt8p" style="transition:max-height 1s ease-in-out;">
 
      <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.
 
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
     
 
      <img class="figure" src="C:\Users\Shivang\Desktop\iGEM-wiki\Images\gel2.jpg">
 
     
 
      <div class="caption">
 
          <p><b>Figure 1.</b> PCR results of genomic extraction of SoxR from E. coli (including bi-directional promoter and SoxR protein gene)</p>
 
      </div>
 
     
 
      <div class="clr"></div>
 
 
      <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!
 
      Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi, nisi illum. Consequuntur cum, sequi quo, esse facere corrupti voluptatum ipsum vel consequatur error quasi tenetur, repellat voluptatibus aspernatur optio mollitia!</p>
 
 
 
   
 
  </div>
 
 
               
 
             
 
                   
 
                <div type="button" class="accordion" >Summary</div>
 
                <div class="panel expt8p">
 
                    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Recusandae dolore, tenetur expedita in architecto, repellat rerum minima cumque exercitationem debitis laborum fugit aliquam quo molestiae. Alias eius nostrum aspernatur quaerat.</p>
 
                </div>
 
                <div class="clr"></div>
 
            <!--End Experiment-->
 
   
 
 
                    <script>
 
                        var acc = document.getElementsByClassName("accordion");
 
                        var i;
 
                        console.log(acc)
 
                        for (i = 0; i < acc.length ; i++) {
 
                            acc[i].addEventListener("click", function() {
 
                                this.classList.toggle("active");
 
                                var panell = this.nextElementSibling;
 
                                if (panell.style.maxHeight) {
 
                                    panell.style.maxHeight = null;
 
                                } else {
 
                                    panell.style.maxHeight = (panell.scrollHeight + "px"); 
 
                                }
 
                            });
 
                        }
 
               
 
 
               
 
                        function openAll(expt) {
 
                            console.log("click active")
 
                            var i, panelList;
 
                            panelList = document.getElementsByClassName(expt);
 
                            console.log(panelList)
 
                           
 
                           
 
                            for (i = 2; i < panelList.length; i++) {
 
                                if (panelList[i].style.maxHeight == 0) {
 
                                    console.log(panelList[i].style.maxHeight)
 
                                    panelList[i].style.maxHeight = panelList[i].scrollHeight + "px"
 
                                    console.log("open")
 
                                    panelList[0].style.color = "#F76C6C";
 
                                    panelList[1].style.color = "#F76C6C";
 
                                 
 
               
 
                                } else {
 
                                    console.log(panelList[i].style.maxHeight)
 
                                    panelList[i].style.maxHeight = null ;
 
                                    console.log("close");
 
                                    panelList[0].style.color = "#374785";
 
                                    panelList[1].style.color = "#374785";
 
                                    panelList[1].style.transform = "rotate(0deg)";
 
                                }
 
                            }
 
                           
 
                        } 
 
                   
 
                    </script>
 
 
 
 
 
 
    </div>
 
   
 
</body>
 
</html>
 
 
 
{{:Team:Imperial_College/Templates/Footer}}
 

Latest revision as of 18:04, 11 October 2018