Difference between revisions of "Template:IIT Delhi"

Line 1: Line 1:
 +
<!-- Declare that you are going to use html code instead of wiki code -->
 
<html>
 
<html>
  
−
<!-- Start of CSS-->
+
<!--<meta name="viewport" content="user-scalable=1, width=400">-->
 +
<meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0" />
 +
<!-- Latest compiled and minified CSS -->
 +
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
 +
 
 +
<!-- Optional theme -->
 +
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
 +
 
 +
<!-- Latest compiled and minified JavaScript -->
 +
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
 +
<!--<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part0_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part1_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part2_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part3_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part4_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part5_css?action=raw&ctype=text/css" rel="stylesheet">
 +
 
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Style_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<style>#mw-content-text > p {display:none}</style>
 +
<script src="//2015.igem.org/Team:Cambridge-JIC/Assets/jquery?action=raw&ctype=text/javascript"></script>
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/OpenSans_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Awesome_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Fudge_css?action=raw&ctype=text/css" rel="stylesheet">
 +
 
 +
<link href="//2015.igem.org/wiki/images/3/3a/CamJIC-Favicon.png" rel="icon">
 +
<script src="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_js?action=raw&ctype=text/javascript"></script>
 +
<script src="//2015.igem.org/Team:Cambridge-JIC/Assets/Fudge_js?action=raw&ctype=text/javascript"></script>
 +
<script src="//2015.igem.org/common/MathJax-2.5-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script> -->
 +
 
 +
 
 +
        <!-- Start of CSS-->
 
<style type="text/css">
 
<style type="text/css">
  
−
/*-- Remove borders, float content left and remove padding/margin */
+
/* WIKI SETTINGS*/
 +
 +
/* Hide first heading */
 +
.firstHeading {
 +
display: none;
 +
}
 +
 +
/*-- Remove borders, float content left and remove padding/margin */
 
#globalWrapper, #content{
 
#globalWrapper, #content{
 
background-color: transparent;
 
background-color: transparent;
 
border: 0px;
 
border: 0px;
−
border-bottom: 0px;
+
float: left;
−
float: none;
+
 
margin:0px;
 
margin:0px;
 
padding: 0px;
 
padding: 0px;
−
width: 100%;
+
                                width:100%;
−
color: #666;
+
−
list-style-image: none;
+
−
font-size: 14px;
+
 
}
 
}
  
−
#HQ_page th {
+
/*left align Black Menu Bar */
−
    background-color: transparent;
+
#top_menu_inside {  
−
    padding: 10px 40px;
+
margin:0 auto;
−
    color: black;
+
}
−
    border: none;
+
                        #topbanner {
−
    border-collapse: collapse;
+
                                              width:100%;
−
    vertical-align: text-top;
+
                                              color:#FF0000;
−
    text-transform: uppercase;
+
                        }
−
    text-align: center;
+
</style>
−
    letter-spacing: 3px;
+
 
−
font-size: 16px;
+
                       
−
font-weight: bond;
+
<!-- Start of CSS-->
 +
 
 +
<style type="text/css">
 +
 
 +
 +
 
 +
 
 +
 
 +
/* since the background is dark, we change the color of the text and links so they are visible on "show preview" mode */
 +
 
 +
p, #content {
 +
color:#000000;
 +
}
 +
 
 +
a, a:visited {
 +
color:#22BCB9;
 +
}
 +
 
 +
                /*USE HELVETICA*/
 +
                *{
 +
                    font-family:"Helvetica";
 +
                  }
 +
/* PAGE LAYOUT */
 +
 
 +
 +
/* Set up a width, height and color of the body wrapper*/
 +
html,body {
 +
                                margin:0;
 +
                                border:0;
 +
                                padding:0;
 +
}
 +
 
 +
/* Creates a container that will wrap all of the content inside your wiki pages. */
 +
#mainContainer {
 +
                                margin 0 auto;
 +
