Team:UT-Tokyo-Software/Template

From 2012.igem.org

(Difference between revisions)
m
 
(106 intermediate revisions not shown)
Line 1: Line 1:
 +
__NOTOC__
<html>
<html>
 +
<link href='http://fonts.googleapis.com/css?family=Oxygen+Mono' rel='stylesheet' type='text/css'>
<head>
<head>
 +
<script language="JavaScript">
 +
if (document.getElementById){
 +
document.write('<style type="text/css">\n')
 +
document.write('<!--\n')
 +
document.write('.akoML{display: none;}\n')
 +
document.write('-->\n')
 +
document.write('</style>\n') }
 +
function kirikae(akoO){
 +
if(document.getElementById){
 +
var baba = document.getElementById(akoO);var obaba = document.getElementById("akoD").getElementsByTagName("span");
 +
if(baba.style.display != "block"){
 +
for (var kazu=0; kazu<obaba.length; kazu++){
 +
if (obaba[kazu].className=="akoML")
 +
obaba[kazu].style.display = "none";}
 +
baba.style.display = "block";
 +
}else{
 +
baba.style.display = "none";}}}
 +
</script>
<style type="text/css">
<style type="text/css">
-
.firstHeading{
+
 
 +
/* @group fix nasty default header settings */
 +
.firstHeading {
   display: none;
   display: none;
}
}
 +
 +
#footer-box{
 +
  border-top:1pt #333 dotted;
 +
  border-left:none;
 +
  border-right:none;
 +
  border-bottom:none;
 +
}
 +
 +
#content{
 +
  border:none;
 +
}
 +
 +
#top-section {
 +
  background-color: #fff;
 +
  width:975px;
 +
  height:16px;
 +
  color:#333;
 +
  border-top:none;
 +
  border-left:none;
 +
  border-right:none;
 +
  border-bottom:1pt #333 dotted;
 +
}
 +
 +
#p-logo {
 +
    display: none;
 +
}
 +
 +
#search-controls {
 +
  display: none;
 +
}
 +
 +
.left-menu {
 +
  position: absolute;
 +
  top:0px;
 +
  left:0px;
 +
  color: #333;
 +
}
 +
 +
.left-menu:hover {
 +
  color: #333;
 +
  background-color: #fff;
 +
}
 +
 +
.left-menu a{
 +
  text-transform:none;
 +
  color:#333;
 +
}
 +
 +
 +
.right-menu {
 +
  position: absolute;
 +
  top:0px;
 +
  right:0px;
 +
}
 +
 +
.right-menu li a {
 +
  background-color: #fff;
 +
}
 +
 +
 +
 +
#menubar a{
 +
  color: #333;
 +
  text-decoration:none;
 +
}
 +
 +
/* @end */
 +
a:link {
a:link {
-
color: #6699ff
+
color: #49C0F2;
text-decoration: none;
text-decoration: none;
}
}
a:visited {
a:visited {
-
   color: #6699ff
+
   color: #49C0F2;
   text-decoration: none;
   text-decoration: none;
}
}
a:active {
a:active {
-
color: #6699cc
+
color: #EF4BB9;
}
}
a:hover {  
a:hover {  
-
   color: #6699cc
+
   color: #EF4BB9;
}
}
-
 
#catlinks{
#catlinks{
   display:none;
   display:none;
}
}
div#globalWrapper{
div#globalWrapper{
 +
background-color: #fff;
   font-size: 13px;
   font-size: 13px;
}
}
 +
div#content{
div#content{
   line-height: 1.7;
   line-height: 1.7;
 +
  height:120%;
}
}
h1, h2, h3{
h1, h2, h3{
   line-height: 1.5em;
   line-height: 1.5em;
 +
  border-color: #49C0F2;
}
}
body {
body {
Line 38: Line 131:
}
}
#honbun{
#honbun{
-
  position:relative;
 
   float:right;
   float:right;
-
   width:660px;
+
   width:800px;
 +
  margin : 30px 0 0 0;
}
}
header{
header{
-
   width:800px;
+
  position: absolute;
-
   float:top; margin:20px;
+
   width:770px;
 +
   float:top;
 +
  margin:120px 20px 20px 40px;
 +
  color:#EF4BB9;
}
}
menuu{
menuu{
-
   width:150px;
+
  position:absolute;
 +
   width:160px;
   float:left;
   float:left;
 +
  top:225px;
 +
  left:5px;
}
}
article{
article{
-
   width:620px;
+
  position:relative;
 +
   width:700px;
   float:left;
   float:left;
 +
  margin:180px 0 0 50px;
}
}
footer{
footer{
Line 60: Line 161:
}
}
-
<!--Menu-->
+
 
