Difference between revisions of "Template:IISc-Bangalore"

m
 
(176 intermediate revisions by 6 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
  
−
<head>
+
<style>
  
−
[[File:T--IISc-Bangalore--comic.ttf]]
+
/* Fonts */
  
−
<style>
+
@font-face {
 +
    font-family: "Raleway";
 +
    src: url("https://static.igem.org/mediawiki/2017/3/3f/T--IISc-Bangalore--raleway.woff") format("woff");
 +
}
 +
@font-face {
 +
    font-family: "Poppins";
 +
    src: url("https://static.igem.org/mediawiki/2017/d/d7/T--IISc-Bangalore--poppins.woff") format("woff");
 +
}
 +
 
 +
@font-face {
 +
    font-family: "Raleway-ExtraBold";
 +
    src: url('https://static.igem.org/mediawiki/2017/6/6b/T--IISc-Bangalore--raleway-extrabold.woff') format("woff");
 +
}
  
 
/* Code for removing iGEM loader content */
 
/* Code for removing iGEM loader content */
Line 14: Line 26:
  
 
/* Content styling */
 
/* Content styling */
−
 
−
@import url(//fonts.googleapis.com/css?family=Open+Sans);
 
  
 
#content {
 
#content {
Line 21: Line 31:
 
   height: 100%;
 
   height: 100%;
 
   box-sizing: border-box;
 
   box-sizing: border-box;
−
   margin: 0;
+
   margin: -31px 0 0;
 
   padding: 0;
 
   padding: 0;
−
  background-color: #fcf5d9;
 
 
}
 
}
  
Line 36: Line 45:
 
     top: 50%;
 
     top: 50%;
 
     transform: translateY(-50%);
 
     transform: translateY(-50%);
−
     left: 6%;
+
     right: 83%;
 
     margin: 0 auto;
 
     margin: 0 auto;
 
     padding: 0;
 
     padding: 0;
 
     box-sizing: border-box;
 
     box-sizing: border-box;
−
    padding-right: 30px;
 
 
     list-style: none;
 
     list-style: none;
 +
    z-index: 1;
 +
    display: none;
 
}
 
}
  
Line 48: Line 58:
 
     padding: 10px 10px 10px 10px;
 
     padding: 10px 10px 10px 10px;
 
     text-align: right;
 
     text-align: right;
 +
    font-family: "Raleway", sans-serif;
 +
}
 +
 +
#inPageNav li a {
 +
    color: inherit;
 +
}
 +
 +
#inPageNav li a img {
 +
    width: 0;
 +
    height: 0;
 +
    box-sizing: border-box;
 +
    margin-top: -5px;
 +
    padding: 20px;
 +
    background-image: url('https://static.igem.org/mediawiki/2017/6/68/T--IISc-Bangalore--navbar_bullet.png');
 +
    background-size: 40px 40px;
 +
}
 +
 +
#inPageNav li a.active img {
 +
    background-image: url('https://static.igem.org/mediawiki/2017/2/20/T--IISc-Bangalore--navbar_bullet_active.png');
 +
    background-size: 40px 40px;
 +
}
 +
 +
#inPageNav li a:focus {
 +
    color: inherit;
 +
    text-decoration: none;
 +
    outline: none;
 +
}
 +
 +
#inPageNav li a:active {
 +
    text-decoration: none;
 +
}
 +
 +
#inPageNav li a.active {
 +
    font-weight: 800;
 
}
 
}
  
 
#inPageNav li:hover {
 
#inPageNav li:hover {
−
     background-color: #ddd;
+
     background-color: #f4f4f4;
 
}
 
}
 
   
 
   
 
#contentMain {
 
#contentMain {
−
     width: 80%;
+
     width: 100%;
 
     float: left;
 
     float: left;
 
     display: block;
 
     display: block;
−
     padding: 50px 200px 50px 0;
+
     padding: 0 15% 50px 0;
 
     box-sizing: border-box;
 
     box-sizing: border-box;
 
     position: relative;
 
     position: relative;
−
    top: 10px;
 
−
    left: 20%;
 
−
    height: 1000px;
 
 
     height: auto;
 
     height: auto;
 
     overflow: auto;
 
     overflow: auto;
−
     font-family: 'Comic', sans-serif;
+
     font-family: "Poppins", sans-serif;
 +
    font-size: 1em;
 +
    line-height: 2;
 +
    background-image: url('https://static.igem.org/mediawiki/2017/4/44/T--IISc-Bangalore--background_final.png');
 +
    background-size: cover;
 +
    background-attachment: fixed;
 +
    padding-left: 20%;
 +
    top: 80px;
 
}
 
}
−
#content h1 {
+
 