width: 100%;
 +
                                background-color: #F5FFFA;
 +
overflow:hidden;
 +
                                /*float:left;
 +
margin-left:120px;
 +
margin-bottom: 40px;
 +
border-bottom: 10px solid #000000;*/
 +
}
 +
 
 +
/* Creates the container for the menu */
 +
#menuContainer  {
 +
                                position:absolute;
 +
width: 100%;
 +
background-color: #458B74;
 +
                                list-style-type:none;
 +
}
 +
 
 +
/* Creates the container for the content */
 +
#contentContainer {
 +
                                margin:0 auto;
 +
                                margin-top:75px;
 +
                                width:75%;
 +
background-color: #fff;
 +
                                padding:20px;
 +
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
 +
                              font-size:16px;
 +
                              text-align: justify;
 +
}
 +
 
 +
 
 +
/*Set up height place holder for the banner*/
 +
#bannerContainer {
 +
                                position:fixed;
 +
                                width:100%
 +
height:40px;
 +
background-color: #FF0000;
 +
                                list-style-type:none;
 +
}
 +
 
 +
/*VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */
 +
 
 +
/*Change the styling of text for everything inside main container*/
 +
#mainContainer p {
 +
color: #000000;
 +
}
 +
 +
/*This changes the color and font family */
 +
#contentContainer h1, h2, h3, h4, h5, h6 {
 +
/*font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;*/
 +
color: #000000;
 +
border-bottom: none;
 +
/*font-weight: bold;*/
 +
/*margin-top:10px;*/
 +
}
 +
 
 +
/*Style of the links - links are different inside the menu */
 +
#contentContainer a {
 +
/*font-weight: bold;*/
 +
color: #000000;
 +
}
 +
 
 +
  /* Styling links on hover- links are different inside the menu */
 +
#contentContainer a:hover {
 +
color: #14747D;
 +
}
 +
 
 +
/*Change the styling of tables */
 +
        #contentContainer table {
 +
    border: 2px solid #29221F;
 +
    border-collapse: collapse;
 +
    margin: auto;
 +
    margin-bottom: 15px;
 +
    /*margin-top: 15px;*/
 +
    margin-right: 10px;
 +
    margin-left: 10px;
 +
    }
 +
 
 +
/*Change the styling of table cells*/
 +
    #contentContainer  td {
 +
    background-color: #fff;
 +
    padding: 10px;
 +
    border: 2px solid #29221F;
 +
    border-collapse: collapse;
 +
    vertical-align: text-top;
 +
    }
 +
 
 +
 
 +
/*Change the styling of table headers */
 +
    #contentContainer th {
 +
    background-color: #F4F0D8;
 +
    padding: 10px;
 +
    border: 2px solid #29221F;
 +
    border-collapse: collapse;
 +
    vertical-align: text-top;
 +
    }
 +
 
 +
 
 +
 
 +
 
 +
/*MENU STYLING */
 +
 
 +
/*Styling for the links in the menu */
 +
#menuContainer a {
 +
                                display:block;
 +
color: #fff;
 +
text-decoration:none;
 +
                                font-size:20px;
 +
}
 +
 
 +
                /*Styles the font links in the menu*/
 +
                #menuContainer a:hover {
 +
                                color:#FF6600;
 +
                      }
 +
 
 +
/* Sets the style for lists inside menuContainer  */
 +
#menuContainer ul {
 +
list-style-type: none;
 +
}
 +
 
 +
/*Styles the list items to become menu buttons */
 +
#menuContainer ul li {
 +
                                float:left;
 +
                                position:relative;
 +
text-align: center;
 +
display: inline-block;
 +
width: 14%;
 +
height:40px;
 +
                                line-height:40px;
 +
                                border-width:1px;
 +
                                border-color:#fff;
 +
                                border-style:none solid none solid;
 +
}
 +
 
 +
 
 +
/*Submenus are not displayed as default*/
 +
#menuContainer li ul {
 +
                                position:relative;
 +
