Difference between revisions of "Template:BIT-China"

 
(31 intermediate revisions by the same user not shown)
Line 40: Line 40:
 
                                 font-size: 17px;
 
                                 font-size: 17px;
 
                                 line-height: 1.5em;
 
                                 line-height: 1.5em;
font-family: "Calibri", Helvetica, Arial;
+
font-family: Calibri, Arial;
 
}
 
}
  
/* Creates the container for the menu */
+
 
#menuContainer  {
+
float:left;
+
width: 100%;
+
padding: 20px 0px;
+
border-top: 14px solid #565656;
+
background-color: #E8E8E9;
+
}
+
  
 
/* Creates the container for the content */
 
/* Creates the container for the content */
Line 93: Line 86:
 
  /* Styling links on hover- links are different inside the menu */
 
  /* Styling links on hover- links are different inside the menu */
 
#contentContainer a:hover {  
 
#contentContainer a:hover {  
color: #59bf92;
+
color: #f5a107;
 
}
 
}
 
+
   
/*Change the styling of tables */
+
        #contentContainer table {
+
    border: 1px solid #565656;
+
    border-collapse: collapse;
+
    width: 90%
+
    margin: auto;
+
    margin-bottom: 15px;
+
    margin-top: 15px;
+
    margin-right: 10px;
+
    margin-left: 10px;
+
    }
+
 
+
/*Change the styling of table cells*/
+
    #contentContainer td {
+
    padding: 10px;
+
    border: 1px solid #565656;
+
    border-collapse: collapse;
+
    vertical-align: text-top;
+
    }
+
 
+
/*Change the styling of table headers */
+
    #contentContainer th {
+
    background-color: #E8E8E9;
+
    padding: 10px;
+
    border: 1px solid #565656;
+
    border-collapse: collapse;
+
    vertical-align: text-top;
+
    }
+
 
+
             
+
                       
+
  
 
 
Line 153: Line 115:
  
 
                 /*MENU STYLING */
 
                 /*MENU STYLING */
#menuContainer{
+
  #menuContainer{
 
width:100%;
 
width:100%;
 
height:95px;
 
height:95px;
background-color: white;
+
background-color:#106f9c;
 
background-position:bottom;
 
background-position:bottom;
 +
        background-image:url("https://static.igem.org/mediawiki/2015/8/8e/BIT_China_nav_bg.png");
 
position:fixed;
 
position:fixed;
 +
top:18px;
 
padding-top:5px;
 
padding-top:5px;
 
z-index: 100;
 
z-index: 100;
 +
        background-repeat: no-repeat;
 +
 
   }
 
   }
 +
#menuContainer p{
 +
color:#ffffff;
 +
}
 
   /* 背景绿色background-color:#c9e77f;*/
 
   /* 背景绿色background-color:#c9e77f;*/
 
   #top_nav{
 
   #top_nav{
Line 186: Line 155:
 
   }
 
   }
  
  #top_nav_igem{
+
 
float:right;
+
margin-right:30px;
+
margin-top:-100px;
+
  }
+
 
   #taiji{
 
   #taiji{
 
     margin:5px 8px;
 
     margin:5px 8px;
Line 197: Line 162:
 
   }
 
   }
 
   #top_nav_bulge{
 
   #top_nav_bulge{
    position:fixed;
+
        position:fixed;
top:94px;
+
top:118px;
 
width:100%;
 
width:100%;
 
height:45px;
 
height:45px;
    background-image:url("../image/top_nav_bulge.png");
+
        background-color: #106f9c;
visibility:hidden;
+
        background-image:url("https://static.igem.org/mediawiki/2015/d/d6/BIT_China_nav_bg2.png");
 +
        background-position:top;
 +
        background-repeat: no-repeat;
 
   }
 
   }
/*
 
  #top_nav_bulge{
 
width:100%;
 
height:125px;
 
background-image:url("../image/top_nav_bulge.png");
 
background-repeat:no-repeat;
 
background-position:center;
 
z-index:-1;
 
position:absolute;
 
  }
 
*/
 
 
 
#top_nav li{
 
#top_nav li{
 
     float:left;
 
     float:left;
Line 238: Line 193:
 
line-height:20px;
 
line-height:20px;
 
border-left:3px dashed;
 
border-left:3px dashed;
 +
display: inline;
 +
text-decoration:none;
 
}
 
}
 
#top_nav li:hover span {  
 
#top_nav li:hover span {  
Line 245: Line 202:
 
visibility:visible;
 
visibility:visible;
 
}
 
}
#top_nav li span a {
+
#menuContainer a p{
display: inline;
+
}
+
#menuContainer a{
+
 
text-decoration:none;
 
text-decoration:none;
 
}
 
}
 
#menuContainer a:link, #menuContainer a:visited{
 
#menuContainer a:link, #menuContainer a:visited{
     color:#68441c;
+
     color:#eeeeee;
 
}
 
}
 