−
     margin: 0 0 40px 0;
+
#contentMain h1 {
 +
     margin: 20px 0;
 +
    line-height: 1.3;
 +
    font-family: "Raleway-ExtraBold", sans-serif;
 +
    padding: 0;
 +
    text-align: center;
 +
    border-bottom: 2px solid;
 +
    padding-bottom: 10px;
 +
    box-sizing: border-box;
 +
    font-size: 3em;
 
}
 
}
−
#content h2, h3 {
+
 
−
     margin: 0 0 30px 0;
+
#contentMain h1 img {
 +
     vertical-align: text-top;
 +
    box-sizing: border-box;
 +
    padding-bottom: 8px;
 +
    height: 50px;
 
}
 
}
−
#content p {
+
 
−
     margin: 0 0 30px 0;
+
#contentMain h1 img:nth-child(1) {
−
    line-height: 2;
+
     margin-right: 10px;
 
}
 
}
 +
 +
#contentMain h1 img:nth-child(2) {
 +
    margin-left: 10px;
 +
}
 +
 +
#contentMain h1:target {
 +
    padding-top: 80px;
 +
    margin-top: -80px;
 +
}
 +
 +
#contentMain h2, h3 {
 +
    margin: 15px 0 15px 0;
 +
    font-family: "Raleway", sans-serif;
 +
    font-weight: 600;
 +
    padding: 0;
 +
}
 +
#contentMain p {
 +
    margin: 15px 0 15px 0;
 +
    line-height: 1.9;
 +
    font-size: 1.25em;
 +
    font-family: "Poppins", sans-serif;
 +
}
 +
#contentMain li li{
 +
    font-size: 1em;
 +
}
 +
#contentMain table {
 +
    background: none;
 +
    border: none;
 +
    margin: auto;
 +
}
 +
 +
#contentMain th {
 +
    background: none;
 +
    border: none;
 +
    border-bottom: 2px solid black;
 +
}
 +
 +
#contentMain td {
 +
    background: none;
 +
    border: none;
 +
}
 +
 
.navbar {
 
.navbar {
 
     overflow: hidden;
 
     overflow: hidden;
−
    background-color: #f8b956;
 
 
     padding-right: 60px;
 
     padding-right: 60px;
 +
    background-color: #ffe97c;
 +
    font-family: "Poppins", sans-serif;
 
}
 
}
  
Line 104: Line 208:
 
     outline: none;
 
     outline: none;
 
     color: black;
 
     color: black;
−
     padding: 13px 16px;
+
     padding: 13px 24px;
 +
    font-family: "Poppins", sans-serif;
 +
    letter-spacing: 0.05em;
 
}
 
}
  
 
.dropbtn {
 
.dropbtn {
 
     position: relative;
 
     position: relative;
−
     background-color: #F8B956;
+
     background-color: rgb(255,255,255);
−
     height: 42px;
+
     background-color: #ffe97c;
 
}
 
}
  
Line 123: Line 229:
 
.dropbtn a {
 
.dropbtn a {
 
     padding: 0;
 
     padding: 0;
 +
    float: none;
 
}
 
}
  
 
.navbar a:hover, .dropdown:hover .dropbtn {
 
.navbar a:hover, .dropdown:hover .dropbtn {
−
     background-color: fee9bf;
+
     background-color: #fff4bd;
 
}
 
}
  
Line 132: Line 239:
 
     display: none;
 
     display: none;
 
     position: absolute;
 
     position: absolute;
−
     background-color: #fcdc9d;
+
     background-color: #fff4bd;
 
     min-width: 160px;
 
     min-width: 160px;
−
     box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+
     box-shadow: 0px 13px 10px -2px rgba(0, 0, 0, 0.12);
−
    z-index: 10;
+
 
}
 
}
  
Line 145: Line 251:
 
     display: block;
 
     display: block;
 
     text-align: left;
 
     text-align: left;
 +
    letter-spacing: 0;
 
}
 
}
  
 
.dropdown-content a:hover {
 
.dropdown-content a:hover {
−
     background-color: #fee9bf;
+
     background-color: #fffdec;
 
}
 
}
  
Line 154: Line 261:
 
     display: block;
 
     display: block;
 
}
 
}
 +
  
 
#logoImg {
 
#logoImg {
−
     float: left;
+
     height: 70px;
−
     padding: 5px 10px 0;