display: none;
 +
                                width:100%;
 +
}
 +
 
 +
/*Submenus are displayed when hovering the menu button */
 +
#menuContainer li:hover ul {
 +
                                left:-21px;
 +
                                position:relative;
 +
display: block;
 +
}
 +
 
 +
                  #menuContainer li li:before {
 +
                              content: "";
 +
                              display: block;
 +
                              height: 20px;
 +
                              position: absolute;
 +
                              top:-5px;
 +
                              width: 100%;
 +
                        }
 +
 
 +
/*Style the submenu buttons*/
 +
#menuContainer li ul li{
 +
                                position:relative;
 +
                                background-color: #458B74 ;
 +
                                display:block;
 +
                                width:100%;
 +
                                border:none;
 +
}
 +
 
 +
                #cf {
 +
                        position:relative;
 +
                        height:500px;
 +
                        width:500px;
 +
                          margin:0 auto;
 +
                      }
 +
 
 +
                        #cf img {
 +
                            position:absolute;
 +
                            left:0;
 +
                            -webkit-transition: opacity 1s ease-in-out;
 +
                            -moz-transition: opacity 1s ease-in-out;
 +
                            -o-transition: opacity 1s ease-in-out;
 +
                            transition: opacity 1s ease-in-out;
 +
                          }
 +
 
 +
                          #cf img.top:hover {
 +
                          opacity:0;
 +
                            }
 +
 
 +
/*CLASSES */
 +
 
 +
/*Clear class for all the pages, adds spacing too*/
 +
.clear{
 +
clear:both;
 +
height: 10px;
 +
}
 +
 
 +
 
 +
/* highlight box for special messages */
 +
          .highlightBox {
 +
            width:500px;
 +
            margin:auto;
 +
            background-color: #F4F0D8;  
 +
    margin-bottom: 15px;
 +
    margin-top: 15px;
 +
    padding: 15px;
 +
    padding-top: 5px;
 +
            }
 +
 
 +
figure{
 +
display:inline-block;
 
}
 
}
  
−
#HQ_page td {
+
 
−
    padding: 0px;
+
figcaption {
−
    border: 0px solid #ccc;
+
−
    vertical-align: text-top;
+
 
     text-align: center;
 
     text-align: center;
−
     line-height: 35px;
+
     border:1px;
−
    font-size: 15px;
+
 
}
 
}
  
−
#top_menu_14 {
+
</style>
−
        background-color: rgba(120,194,196,1);
+
<!-- End of CSS -->
−
        border-bottom: 1px solid rgba(120,194,196,1);
+
  
−
}
 
  
 +
<!-- Start of the template html elements. -->
 +
                <body>     
 +
      <!--This will close on the page-->
 +
 +
                <div id ="mainContainer"><!--This div will close on the page.-->
  
−
#HQ_page .jumbotron p {
+
                <div id = "topbanner"></div>
−
text-align: center;
+
                <!--Start of Menu-->
−
margin-bottom: 15px;
+
<div id="menuContainer">
−
font-size: 21px;
+
−
font-weight: 200;
+
−
}
+
  
−
#HQ_page p {
+
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons -->
−
  margin: 0 0 25px;
+
<ul>
−
    text-align: justify;
+
<a href="https://2015.igem.org/Team:IIT_Madras"><li>Home</li></a>
−
    font-size: 18px;
+
−
  font-family: 'Raleway', sans-serif;
+
  
−
}
+
                                          <a href="#"><li>Project
 +
            <ul>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Background"><li>Background</li></a>
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Description"><li>Our Approach</li></a>
 +
                                                        <!--<a href="https://2015.igem.org/Team:IIT_Madras/In-Silico"><li>In-Silico</li></a> -->
 +
</ul>
 +
</li></a>
 +
                                   
 +
                                          <a href="#"><li>Experiments
 +
            <ul>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Notebook"><li>Notebook</li></a>
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Experiments"><li>Protocols</li></a>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Parts"><li>Parts</li></a>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Results"><li>Results</li></a>   
 +