#menuContainer a:active{
 
#menuContainer a:active{
Line 261: Line 215:
 
}
 
}
 
#top_nav li:hover span a{  
 
#top_nav li:hover span a{  
color:#597d01;
+
color:#cccccc;
 
}
 
}
 
+
#menuContainer a:hover p{
 
+
color:#f5a107;
@media screen and (max-width:1260px){
+
}
  #top_nav_igem{
+
#top_nav li span a:hover{
margin-top:20px;
+
color:#f5a107;
 +
border-left:3px dashed #eeeeee;
 +
}
 +
#menuContainer{
 +
                z-index:999;
 
   }
 
   }
 +
@media screen and (max-width:1260px){
 
   #top_nav{
 
   #top_nav{
 
width:1000px;
 
width:1000px;
Line 276: Line 235:
 
height:60px;
 
height:60px;
 
margin:0 23px;
 
margin:0 23px;
 +
 
   }
 
   }
 
}
 
}
Line 392: Line 352:
 
}
 
}
 
}
 
}
 +
 
</style>
 
</style>
 
<!-- End of CSS -->
 
<!-- End of CSS -->
 
+
<script>
 +
$(document).ready(function () {
 +
$('#top_nav_bulge').hide();
 +
$('#menuContainer').mouseover(function(){
 +
$('#top_nav_bulge').show();
 +
})
 +
$('#menuContainer').mouseout(function(){
 +
$('#top_nav_bulge').hide();
 +
})
 +
})
 +
</script>
  
 
<!-- Start of the template html elements. -->
 
<!-- Start of the template html elements. -->
Line 410: Line 381:
 
<!-- Start of menu -->
 
<!-- Start of menu -->
 
<div id="menuContainer">
 
<div id="menuContainer">
 
+
                                <div id="top_nav_bulge" >
 +
                </div>
 
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons -->
 
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons -->
 
                                         <div id="top_nav">
 
                                         <div id="top_nav">
Line 421: Line 393:
 
<span id="nav_second_level">
 
<span id="nav_second_level">
 
<a href="https://2015.igem.org/Team:BIT-China/Description">Description</a>
 
<a href="https://2015.igem.org/Team:BIT-China/Description">Description</a>
<a href="https://2015.igem.org/Team:BIT-China/Background">Background</a>
 
 
<a href="https://2015.igem.org/Team:BIT-China/Design">Design</a>
 
<a href="https://2015.igem.org/Team:BIT-China/Design">Design</a>
<a href="html/program_Regulation_Subsystem.html">Basic circuits</a>
+
<a href="https://2015.igem.org/Team:BIT-China/project_Basic_circuits.html">Basic circuits</a>
<a href="html/program_Resistance_Subsystem.html">Fine-regulation circuits</a>
+
<a href="https://2015.igem.org/Team:BIT-China/project_Fine-regulation_circuits.html">Fine-regulation circuits</a>
 
+
 
</span>
 
</span>
 
</li>
 
</li>
Line 434: Line 404:
 
</div></a>
 
</div></a>
 
<span id="nav_second_level">
 
<span id="nav_second_level">
<a href="#">Basic circuits</a>
+
<a href="https://2015.igem.org/Team:BIT-China/modeling_Basic_circuits.html">Basic circuits</a>
<a href="#">Fine-regulation circuits</a>
+
<a href="https://2015.igem.org/Team:BIT-China/modeling_Fine-regulation_circuits.html">Fine-regulation circuits</a>
 
</span>   
 
</span>   
 
</li>
 
</li>
Line 455: Line 425:
 
<span id="nav_second_level">
 
<span id="nav_second_level">
 
<a href="https://2015.igem.org/Team:BIT-China/Parts">Parts Submission</a>
 
<a href="https://2015.igem.org/Team:BIT-China/Parts">Parts Submission</a>
<a href="#">Achievements</a>
+
<a href="https://2015.igem.org/Team:BIT-China/Achievements">Achievements</a>
<a href="https://2015.igem.org/Team:BIT-China/Collaborations">Collaboration </a>
+
 
</span>   
 
</span>   
 
</li>
 
</li>
 
<li>
 
<li>
 
<div>
 
<div>
<img src="https://static.igem.org/mediawiki/2015/f/f2/BIT_China_logo_project.png" id="taiji" class="rotating"/>
+
<a href="https://2015.igem.org/Team:BIT-China"><img src="https://static.igem.org/mediawiki/2015/f/f2/BIT_China_logo_project.png" id="taiji" class="rotating"/></a>
 
</div>
 
</div>
 
</li>
 
</li>
 
<li>
 
<li>
<a href="#" ><div id="active">
+
<a href="" ><div id="active">
 
<img src="https://static.igem.org/mediawiki/2015/7/76/BIT_China_icon_team.png" class="top_nav_icon"/>
 
<img src="https://static.igem.org/mediawiki/2015/7/76/BIT_China_icon_team.png" class="top_nav_icon"/>
 
