Difference between revisions of "Template:BIMATOX Project"

 
(173 intermediate revisions by the same user not shown)
Line 19: Line 19:
 
// Close the dropdown if the user clicks outside of it
 
// Close the dropdown if the user clicks outside of it
  
−
window.onclick = function(e) {
+
window.onclick = function(event) {
−
   if (!e.target.matches('.dropbtn')) {
+
   if (!event.target.matches('.dropbtn')) {
−
     var myDropdown = document.getElementById(id);
+
 
−
       if (myDropdown.classList.contains('show')) {
+
     var dropdowns = document.getElementsByClassName("dropdown-content");
−
         myDropdown.classList.remove('show');
+
    var i;
 +
    for (i = 0; i < dropdowns.length; i++) {
 +
      var openDropdown = dropdowns[i];
 +
       if (openDropdown.classList.contains('show')) {
 +
         openDropdown.classList.remove('show');
 
       }
 
       }
 +
    }
 +
  }
 +
}
 +
 +
var slideIndex = 1;
 +
showSlides(slideIndex);
 +
 +
function plusSlides(n) {
 +
  showSlides(slideIndex += n);
 +
}
 +
 +
function currentSlide(n) {
 +
  showSlides(slideIndex = n);
 +
}
 +
 +
function showSlides(n) {
 +
  var i;
 +
  var slides = document.getElementsByClassName("mySlides");
 +
  var dots = document.getElementsByClassName("dot");
 +
  if (n > slides.length) {slideIndex = 1}
 +
  if (n < 1) {slideIndex = slides.length}
 +
  for (i = 0; i < slides.length; i++) {
 +
      slides[i].style.display = "none";
 +
  }
 +
  for (i = 0; i < dots.length; i++) {
 +
      dots[i].className = dots[i].className.replace(" active", "");
 +
  }
 +
  slides[slideIndex-1].style.display = "block";
 +
  dots[slideIndex-1].className += " active";
 +
}
 +
 +
function openModal() {
 +
  document.getElementById('myModal').style.display = "block";
 +
}
 +
 +
function closeModal() {
 +
  document.getElementById('myModal').style.display = "none";
 +
}
 +
 +
var slideIndex = 1;
 +
showSlides(slideIndex);
 +
 +
function plusSlides(n) {
 +
  showSlides(slideIndex += n);
 +
}
 +
 +
function currentSlide(n) {
 +
  showSlides(slideIndex = n);
 +
}
 +
 +
function showSlides(n) {
 +
  var i;
 +
  var slides = document.getElementsByClassName("mySlides");
 +
  var dots = document.getElementsByClassName("dot");
 +
  if (n > slides.length) {slideIndex = 1}   
 +
  if (n < 1) {slideIndex = slides.length}
 +
  for (i = 0; i < slides.length; i++) {
 +
      slides[i].style.display = "none"; 
 +
  }
 +
  for (i = 0; i < dots.length; i++) {
 +
      dots[i].className = dots[i].className.replace(" active", "");
 
   }
 
   }
 +
  slides[slideIndex-1].style.display = "block"; 
 +
  dots[slideIndex-1].className += " active";
 
}
 
}
  
Line 43: Line 110:
 
 
 
/**************************************************************** MENU ***************************************************************/
 
/**************************************************************** MENU ***************************************************************/
 +
 +
