Template:WashU/Layout

From 2014.igem.org

(Difference between revisions)
(CSS)
 
(83 intermediate revisions not shown)
Line 1: Line 1:
-
@charset 'UTF-8';
+
<!-- Thanks to 2013 Team Tokyo for drop down menu template https://2013.igem.org/Template:Team:TMU-Tokyo/drop-menu.css -->
-
#cssmenu {
+
 
-
   border: none;
+
<html>
-
   border: 0px;
+
    <style>
-
   margin: 0px;
+
 
 +
#dropmenu {
 +
   list-style: none;
 +
   align: center;
 +
  width:828px;
 +
  height: 40px;
 +
   margin: 30px auto 40px;
 +
  z-index: 9999;
   padding: 0px;
   padding: 0px;
-
   font-family: verdana, geneva, arial, helvetica, sans-serif;
+
   background: #FFCCE0;
-
   font-size: 14px;
+
   border-radius: 0 0 0 0;
-
  font-weight: bold;
+
-
  color: #8e8e8e;
+
-
  width: auto;
+
}
}
-
#cssmenu > ul {
+
 
-
   margin-top: 6px !important;
+
#dropmenu li {
 +
  position: relative;
 +
  width:  137px;
 +
  float: left;
 +
   margin: 0px;
 +
  padding: 0;
 +
  text-align: center;
 +
  z-index: 9999;
 +
  border-right: 1px solid #fff;
}
}
-
#cssmenu ul {
+
    
-
   background: #CDCDCD;
+
-
  background: -webkit-linear-gradient(#cdcdcd 0%, #e2e2e2 80%, #cdcdcd 100%);
+
#dropmenu li a {
-
  background: linear-gradient(#cdcdcd 0%, #e2e2e2 80%, #cdcdcd 100%);
+
   display: block;
-
  border-top: 1px solid #A8A8A8;
+
-
  -webkit-box-shadow: inset 0 1px 0 #e9e9e9, 0 1px 0 #03a66a, 0 2px 0 #1cb67d, 0 8px 0 #03a66a, 0 9px 0 #02794d, 0 -1px 1px rgba(0, 0, 0, 0.1);
+
-
  -moz-box-shadow: inset 0 1px 0 #e9e9e9, 0 1px 0 #03a66a, 0 2px 0 #1cb67d, 0 8px 0 #03a66a, 0 9px 0 #02794d, 0 -1px 1px rgba(0, 0, 0, 0.1);
+
-
  box-shadow: inset 0 1px 0 #e9e9e9, 0 1px 0 #03a66a, 0 2px 0 #1cb67d, 0 8px 0 #03a66a, 0 9px 0 #02794d, 0 -1px 1px rgba(0, 0, 0, 0.1);
+
-
  height: 27px;
+
-
   list-style: none;
+
   margin: 0;
   margin: 0;
-
   padding: 0;
+
   padding: 5px 0 5px;
 +
  color: #000;
 +
  font-family: "calibri",sans-serif ;
 +
  font-size: 18px;
 +
  font-weight: bold ;
 +
  line-height: 1.63;
 +
  z-index: 9999;
 +
  border-bottom: 1px solid #FFFFFF;
 +
  text-decoration: none;
}
}
-
#cssmenu ul ul {
+
#dropmenu li:hover > a{
-
   border-top: 6px solid #03a66a;
+
   background: #F08080;
-
   -webkit-box-shadow: none;
+
   color:#00000;
-
  -moz-box-shadow: none;
+
   z-index: 9999;
-
   box-shadow: none;
+
}
}
-
#cssmenu ul ul a {
+
#dropmenu > li:hover > a{
-
   line-height: 43px;
+
   border-radius: 0 0 0 0;
}
}
-
#cssmenu ul ul ul {
+
#dropmenu li ul {
-
   left: 100%;
+
   position: absolute;
-
   top: 0;
+
  top: 100%;
 +
   left: 0;
 +
  list-style: none;
 +
  margin: 0;
 +
  z-index: 9999;
 +
  border-radius: 0 0 0 0;
}
}
-
#cssmenu li {
+
 
-
   float: left;
+
 
-
   padding: 0px 8px 0px 8px;
+
#dropmenu li ul li{
 +
   overflow: hidden;
 +
   width: 100%;
 +
  height: 0px;
 +
  background: #FFCCE0;
 +
  color: #000000;
 +
  -moz-transition: .2s;
 +
  -webkit-transition: .2s;
 +
  -o-transition: .2s;
 +
  -ms-transition: .2s;
 +
  transition: .2s;
}
}
-
#cssmenu li a {
+
 
-
   color: #666666;
+
#dropmenu li ul li a{
-
   display: block;
+
   padding: 5px 5px;
-
  font-weight: bold;
+
   background: #FFCCE0; <!--F08080-->
-
  line-height: 30px;
+
-
  padding: 0px 25px;
+
   text-align: center;
   text-align: center;
-
   text-decoration: none;
+
　font-size: 10px;
 +
  z-index: 9999;
 +
   font-weight: normal;
}
}
-
#cssmenu li a:hover {
+
 
-
   color: #000000;
+
#dropmenu li:hover ul li{
-
   text-decoration: none;
+
   overflow: visible;
 +
  z-index: 9999;
 +
  height: 40px;
 +
  border-bottom: 1px solid #FFFFFF;
 +
   border-radius: 0 0 0 0;
}
}
-
#cssmenu li ul {
 