-
#positioner
+
 
-
{
+
 
-
  position: relative;
+
/* Menu */
-
  width: 160px;
+
.akoL{
-
  height: 160px;
+
text-align: left;
-
  margin-left: 10px;
+
vertical-align: middle;
-
  z-index: 100;
+
margin-bottom: 0px;
 +
background-color: #fff;
 +
font:14px 'Oxygen Mono', sans-serif;
 +
color: #000;
 +
width: 160px;
 +
height: 30px;
 +
padding: 9px 0 0 5px;
 +
border: 1px #CECECE dashed;
}
}
-
#holder
+
 
-
{
+
.akoL:hover{
-
  position: absolute;
+
background-color: #49C0F2;
-
  width: 150px;
+
color:#fff;
-
  overflow: hidden;
+
-
  border: 0px solid #000;
+
}
}
-
dl.menu
+
 
-
{
+
.akoL a{
-
  width: 300px;
+
text-decoration: none;
-
  float: left;
+
color: #666;
-
  margin: -32700px -150px 0 0;
+
}
}
-
dl.menu a
+
 
-
{
+
.akoL a:hover, a:active{
-
  display: block;
+
color:#fff;
-
  height: 30px;
+
-
  color: #000;
+
-
  font: normal 12px/28px sans-serif, sans-serif;
+
-
  text-decoration: none;
+
-
  text-align: center;
+
}
}
-
dl.menu dt
+
 
-
{
+
.akoM{
-
  float: left;
+
text-align: left;
-
  padding: 0;
+
vertical-align: middle;
-
  margin: 32700px 0 0 0;
+
margin-bottom: 0px;
-
  position: relative;
+
background-color: #fff;
-
  z-index: 50;
+
font:14px 'Oxygen Mono', sans-serif;
 +
color: #666;
 +
width: 160px;
 +
height: 30px;
 +
padding: 9px 0 0 5px;
 +
border: 1px #CECECE dashed;
}
}
-
dl.menu dt a
+
 
-
{
+
.akoM:hover{
-
  background: transparent;
+
background-color: #49C0F2;
-
  width: 150px;
+
cursor: pointer;
}
}
-
dl.menu dt a:hover, dl.menu dt a:focus, dl.menu dt a:active
+
 
-
{
+
.akoML{
-
  margin-right: 1px;
+
text-align: left;
 +
vertical-align: middle;
 +
margin-bottom: 0px;
 +
background-color: #fff;
 +
color: #333;
 +
font:12px 'Oxygen Mono', sans-serif;
 +
width: 160px;
 +
padding: 4px 0 0 5px;
 +
border:1px #CECECE dashed;
}
}
-
dl.menu dd
+
 
-
{
+
.akoML:hover{
-
  float: left;
+
background-color: #49C0F2;
-
  padding: 30px 0 0 0;
+
}
-
  margin: -30px 0 0 0;
+
 
 +
.akoML a{
 +
text-decoration: none;
 +
background-color: #fff;
 +
color: #666;
 +
padding: 0px;
 +
}
 +
 
 +
.akoML a:hover, a:active{
 +
background-color: #49C0F2;
 +
color:#fff;
 +
}
 +
 
 +
#positioner{
   position: relative;
   position: relative;
-
   z-index: 10;
+
   width: 180px;
 +
  height: 160px;
 +
  margin-left: 10px;
}
}
-
dl.menu dd a
+
#holder{
-
{
+
   position: absolute;
-
   background: #666;
+
   width: 180px;
-
   width: 150px;
+
  overflow: hidden;
}
}
-
dl.menu dd a:hover, dl.menu dd a:focus, dl.menu dd a:active
+
#toplogo{
-
{
+
  position: absolute;
-
   margin-right: 1px;
+
  width: 975px;
-
   background: #ccc;
+
  height: 150px;
-
   color: #000;
+
  overflow: hidden;
 +
   border: 0;
 +
   top: 0;
 +
   left: 0;
}
}
 +
</style>
</style>
</head>
</head>
<body>
<body>
 +
<div id="toplogo">
 +