<p>Team</p>
 
<p>Team</p>
 
</div></a>
 
</div></a>
<span id="nav_second_level">
+
<span id="nav_second_level">
<a href="html/team.html">Instructors</a>
+
<a href="https://2015.igem.org/Team:BIT-China/Team">Team</a>
<a href="html/team.html">Advisors</a>
+
<a href="https://2015.igem.org/Team:BIT-China/gallery">Gallery</a>
<a href="html/team.html">Students</a>
+
 
</span>   
 
</span>   
 +
 
</li>
 
</li>
 
<li>
 
<li>
<a href="https://2015.igem.org/Team:BIT-China/Practices"><div>
+
<a href=""><div>
 
<img src="https://static.igem.org/mediawiki/2015/7/75/BIT_China_icon_practice.png" class="top_nav_icon" />
 
<img src="https://static.igem.org/mediawiki/2015/7/75/BIT_China_icon_practice.png" class="top_nav_icon" />
 
<p>Practice</p>
 
<p>Practice</p>
 
</div></a>
 
</div></a>
 +
                                                        <span id="nav_second_level">
 +
<a href="https://2015.igem.org/Team:BIT-China/Practices">Human Practice</a>
 +
<a href="https://2015.igem.org/Team:BIT-China/Collaborations">Collaboration </a>
 +
</span> 
 
</li>
 
</li>
 
<li>
 
<li>
Line 488: Line 461:
 
<span id="nav_second_level">
 
<span id="nav_second_level">
 
<a href="https://2015.igem.org/Team:BIT-China/Safety">Safety</a>
 
<a href="https://2015.igem.org/Team:BIT-China/Safety">Safety</a>
<a href="#">Q/A</a>
+
<a href="https://2015.igem.org/Team:BIT-China/Questions_and_answers">Q/A</a>
 
</span>   
 
</span>   
 
</li>
 
</li>
 
<li>
 
<li>
<a href="https://2015.igem.org/Team:BIT-China/Attributions"><div>
+
<a href="#"><div>
 
<img src="https://static.igem.org/mediawiki/2015/2/21/BIT_China_icon_sponsor.png" class="top_nav_icon" />
 
<img src="https://static.igem.org/mediawiki/2015/2/21/BIT_China_icon_sponsor.png" class="top_nav_icon" />
 
<p>Attributions</p>
 
<p>Attributions</p>
 
</div></a>
 
</div></a>
 +
                                                        <span id="nav_second_level" style="margin-left:-100px;">
 +
<a href="https://2015.igem.org/Team:BIT-China/Attributions">Attributions</a>
 +
<a href="https://2015.igem.org/Team:BIT-China/Sponsors">Sponsors</a>
 +
</span> 
 
</li>
 
</li>
 
</ul>
 
</ul>
Line 503: Line 480:
 
</div>
 
</div>
 
<!-- End of menu  -->
 
<!-- End of menu  -->
<h1 sytle="text-indent:20px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;李晨翊快给我文字!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!</h1>
+
 
 
<!-- Start of content -->
 
<!-- Start of content -->
 
<div id="contentContainer"> <!--The closing tag for contentContainer should be placed at the bottom of each content page.-->
 
<div id="contentContainer"> <!--The closing tag for contentContainer should be placed at the bottom of each content page.-->
 
</html>
 
</html>
 
 
<!--
 
/*MENU STYLING */
 
 
/*Styling for the links in the menu */
 
#menuContainer a {
 
color: #565656;
 
text-decoration:none;
 
font-weight: bold;
 
}
 
 
/* Sets the style for lists inside menuContainer  */
 
#menuContainer ul {
 
list-style: none;
 
margin-left:0px;
 
}
 
 
/*Styles the list items to become menu buttons */
 
#menuContainer ul li {
 
text-align: center;
 
display: block;
 
width: 100%;
 
height:30px;
 
padding-top:10px;
 
}
 
 
/*For the menu buttons, changes the color when hovering*/
 
#menuContainer li:hover {
 
color:  #FFF;
 
background-color: #24B694;
 
}
 
 
/*Submenus are not displayed as default*/
 
#menuContainer li ul {
 
display: none;
 
padding-top:15px;
 
margin-left: -19px;
 
}
 
 
/*Submenus are displayed when hovering the menu button */
 
#menuContainer li:hover ul {
 
/*display: inline-block; */
 
display: block;
 
position: absolute;
 
float:right;
 
margin-left: 134px;
 
margin-top:-42px;
 
}
 
 
/*Style the submenu buttons*/
 
#menuContainer li ul li{
 
background-color: #59BF92;
 
padding-left:20px;
 
padding-right:20px;
 
height:30px;
 
padding-top:10px;
 
margin-top:-2px;
 
color: #565656;
 
width: 150px;
 
}
 
-->
 

Latest revision as of 04:21, 20 October 2015