/* DROPDOWN AND NAVBAR */
  
 
.navbar {
 
.navbar {
Line 48: Line 117:
 
     background-color: #CA6065;
 
     background-color: #CA6065;
 
     font-family: Arial;
 
     font-family: Arial;
−
    font-weight: bold;
 
 
     width:100%;
 
     width:100%;
 
     height:100px;
 
     height:100px;
Line 56: Line 124:
 
.navbar a {
 
.navbar a {
 
     float: left;
 
     float: left;
−
     font-size: 22px;
+
     font-size: 18px;
−
     color: white;
+
    font-family: Arial;
 +
    font-weight: bold;
 +
     color: #2F4641;
 
     text-align: center;
 
     text-align: center;
−
     padding: 43px 16px;
+
     padding: 45px 16px;
 
     text-decoration: none;
 
     text-decoration: none;
 
}
 
}
Line 78: Line 148:
 
.dropdown .dropbtn {
 
.dropdown .dropbtn {
 
     cursor: pointer;
 
     cursor: pointer;
−
     font-size: 22px;     
+
     font-size: 18px;     
 
     border: none;
 
     border: none;
 
     outline: none;
 
     outline: none;
−
     color: white;
+
     color: #2F4641;
 
     padding: 43px 16px;
 
     padding: 43px 16px;
 
     background-color: inherit;
 
     background-color: inherit;
Line 94: Line 164:
 
     position: absolute;
 
     position: absolute;
 
     background-color: #49A4AC;
 
     background-color: #49A4AC;
 +
    font-family: Arial;
 
     min-width: 160px;
 
     min-width: 160px;
 
     box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 
     box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
Line 102: Line 173:
 
     float: none;
 
     float: none;
 
     color: white;
 
     color: white;
 +
    font-family: Arial;
 
     padding: 12px 16px;
 
     padding: 12px 16px;
 
     text-decoration: none;
 
     text-decoration: none;
Line 115: Line 187:
 
     display: block;
 
     display: block;
 
}
 
}
 +
 +
/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
 +
@media screen and (max-width: 600px) {
 +
  .navbar a:not(:first-child) {display: none;}
 +
  .navbar a.icon {
 +
    float: right;
 +
    display: block;
 +
  }
 +
}
 +
 +
/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
 +
@media screen and (max-width: 600px) {
 +
  .navbar.responsive {position: relative;}
 +
  .navbar.responsive a.icon {
 +
    position: absolute;
 +
    right: 0;
 +
    top: 0;
 +
  }
 +
  .navbar.responsive a {
 +
    float: none;
 +
    display: block;
 +
    text-align: left;
 +
  }
 +
}
 +
 +
/* FOOTER */
  
 
.footer {
 
.footer {
Line 121: Line 219:
 
   bottom: -20px;
 
   bottom: -20px;
 
   left: 0;
 
   left: 0;
−
   height:130px;
+
   height:220px;
−
   background-color: #C0DACF;
+
   background-color: #FFFFFF;
 
   text-align: center;
 
   text-align: center;
 
   display: inline-block;
 
   display: inline-block;
 +
}
 +
 +
.footer img {
 +
    float: left;
 +
    color: white;
 +
    text-align: center;
 +
    padding: 0 0 0 0;
 
}
 
}
  
Line 131: Line 236:
 
/* Wrapper for the content */
 
/* Wrapper for the content */
 
.igem_2017_content_wrapper {
 
.igem_2017_content_wrapper {
−
width: 99%;
+
width: 86%;
−
padding-top:10%;
+
padding-top:8%;
−
padding-left:1%;
+
padding-left:7%;
−
padding-bottom:12%;
+
padding-bottom:20%;
 +
padding-right:7%;
 
display:block;
 
display:block;
 
float:left;  
 
float:left;  
 
overflow-y:hidden;  
 
overflow-y:hidden;  
−
font-family: 'Microsoft', sans-serif !important;
 
 
margin: 0px 0px -20px 0px;
 
margin: 0px 0px -20px 0px;
 
background-image: url('https://static.igem.org/mediawiki/2017/a/a9/T--Uchile_Biotec--Fondo2.jpg');
 
background-image: url('https://static.igem.org/mediawiki/2017/a/a9/T--Uchile_Biotec--Fondo2.jpg');
 
background-repeat: no-repeat;
 
background-repeat: no-repeat;
−
background-position: right top;  
+
background-position: right top;
 +
background-color: #C0DACF;  
 
}
 
}
  
Line 148: Line 254:
 
/********************************* HTML STYLING  *********************************/
 
/********************************* HTML STYLING  *********************************/
  
−
/* styling for the titles h1 h2 */
+
/* styling for the titles h1 */
−
.igem_2017_content_wrapper h1, .igem_2017_content_wrapper h2 {
+
.igem_2017_content_wrapper h1 {
−
padding:5px 15px;  
+
padding:15px 15px 20px !important;  
 
border-bottom: 0px;  
 
border-bottom: 0px;  
−
color: #CA6065;
+
color: #CC6666;
 +
font-size: 30px !important;
 
}
 
}
  
 +
/* styling for the titles h2 */
 +
.igem_2017_content_wrapper h2 {
 +
padding:15px 24px 15px !important;
 +
border-bottom: 0px;
 +
color: #CE6161;
 +
font-size: 28px !important;
 +
}
  
−
/* styling for the titles  h3 h4 h5 h6*/
+
/* styling for the titles  h3 */
−
.igem_2017_content_wrapper h3, .igem_2017_content_wrapper h4, .igem_2017_content_wrapper h5, .igem_2017_content_wrapper h6 {  
+
.igem_2017_content_wrapper h3 {  
 
padding:5px 15px;  
 
padding:5px 15px;  
 
border-bottom:0px;  
 
border-bottom:0px;  
−
color: #003333;
+
color: #003333;
 +
font-size: 26px !important;
 
}
 
}
  
 +
/* styling for the titles h4 */
 +
.igem_2017_content_wrapper h4 {
 +
padding:5px 15px;
 +
border-bottom:0px;
 +
color: #003333;
 +
font-size: 24px !important;
 +
}
 +
 +
/* styling for the titles h5 */
 +
.igem_2017_content_wrapper h5 {
 +
padding:5px 15px;
 +
border-bottom:0px;
 +
color: #003333;
 +
font-size: 22px !important;
 +
}
 +
 +
/* styling for the titles h6 */
 +
.igem_2017_content_wrapper h6 {
 +
padding:5px 15px;
 +
border-bottom:0px;
 +
color: #003333;
 +
font-size: 20px !important;
 +
}
  
 
/* font and text */
 
/* font and text */
 
.igem_2017_content_wrapper p {  
 
.igem_2017_content_wrapper p {  
 
padding: 0px 15px;  
 
padding: 0px 15px;  
−
font-size: 20px;
+
font-size: 18px !important;
−
text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;
+
text-shadow: -1px 0 #C0DACF, 0 1px #C0DACF, 1px 0 #C0DACF, 0 -1px #C0DACF;
 
}
 
}
  
Line 193: Line 331:
 
.igem_2017_content_wrapper ul {
 
.igem_2017_content_wrapper ul {
 
padding:0px 20px;
 
padding:0px 20px;
−
font-size: 13px;
+
font-size: 18px !important;
 
font-family:Tahoma, Geneva, sans-serif;  
 
font-family:Tahoma, Geneva, sans-serif;  
 
}
 
}
Line 200: Line 338:
 
.igem_2017_content_wrapper ol {
 
.igem_2017_content_wrapper ol {
 
padding:0px;  
 
padding:0px;  
−
font-size: 13px;
+
font-size: 18px !important;
 
font-family:Tahoma, Geneva, sans-serif;  
 
font-family:Tahoma, Geneva, sans-serif;  
 
}
 
}
Line 208: Line 346:
 
width: 97%;  
 
width: 97%;  
 
margin:15px 10px;  
 
margin:15px 10px;  
−
border: 1px solid #d3d3d3;  
+
border: 1px solid #dclass="dropbtn" onclick="3d3d3;  
 
border-collapse: collapse;  
 
border-collapse: collapse;  
 
}
 
}
Line 313: Line 451:
  
 
/***************************************************** RESPONSIVE STYLING ****************************************************/
 