+
    position: fixed;
 +
    top: 20px;
 +
    left: 0;
 +
    z-index: 2;
 +
    background-color: #FFE97C;
 +
    border-radius: 0 0 100px 0;
 +
     padding: 5px 80px 10px 10px;
 +
    border: none;
 
}
 
}
  
−
#logoImg img {
+
figure img {
−
     height: 35px;
+
     display: block;
 +
    margin: auto;
 
}
 
}
 +
 +
figurecaption {
 +
    text-align: center;
 +
    font-style: italic;
 +
    display: block;
 +
    margin: auto;
 +
}
 +
 +
.clearfix::after {
 +
    content: "";
 +
    clear: both;
 +
    display: table;
 +
}
 +
 +
.fch {
 +
    border-bottom: 2px solid !important;
 +
}
 +
 +
.fch tr:nth-child(1) th:nth-child(1) {
 +
    border-bottom: 2px solid !important;
 +
}
 +
 +
.fch tr th:nth-child(1) {
 +
    border: none !important;
 +
}
 +
 +
#contentMain li {
 +
    font-size: 1.25em;
 +
    line-height: 1.9;
 +
}
 +
 +
#contentMain table li {
 +
    font-size: 1em;
 +
}
 +
 +
.gifAnimated {
 +
    position: absolute;
 +
    width: 100%;
 +
    height: calc(100% - 61px);
 +
    background-size: contain;
 +
    background-position: center; 
 +
    background-repeat: no-repeat;
 +
    top: 68px;
 +
    left: 0;
 +
}
 +
 +
#headerImg {
 +
    margin-left: -30.76%;
 +
    margin-right: -23.07%;
 +
}
 +
 +
/* Footer styling */
 +
 +
        #pagefooter {
 +
            width: 100%;
 +
            position: fixed;
 +
            bottom: -250px;
 +
            left: 0;
 +
            background-color: #FFE97C;
 +
            transition: all 0.5s ease;
 +
            padding-left: 10px;
 +
            z-index: 2;
 +
            font-family: "Poppins", sans-serif;
 +
        }
 +
        #smallfooter {
 +
            transition: all 0.5s ease;
 +
        }
 +
        .expanded {
 +
            bottom: 0 !important;
 +
            transition: all 0.5s ease;
 +
        }
 +
        .expanded #smallfooter {
 +
            opacity: 0;
 +
            transition: all 0.5s ease;
 +
        }
 +
        .footerarrow {
 +
            position: absolute;
 +
            top: 4px;
 +
            left: 50%;
 +
            transform: translateX(-50%);
 +
            transition: transform 0.5s ease-in;
 +
            height: 12px;
 +
        }
 +
        .inverted {
 +
            transform: rotate(180deg);
 +
            transition: transform 0.5 ease-in;
 +
        }
 +
        #bigfooter table {
 +
            border: none;
 +
            background: none;
 +
        }
 +
        #bigfooter table tr td {
 +
            border: none;
 +
            background: none;
 +
        }
 +
        #bigfooter table tr th {
 +
            border: none;
 +
            background: none;
 +
            font-family: "Raleway-ExtraBold", sans-serif;
 +
            font-size: 2em;
 +
            letter-spacing: 1px;
 +
            text-transform: uppercase;
 +
        }
 +
        #footericons {
 +
            float: right;
 +
            margin-right: 20px;
 +
        }
 +
        #footericons img{
 +
            height: 18px;
 +
            margin-right: 10px;
 +
            margin-bottom: 2px;
 +
        }
 +
        #bigfooter {
 +
            width: 100%;
 +
            position: relative;
 +
            display: block;
 +
            height: 250px;
 +
        }
 +
        #footersponsors {
 +
            width: 60%;
 +
            float: left;
 +
        }
 +
        #footersponsors img {
 +
            height: 100%;
 +
        }
 +
        #footercontact {
 +
            width: 40%;
 +
            float: right;
 +
        }
 +
        #footercontact img {
 +
            height: 50px;
 +
        }
 +
        #footersponsors td {
 +
            text-align: center;
 +
            height: 70px;
 +
        }
 +
 
</style>
 
</style>
−
</head>
+
 
−
<body>
+
 
<div id="contentWrapper">
 
<div id="contentWrapper">
 
<div style="position: fixed; width: 100%; top: 16px; left: 0; z-index: 1;">
 
<div style="position: fixed; width: 100%; top: 16px; left: 0; z-index: 1;">
 
<div class="navbar">
 