<a href="https://2012.igem.org/Team:UT-Tokyo-Software">
 +
<img src="https://static.igem.org/mediawiki/2012/b/b8/12UT-Tokyo-Software.png" >
 +
</a>
 +
</div>
 +
<menuu>
<menuu>
-
  <div id="wrapper">
+
<div id="wrapper">
-
    <div id="info">   
+
<div id="info">   
-
      <br /> 
+
    <div id="positioner">   
-
      <div id="positioner">   
+
         <div id="holder">   
         <div id="holder">   
-
          <dl class="menu">
+
<div id="akoD">
-
            <dt><a href="https://2012.igem.org/Team:UT-Tokyo-Software">Home</a> </dt>
+
 
-
          </dl>
+
<div class="akoL"><a href="https://2012.igem.org/Team:UT-Tokyo-Software">Home</a></div>
-
          <dl class="menu">
+
 
-
            <dt><a href="https://2012.igem.org/Team:UT-Tokyo-Software/Team">Team</a> </dt>
+
<div class="akoM" onclick="kirikae('list1')">Team</div>
-
<dd> 
+
<span class="akoML" id="list1">
-
              <a href="#url">Member</a>  
+
<a href="https://2012.igem.org/Team:UT-Tokyo-Software/Team"> Member </a><br>
-
              <a href="#url">Attribution</a>
+
<a href="https://2012.igem.org/Team:UT-Tokyo-Software/Attributions"> Attributions </a><br>
-
            </dd>
+
<a href="https://2012.igem.org/Team:UT-Tokyo-Software/Collaboration"> Collaboration </a><br>
-
          </dl>
+
</span>
-
          <dl class="menu">
+
 
-
            <dt><a href="https://2012.igem.org/Team:UT-Tokyo-Software/Project">Project</a> </dt>
+
<div class="akoM" onclick="kirikae('list2')">Project</div>
-
            <dd> 
+
<span class="akoML" id="list2">
-
              <a href="#url">Introduction</a>  
+
<a href="https://2012.igem.org/Team:UT-Tokyo-Software/Project"> Introduction </a><br>
-
              <a href="#url">BIOBRICK</a>  
+
<a href="https://2012.igem.org/Team:UT-Tokyo-Software/Project/BioBrickPuzzle"> BioBrick Puzzle </a><br>
-
              <a href="#url">Genetic Network</a>  
+
<a href="https://2012.igem.org/Team:UT-Tokyo-Software/Project/GeneNetworkGame"> Gene Network Game </a><br>
-
              <a href="#url">BIOBRICK Search</a>
+
<a href="https://2012.igem.org/Team:UT-Tokyo-Software/Project/PastProjectSearch"> Past Project Search </a><br>
-
  <a href="#url">Team Search</a>  
+
<a href="https://2012.igem.org/Team:UT-Tokyo-Software/Project/BioBrickSearch"> BioBrick Search </a><br>
-
              <a href="#url">Download</a>
+
<a href="https://2012.igem.org/Team:UT-Tokyo-Software/Project/Download"> Download </a><br>
-
            </dd>
+
<a href="https://2012.igem.org/Team:UT-Tokyo-Software/Update"> Update </a><br>
-
          </dl>
+
</span>
-
          <dl class="menu"
+
 
-
            <dt><a href="https://2012.igem.org/Team:UT-Tokyo-Software/Notebook">Notebook</a> </dt>  
+
<div class="akoL"><a href="https://2012.igem.org/Team:UT-Tokyo-Software/Notebook">Notebook</a></div>
-
          </dl> 
+
<div class="akoL"><a href="https://2012.igem.org/Team:UT-Tokyo-Software/Safety">Safety</a></div>
-
          <dl class="menu"
+
<div class="akoL"><a href="https://2012.igem.org/Team:UT-Tokyo-Software/Medal">Medal Fulfillment</a></div>
-
            <dt><a href="https://2012.igem.org/Team:UT-Tokyo-Software/Safety">Safety</a> </dt>
+
-
          </dl> 
+
-
  <dl class="menu"
+
-
            <dt><a href="#url">Medal Fulfillment</a> </dt>
+
-
          </dl> 
+
-
        </div> 
+
-
      </div> 
+
-
    </div> 
+
-
  </div>
+
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
</menuu>
</menuu>
</body>
</body>
</html>
</html>

Latest revision as of 23:05, 26 October 2012