/***************************************************** RESPONSIVE STYLING ****************************************************/
−
 
+
class="dropbtn" onclick="
 
</Style>
 
</Style>
  
Line 324: Line 462:
 
<head>
 
<head>
  
−
<div class="navbar">
+
<div class="navbar" id="myTopnav">
  
−
   <img src="https://static.igem.org/mediawiki/2017/1/13/T--Uchile_Biotec--LogoFull.jpg" style="width:80px;height:80px;margin: 10px 0px 0px 10px"></img>
+
   <img src="https://static.igem.org/mediawiki/2017/1/13/T--Uchile_Biotec--LogoFull.jpg" style="width:100px;height:100px;margin: 0px 0px 0px 10px"></img>
  
 
   <img src="https://static.igem.org/mediawiki/2017/c/ce/T--Uchile_Biotec--Bimatox.jpg" style="width:132px;height:80px;margin: 0px 10px"></img>
 
   <img src="https://static.igem.org/mediawiki/2017/c/ce/T--Uchile_Biotec--Bimatox.jpg" style="width:132px;height:80px;margin: 0px 10px"></img>
Line 334: Line 472:
  
 
   <div class="dropdown">
 
   <div class="dropdown">
−
     <button class="dropbtn" onclick="myFunction('1')"><b>Team</b>
+
     <button class="dropbtn" onclick="myFunction('1')"><b>Team∇</b></button>
−
      <i class="fa fa-caret-down"></i>
+
−
    </button>