<div class="navbar">
−
  <a href="https://2017.igem.org/Team:IISc-Bangalore" id="logoImg"><img src="/wiki/images/6/65/T--IISc-Bangalore--logo-new.png"></a>
 
  
 
   <div class="dropdown">
 
   <div class="dropdown">
−
     <button class="dropbtn">COMMUNITY</button>
+
     <div class="dropbtn">COMMUNITY</div>
 
     <div class="dropdown-content">
 
     <div class="dropdown-content">
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/HP/Silver">Human Practices</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/HP/Silver">Human Practices</a>
Line 178: Line 429:
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Collaborations">Collaborations</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Collaborations">Collaborations</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Engagement">Public Engagement</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Engagement">Public Engagement</a>
−
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Engagement">Safety</a>
+
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Safety">Safety</a>
  
 
     </div>
 
     </div>
 
   </div>
 
   </div>
 
   <div class="dropdown">
 
   <div class="dropdown">
−
     <button class="dropbtn"><a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware"><span></span></a>HARDWARE</button>
+
     <div class="dropbtn"><a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware"><span></span></a>HARDWARE</div>
 
     <div class="dropdown-content">
 
     <div class="dropdown-content">
−
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware/Problem">Problem</a>
+
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware">GCODe</a>
−
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware/GCODe-Mini">GCODe Mini</a>
+
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware/GCODe-Mini">Mini</a>
−
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware/GCODe-Pro">GCODe Pro</a>
+
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware/GCODe-Pro">Pro</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware/Results">Results</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware/Results">Results</a>
−
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware/Design">Design</a>
+
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware/Notebook">Hardware Evolution</a>
 +
      <a href="https://2017.igem.org/Team:IISc-Bangalore/Hardware/Documentation">Build Your Own</a>
 
     </div>
 
     </div>
 
   </div>
 
   </div>
  
 
   <div class="dropdown">
 
   <div class="dropdown">
−
     <button class="dropbtn">LAB</button>
+
     <div class="dropbtn">LAB</div>
 
     <div class="dropdown-content">
 
     <div class="dropdown-content">
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Assembly">Assembly</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Assembly">Assembly</a>
−
      <a href="https://2017.igem.org/Team:IISc-Bangalore/Experiments">Experiments</a>
 
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Results">Results</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Results">Results</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Demonstrate">Demonstrate</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Demonstrate">Demonstrate</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Notebook">Notebook</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Notebook">Notebook</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Protocols">Protocols</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Protocols">Protocols</a>
 +
      <a href="https://2017.igem.org/Team:IISc-Bangalore/InterLab">InterLab</a>
 
     </div>
 
     </div>
 
   </div>
 
   </div>
  
 
   <div class="dropdown">
 
   <div class="dropdown">
−
     <button class="dropbtn">PROJECT</button>
+
     <div class="dropbtn">PROJECT</div>
 
     <div class="dropdown-content">
 
     <div class="dropdown-content">
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Description">iFLOAT</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Description">iFLOAT</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Model">Model</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Model">Model</a>
 +
      <a href="https://2017.igem.org/Team:IISc-Bangalore/Experiments">Experiments</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Parts">Parts</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Parts">Parts</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Design">Design</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Design">Design</a>
−
      <a href="https://2017.igem.org/Team:IISc-Bangalore/InterLab">InterLab</a>
 
−
      <a href="https://2017.igem.org/Team:IISc-Bangalore/Evolution">Evolution</a>
 
 
     </div>
 
     </div>
 
   </div>
 
   </div>
  
 
   <div class="dropdown">
 
   <div class="dropdown">
−
     <button class="dropbtn">ABOUT</button>
+
     <div class="dropbtn">ABOUT</div>
 
     <div class="dropdown-content">
 
     <div class="dropdown-content">
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Team">Team</a>
 
       <a href="https://2017.igem.org/Team:IISc-Bangalore/Team">Team</a>
Line 227: Line 478:
  
 
   <div class="dropdown">
 
   <div class="dropdown">
−
     <button class="dropbtn"><a href="https://2017.igem.org/Team:IISc-Bangalore"><span></span></a>HOME</button>
+
     <a href="https://2017.igem.org/Team:IISc-Bangalore">HOME</a>
 
   </div>
 
   </div>
 
</div>
 
</div>
 +
  <a href="https://2017.igem.org/Team:IISc-Bangalore"><img id="logoImg" src="/wiki/images/6/65/T--IISc-Bangalore--logo-new.png"></a>
 
</div>
 
</div>
 +
 +