</ul>
 +
</li></a>
  
 +
                                       
 +
                                      <a href="https://2015.igem.org/Team:IIT_Madras/Safety"><li>Safety</li></a>
  
−
#HQ_page h1 {
+
                                      <a href="https://2015.igem.org/Team:IIT_Madras/Practices"><li>Human Practices</li></a>                                       
−
    font-family: 'Just Me Again Down Here';
+
                                       
−
    border-bottom: none;
+
                                      <a href="https://2015.igem.org/Team:IIT_Madras/Future"><li>Future</li></a>
−
    font-weight: normal;
+
                                       
−
    margin-bottom: 0;
+
−
    margin-top: 0;
+
−
    padding-bottom: 25px;
+
−
   
+
−
}
+
  
 +
                                        <a href="#"><li>About Us</a>
 +
                                                <ul>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Team"><li>Team</li></a>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Attributions"><li>Attributions</li></a>
 +
<a href="https://2015.igem.org/Team:IIT_Madras/gallery"><li>Gallery</li></a>
 +
                                                </ul>
 +
                                        </li></a>
  
 +
<!--
  
−
#HQ_page h2, h3, h4, h5 {
+
                                        <a href="#"><li>Project
−
  font-family: 'Raleway', sans-serif;
+
            <ul>
−
    border-bottom: none;
+
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Background"><li>Background</li></a>
−
    font-weight: bold;
+
<a href="https://2015.igem.org/Team:IIT_Madras/Description"><li>Our Approach</li></a>
−
    margin-bottom: 0;
+
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/In-Silico"><li>In-Silico</li></a>
−
    margin-top: 0;
+
<a href="https://2015.igem.org/Team:IIT_Madras/Experiments"><li>Experiments &amp; Protocols</li></a> 
−
    text-transform: uppercase;
+
<a href="https://2015.igem.org/Team:IIT_Madras/Results"><li>Results</li></a> 
−
    font-size: 20px;
+
<a href="https://2015.igem.org/Team:IIT_Madras/Design"><li>Design</li></a>
−
    letter-spacing: 3px;
+
</ul>
−
color: black;
+
</li></a>
−
}
+
                                      <a href="#"><li>PARTS
 +
            <ul>
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Parts"><li>Team Parts</li></a>
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Basic_Part"><li>Basic Parts</li></a> 
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Composite_Part"><li>Composite Parts</li></a>
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Part_Collection"><li>Part Collection</li></a> 
 +
</ul>
 +
</li></a>
  
−
#top_title, #sideMenu{
+
 +
     
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Attributions"><li>ATTRIBUTIONS</li></a>
  
−
display: none;
+
<a href="https://2015.igem.org/Team:IIT_Madras/Collaborations"><li>COLLABORATIONS</li></a>
  
−
}
+
<a href="https://2015.igem.org/Team:IIT_Madras/Practices"><li>HUMAN PRACTICES</li></a>
−
</style>
+
 
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Safety"><li>SAFETY</li></a>
 +
 
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Modeling"><li>MODELING</li></a>
 +
 
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Measurement"><li>MEASUREMENT</li></a>
 +
 
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Software"><li>SOFTWARE</li></a>
 +
 
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Entrepreneurship"><li>ENTREPRENEURSHIP</li></a> -->
 +
 
 +
</ul>
 +
</div>
 +
 
 +
                      <!--End of Menu-->
 +
 
 +
<!--<br><br><br>
 +
<div style="text-align: center;">
 +
<img height="400px" width="400px" src="https://static.igem.org/mediawiki/2015/9/9d/Black%26WhiteiGEMlogo1.png">
 +
</div>-->
 +
 
 +
 
 +
 +
</body>
 +
<!-- Start of content -->
 +
</html>
 +
<div id="contentContainer">

Revision as of 10:01, 28 October 2017