+
 
     <div class="dropdown-content" id="1">
 
     <div class="dropdown-content" id="1">
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Team">Team</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Team">Team</a>
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Collaborations">Collaborations</a>
 
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/igem_latam">iGEM Latam</a>
 
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Sponsors">Sponsors</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Sponsors">Sponsors</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Attributions">Attributions</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Attributions">Attributions</a>
 
     </div>
 
     </div>
 
   </div>  
 
   </div>  
 +
 +
  <a href="https://2017.igem.org/Team:UChile_Biotec/igem_latam">iGEM LATAM</a>
  
 
   <div class="dropdown">
 
   <div class="dropdown">
−
     <button class="dropbtn" onclick="myFunction('2')"><b>Project</b>
+
     <button class="dropbtn" onclick="myFunction('2')"><b>Project∇</b>
−
      <i class="fa fa-caret-down"></i>
+
 
     </button>
 
     </button>
 
     <div class="dropdown-content" id="2">
 
     <div class="dropdown-content" id="2">
Line 354: Line 489:
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Design">Design</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Design">Design</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Experiments">Experiments</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Experiments">Experiments</a>
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Contribution">Contribution</a>
 
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Collaborations">Collaborations</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Collaborations">Collaborations</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Afters">Improve</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Afters">Improve</a>
Line 361: Line 495:
  
 
   <div class="dropdown">
 
   <div class="dropdown">
−
     <button class="dropbtn" onclick="myFunction('6')"><b>Results</b>
+
     <button class="dropbtn" onclick="myFunction('6')"><b>Results∇</b>
−
      <i class="fa fa-caret-down"></i>
+
 
     </button>
 
     </button>
 
     <div class="dropdown-content" id="6">
 
     <div class="dropdown-content" id="6">
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Notebook">Notebook</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Notebook">Notebook</a>
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/InterLab">InterLab</a>
 
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Model">Model</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Model">Model</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Results">Results</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Results">Results</a>
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Demonstrate">Demonstrate</a>
 
 
     </div>
 
     </div>
 
   </div>  
 
   </div>  
  
−
   <div class="dropdown">
+
   <a href="https://2017.igem.org/Team:UChile_Biotec/Parts">Parts</a>
−
    <button class="dropbtn" onclick="myFunction('3')"><b>Parts</b>
+
−
      <i class="fa fa-caret-down"></i>
+
−
    </button>
+
−
    <div class="dropdown-content" id="3">
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Parts">Parts</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Parts">Basic Parts</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Parts">Composite Parts</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Parts">Part Collection</a>
+
−
    </div>
+
−
  </div>  
+
  
−
   <a href="https://2017.igem.org/Team:UChile_Biotec/Safety">Safety</a>
+
   <a href="https://2017.igem.org/Team:UChile_Biotec/Safety"><b>Safety</b></a>
  
 
   <div class="dropdown">
 
   <div class="dropdown">
−
     <button class="dropbtn" onclick="myFunction('4')"><b>Practices</b>
+
     <button class="dropbtn" onclick="myFunction('4')"><b>Practices∇</b>
−
      <i class="fa fa-caret-down"></i>
+
 
     </button>
 
     </button>
 
     <div class="dropdown-content" id="4">
 
     <div class="dropdown-content" id="4">
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Practices/Overview">Overview</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Practices/Overview">Overview</a>
−
       <a href="https://2017.igem.org/Team:UChile_Biotec/HP/Silver">Silver</a>
+
       <a href="https://2017.igem.org/Team:UChile_Biotec/HP/Integrated">Integrated</a>
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/HP/Gold_Integrated">Integrated and Gold</a>
+
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Public_engagement">Public Engagement</a>
 
       <a href="https://2017.igem.org/Team:UChile_Biotec/Public_engagement">Public Engagement</a>
 
     </div>
 
     </div>
 
   </div>  
 
   </div>  
  
−
   <div class="dropdown">
+
   <a href="https://2017.igem.org/Team:UChile_Biotec/Judging"><b>For Judges</b></a>
−
    <button class="dropbtn" onclick="myFunction('5')"><b>Awards</b>
+
−
      <i class="awards"></i>
+
−
    </button>
+
−
    <div class="dropdown-content" id="5">
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Applied Design</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Entrepreneurship</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Hardware</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Measurement</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Model</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Plant</a>
+
−
      <a href="https://2017.igem.org/Team:UChile_Biotec/Awards">Software</a>
+
−
    </div>
+
−
  </div>  
+
  
−
</div>
+
</div>  
  
 
<!-- start of content -->
 
<!-- start of content -->

Latest revision as of 03:44, 2 November 2017