<div id="pagefooter" class="clearfix">
 +
        <div id="smallfooter" class="clearfix">
 +
            <div id="footericons">
 +
                <a href="https://www.facebook.com/iiscbangaloreigem/"><img src="https://static.igem.org/mediawiki/2017/4/4b/T--IISc-Bangalore--fb_new.svg" /></a><a href="https://twitter.com/igem_iiscUG"><img src="https://static.igem.org/mediawiki/2017/b/be/T--IISc-Bangalore--twitter_new.svg" /></a><a href="mailto:igem.2017.iisc@gmail.com"><img src="https://static.igem.org/mediawiki/2017/e/e8/T--IISc-Bangalore--mail.svg" /></a>
 +
            </div>
 +
        </div>
 +
        <img class="footerarrow" src="https://static.igem.org/mediawiki/2017/6/62/T--IISc-Bangalore--arrow.png" width="20px" />
 +
        <div id="bigfooter" class="clearfix">
 +
            <div id="footersponsors">
 +
<table style="margin: auto">
 +
<tr>
 +
 +
<th colspan="6">Sponsors</th>
 +
 +
</tr>
 +
<tr>
 +
<td colspan="2"><a href="http://www.iisc.ac.in/"><img src="https://static.igem.org/mediawiki/2017/8/82/T--IISc-Bangalore--iisc.png"></a></td>
 +
<td colspan="2"><a href="http://www.dbtindia.nic.in/"><img src="https://static.igem.org/mediawiki/2017/7/78/T--IISc-Bangalore--dbt.png"></a></td>
 +
<td colspan="2"><a href="http://www.dbtindia.nic.in/ibec-indian-biological-engineering-competition/"><img src="https://static.igem.org/mediawiki/2017/8/89/T--IISc-Bangalore--ibec.png"></a></td>
 +
</tr>
 +
<tr>
 +
<td colspan="3"><a href="https://www.justdial.com/Tirunelveli/South-India-Bottling-Co-Pvt-Ltd-Gangaikondan/0462P462STD2100023_BZDET"><img src="https://static.igem.org/mediawiki/2017/f/f4/T--IISc-Bangalore--sibc-updated.png"></a></td>
 +
<td colspan="3"><a href="http://www.snapgene.com/"><img src="https://static.igem.org/mediawiki/2017/4/41/T--IISc-Bangalore--snapgene2.png"></a></td>
 +
</tr>
 +
 +
                </table>
 +
            </div><div id="footercontact">
 +
                <table style="margin: auto">
 +
                    <tr><th colspan="6">Contact</th></tr>
 +
                    <tr><td>&nbsp;</td></tr>
 +
                    <tr>
 +
                        <td><a href="https://www.facebook.com/iiscbangaloreigem/"><img src="https://static.igem.org/mediawiki/2017/4/4b/T--IISc-Bangalore--fb_new.svg" /></a></td>
 +
                        <td><a href="https://twitter.com/igem_iiscUG"><img src="https://static.igem.org/mediawiki/2017/b/be/T--IISc-Bangalore--twitter_new.svg" /></a></td>
 +
                        <td><a href="mailto:igem.2017.iisc@gmail.com"><img src="https://static.igem.org/mediawiki/2017/e/e8/T--IISc-Bangalore--mail.svg" /></a></td>
 +
                    </tr>
 +
                    <tr><td>&nbsp;</td></tr>
 +
                </table>
 +
            </div>
 +
        </div>
 +
    </div>
 
</div>
 
</div>
  
−
</body>
+
<script type="text/javascript" src="https://2017.igem.org/Template:IISc-Bangalore/slide-nav?action=raw&ctype=text/javascript"></script>
 +
<script>
 +
    $("#pagefooter").click(function() {
 +
        $("#pagefooter").toggleClass("expanded");
 +
        $(".footerarrow").toggleClass("inverted");
 +
    });
 +
$(document).ready(function(){
 +
    var headings = document.getElementsByTagName("h1");
 +
    var i;
 +
    for (i=0; i<headings.length; i++) {
 +
        var sometext = headings[i].innerHTML;
 +
        console.log(sometext);
 +
        headings[i].innerHTML = "<img src='https://static.igem.org/mediawiki/2017/c/c9/T--IISc-Bangalore--title_flank_left.png'>"+sometext+"<img src='https://static.igem.org/mediawiki/2017/a/a2/T--IISc-Bangalore--title_flank_right.png'>";
 +
    }
 +
})
 +
</script>
 
</html>
 
</html>

Latest revision as of 03:45, 2 November 2017