-
  background: #e0e0e0;
 
-
  border-left: 2px solid #03a66a;
 
-
  border-right: 2px solid #03a66a;
 
-
  border-bottom: 2px solid #03a66a;
 
-
  display: none;
 
-
  height: auto;
 
-
  filter: alpha(opacity=95);
 
-
  opacity: 0.95;
 
-
  position: absolute;
 
-
  width: 225px;
 
-
  z-index: 200;
 
-
  /*top:1em;
 
-
/*left:0;*/
 
 +
#dropmenu li:hover ul li:hover a{
 +
  z-index: 9999;
 +
  background: #F08080;
 +
  color:#00000
 +
  border-radius: 0 0 0 0;
}
}
-
#cssmenu li:hover > ul {
+
 
-
   display: block;
+
#dropmenu li:hover ul li:first-child{
 +
   border-top: 1px solid #fff;
}
}
-
#cssmenu li li {
+
#dropmenu li:hover ul li:last-child{
-
   display: block;
+
   border-bottom: 1px solid #fff;
-
  float: none;
+
-
  padding: 0px;
+
-
  position: relative;
+
-
  width: 225px;
+
}
}
-
#cssmenu li ul a {
+
#dropmenu li:hover ul li:last-child a{
-
   display: block;
+
   border-radius: 0 0 0 0;
-
  font-size: 12px;
+
-
  font-style: normal;
+
-
  padding: 0px 10px 0px 15px;
+
-
  text-align: left;
+
}
}
-
#cssmenu li ul a:hover {
+
 
-
  background: #949494;
+
<!-- Floating Menu -->
-
  color: #000000;
+
div.floating-menu {
-
  opacity: 1.0;
+
        position:fixed;
-
  filter: alpha(opacity=100);
+
        background:#fff4c8;
 +
        border:1px solid #ffcc00;
 +
        width:150px;
 +
        height:auto;
 +
        z-index:100;
}
}
-
#cssmenu p {
+
 
-
  clear: left;
+
div.floating-menu a, div.floating-menu h3 {
-
}
+
        display:block;
-
#cssmenu .active > a {
+
        text-align: center;
-
  background: #03a66a;
+
        margin:0 0.5em;
-
  -webkit-box-shadow: 0 -4px 0 #03a66a, 0 -5px 0 #1cb67d, 0 -6px 0 #03a66a;
+
-
  -moz-box-shadow: 0 -4px 0 #03a66a, 0 -5px 0 #1cb67d, 0 -6px 0 #03a66a;
+
-
  box-shadow: 0 -4px 0 #03a66a, 0 -5px 0 #1cb67d, 0 -6px 0 #03a66a;
+
-
  color: #ffffff;
+
-
}
+
-
#cssmenu .active > a:hover {
+
-
  color: white;
+
}
}
 +
 +
<!-- End floating Menu -->
 +
</style>
 +
</html>
 +
 +
<html>
 +
<div id="content">
 +
<ul id="dropmenu">
 +
 +
  <li><a href="https://2014.igem.org/Team:WashU_StLouis">Home</a>
 +
    </li>
 +
 +
  <li><a href="https://2014.igem.org/Team:WashU_StLouis/Team">Team</a>
 +
    <ul>
 +
      <li><a href="https://2014.igem.org/Team:WashU_StLouis/Team/Members">Members</a></li>
 +
      <li><a href="https://2014.igem.org/Team:WashU_StLouis/Attributions">Attributions</a></li>
 +
      <li><a href="https://igem.org/Team.cgi?year=2014&team_name=WashU_StLouis" target="_blank">Team Profile</a></li>
 +
    </ul>
 +
  </li>
 +
 +
  <li><a href="https://2014.igem.org/Team:WashU_StLouis/Project">Project</a>
 +
    <ul>
 +
      <li><a href="https://2014.igem.org/Team:WashU_StLouis/Project/nif">Nitrogenase</a></li>
 +
      <li><a href="https://2014.igem.org/Team:WashU_StLouis/Project/light">Light Regulation</a></li>
 +
      <li><a href="https://2014.igem.org/Team:WashU_StLouis/Project/collaboration">Collaboration</a></li>
 +
      <li><a href="https://2014.igem.org/Team:WashU_StLouis/Parts">Parts</a></li>
 +
    </ul>
 +
  </li>
 +
 +
  <li><a href="https://2014.igem.org/Team:WashU_StLouis/Notebook">Notebook</a>
 +
    <ul>
 +
      <li><a href="https://2014.igem.org/Team:WashU_StLouis/Notebook/September"> Post Summer </a></li>     
 +
      <li><a href="https://2014.igem.org/Team:WashU_StLouis/Protocol">Protocols</a></li>
 +
    </ul>
 +
  </li>
 +
 +
  <li><a href="https://2014.igem.org/Team:WashU_StLouis/Outreach">Outreach</a>
 +
    <ul>
 +
      <li><a href="https://2014.igem.org/Team:WashU_StLouis/Web_Series">Video Series</a></li>
 +
      <li><a href="https://2014.igem.org/Team:WashU_StLouis/Safety">Lab safety</a></li>
 +
    </ul>     
 +
  </li>
 +
 +
<li>
 +
<a href="https://igem.org/Main_Page" target="_blank"> <img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="29px"></a>
 +
</li>
 +
 +
</div>
 +
 +
</html>

Latest revision as of 22:19, 17 October 2014


Retrieved from "http://2014.igem.org/Template:WashU/Layout"