Team:UNAM-Genomics Mexico/Templates/Team

From 2011.igem.org

(Difference between revisions)
(Created one screen per option and the javascript code to stack them properly)
(Wrote fake content. Changed footer and header font-size. Used blue colors)
 
(4 intermediate revisions not shown)
Line 2: Line 2:
<!--
<!--
-
@VERSION 1.1.0
+
@VERSION 1.2.0
@NAME    /Templates/Team
@NAME    /Templates/Team
@DESC    This is a wiki template designed for the welcoming page.
@DESC    This is a wiki template designed for the welcoming page.
Line 22: Line 22:
</script>
</script>
-
<script language="JavaScript"  type="text/javascript">
+
<script type="text/javascript">
-
var currOnTop = getElementById("psiScreen");
+
var onTopId = "psi";
function HeapScreen(currId){
function HeapScreen(currId){
-
currOnTop.style.zIndex = "1";
+
var screenOnTop = document.getElementById( onTopId + "Screen" );
-
currOnTop = getElementById( currId + "Screen" );
+
screenOnTop.style.zIndex = "1";
-
currOntTop.style.zIndex = "2";
+
screenOnTop = document.getElementById( currId + "Screen" );
 +
screenOnTop.style.zIndex = "2";
 +
onTopId = currId;
}
}
Line 40: Line 42:
body{
body{
background-color: black;
background-color: black;
-
background-image: url("https://static.igem.org/mediawiki/2011/9/98/Black_cardboard_tiled_UGM.png");
+
/*background-image: url("https://static.igem.org/mediawiki/2011/9/98/Black_cardboard_tiled_UGM.png");*/
margin: 0;
margin: 0;
padding: 0;
padding: 0;
Line 132: Line 134:
top: 0px;
top: 0px;
margin-top: 0px;
margin-top: 0px;
-
font-size: 95%;
+
font-size: 85%;
font-family: sans-serif;
font-family: sans-serif;
}
}
Line 176: Line 178:
background-image: none;
background-image: none;
border: none;
border: none;
-
font-size: 95%;
+
font-size: 85%;
font-family: sans-serif;
font-family: sans-serif;
}
}
Line 234: Line 236:
top: 0px;
top: 0px;
left: 0px;
left: 0px;
-
backgound-color: #44CC44;
+
background-color: #1d7cbc;
}
}
div#omega {
div#omega {
Line 240: Line 242:
bottom: 0px;  
bottom: 0px;  
left: 0px;
left: 0px;
-
backgound-color: #444444;
+
background-color: #1e4878;
}
}
div#alpha{
div#alpha{
Line 246: Line 248:
top: 80px;
top: 80px;
left: 0px;
left: 0px;
-
backgound-color: #CC4444;
+
background-color: #94dafb;
}
}
div#beta{
div#beta{
Line 252: Line 254:
top: 250px;
top: 250px;
left: 0px;
left: 0px;
-
backgound-color: #4444CC;
+
background-color: #389ad9;
}
}
div#gamma{
div#gamma{
Line 258: Line 260:
top: 420px;
top: 420px;
left: 0px;
left: 0px;
-
backgound-color: #44CCCC;
+
background-color: #0172c0;
}
}
div#delta{
div#delta{
Line 264: Line 266:
top: 80px;
top: 80px;
right: 0px;
right: 0px;
-
backgound-color: #CC44CC;
+
background-color: #003c77;
}
}
div#epsilon{
div#epsilon{
Line 270: Line 272:
top: 250px;
top: 250px;
right: 0px;
right: 0px;
-
backgound-color: #CCCC44;
+
background-color: #0c2857;
}
}
div#zeta{
div#zeta{
Line 276: Line 278:
top: 420px;
top: 420px;
right: 0px;
right: 0px;
-
backgound-color: #CCCCCC;
+
background-color: #2e5894;
}
}
div#psiScreen {
div#psiScreen {
-
backgound-color: #44CC44;
+
background-color: #1d7cbc;
z-index: 2;
z-index: 2;
}
}
div#alphaScreen {
div#alphaScreen {
-
backgound-color: #CC4444;
+
background-color: #94dafb;
}
}
div#betaScreen {
div#betaScreen {
-
backgound-color: #4444CC;
+
background-color: #389ad9;
}
}
div#gammaScreen {
div#gammaScreen {
-
backgound-color: #44CCCC;
+
background-color: #0172c0;
}
}
div#deltaScreen {
div#deltaScreen {
-
backgound-color: #CC44CC;
+
background-color: #003c77;
}
}
div#epsilonScreen {
div#epsilonScreen {
-
backgound-color: #CCCC44;
+
background-color: #0c2857;
}
}
div#zetaScreen {
div#zetaScreen {
-
backgound-color: #CCCCCC;
+
background-color: #2e5894;
}
}
div#omegaScreen {
div#omegaScreen {
-
backgound-color: #444444;
+
background-color: #1e4878;
 +
}
 +
 
 +
/****************************
 +
  Text markup instructions
 +
****************************/
 +
span.sp_name{
 +
/*use this span class to format species names*/
 +
text-decoration: none;
 +
font-style: italic;
 +
}
 +
span.gene_name{
 +
/*use this span class to format gene names*/
 +
text-decoration: none;
 +
font-style: italic;
 +
}
 +
span.lat_phrase{
 +
/*use this span class to format latin phrases*/
 +
text-decoration: none;
 +
font-style: italic;
}
}
</style>
</style>
</head>
</head>
-
</html>
+
<body>
-
<div id="psi" class="bar" onMouseOver="HeapScreen(this.id); return(true);">Psi</div>
+
<div id="psi" class="bar" onMouseOver="HeapScreen(this.id); return(true);">
-
<div id="psiScreen" class="screen">==psiPSIpsiPSIpsi==</div>
+
iGEM links and other stuff
 +
</div>
 +
<div id="psiScreen" class="screen">
 +
<h2>UNAM-Genomics_Mexico presents:</h2>
 +
<h1>Hydrobium etli<h1>
 +
<h4>for iGEM competition 2011</h4>
 +
</div>
-
<div id="alpha" class="box" onMouseOver="HeapScreen(this.id); return(true);">Alpha</div>
+
<div id="alpha" class="box" onMouseOver="HeapScreen(this.id); return(true);">
-
<div id="alphaScreen" class="screen">==alphaALPHAalpha==</div>
+
Project
 +
</div>
 +
<div id="alphaScreen" class="screen">
 +
<p>Hydrogen. The doubtful begining, the unreachable end. Our paths, both the one drawn in the
 +
maps of our heads and the one awaiting our fall in reality, will be written here, with blood
 +
and sweat, for other adventurers wishing to reach the border of what our knowledge lights. </p>
 +
</div>
-
<div id="beta" class="box" onMouseOver="HeapScreen(this.id); return(true);">Beta</div>
+
<div id="beta" class="box" onMouseOver="HeapScreen(this.id); return(true);">
-
<div id="betaScreen" class="screen">==betaBETAbeta==</div>
+
The <span class="sp_name">Rhizobium etli</span> Work Kit
 +
</div>
 +
<div id="betaScreen" class="screen">
 +
<p>Arrows, bow, rope, shield, sword. The warrior relies heavily on his tools. This is why
 +
trustworthy tools are not necessary but vital along the travel. The blacksmith is a hero
 +
too. Here is his story.</p>
 +
</div>
-
<div id="gamma" class="box" onMouseOver="HeapScreen(this.id); return(true);">Gamma</div>
+
<div id="gamma" class="box" onMouseOver="HeapScreen(this.id); return(true);">Model</div>
-
<div id="gammaScreen" class="screen">==gammaGAMMAgamma==</div>
+
<div id="gammaScreen" class="screen">
 +
<p>Wizard wisdom lights all heroes paths. The seers ability to overcome trouble beffore it
 +
presents itself saves resources and lives. Being a step ahead can make the difference.</p>
 +
<p>There are many kinds of wizards. Most of them lack the beard, the hat and the magic wand.
 +
But you must not be deluded. They can be just as powerful. They are vital for any heroic
 +
campaign.</p>
 +
<p>Yes, wizards don't know it all. But who does?</p>
 +
</div>
-
<div id="delta" class="box" onMouseOver="HeapScreen(this.id); return(true);">Delta</div>
+
<div id="delta" class="box" onMouseOver="HeapScreen(this.id); return(true);">Safety and Ethics</div>
-
<div id="deltaScreen" class="screen">==deltaDELTAdelta==</div>
+
<div id="deltaScreen" class="screen">
 +
<p>If while saving the princess you destroy the kingdom, you're no hero.</p>
 +
</div>
-
<div id="epsilon" class="box" onMouseOver="HeapScreen(this.id); return(true);">Epsilon</div>
+
<div id="epsilon" class="box" onMouseOver="HeapScreen(this.id); return(true);">Human Practices</div>
-
<div id="epsilonScreen" class="screen">==epsilonEPSILONepsilon==</div>
+
<div id="epsilonScreen" class="screen">
 +
<p>Little heroes save their princess. Big heroes save towns, cities or nations. Great heroes
 +
save the people.</p>
 +
</div>
-
<div id="zeta" class="box" onMouseOver="HeapScreen(this.id); return(true);">Zeta</div>
+
<div id="zeta" class="box" onMouseOver="HeapScreen(this.id); return(true);">Our</div>
-
<div id="zetaScreen" class="screen">==zetaZETAzeta==</div>
+
<div id="zetaScreen" class="screen">
 +
<p>This is how we changed along the path:</p>
 +
<ul>
 +
<li>Our logbook (or the team's tale)</li>
 +
<li>Our tools, and how they grew old with us</li>
 +
<li>Our memories, imprinted in minds and bytes</li>
 +
<li>Ourselves (as childs, teens, men and women)</li>
 +
</ul>
 +
</div>
-
<div id="omega" class="bar" onMouseOver="HeapScreen(this.id); return(true);">Omega</div>
+
<div id="omega" class="bar" onMouseOver="HeapScreen(this.id); return(true);">Sponsors</div>
-
<div id="omegaScreen" class="screen">==omegaOMEGAomega==</div>
+
<div id="omegaScreen" class="screen">
 +
<p>Thank you Puss in Boots, thank you Tinker Bell, thank you Godmother</p>
 +
</div>
 +
 
 +
</body>
 +
</html>

Latest revision as of 05:30, 23 July 2011

UNAM-Genomics_Mexico

iGEM links and other stuff

UNAM-Genomics_Mexico presents:

Hydrobium etli

for iGEM competition 2011

Project

Hydrogen. The doubtful begining, the unreachable end. Our paths, both the one drawn in the maps of our heads and the one awaiting our fall in reality, will be written here, with blood and sweat, for other adventurers wishing to reach the border of what our knowledge lights.

The Rhizobium etli Work Kit

Arrows, bow, rope, shield, sword. The warrior relies heavily on his tools. This is why trustworthy tools are not necessary but vital along the travel. The blacksmith is a hero too. Here is his story.

Model

Wizard wisdom lights all heroes paths. The seers ability to overcome trouble beffore it presents itself saves resources and lives. Being a step ahead can make the difference.

There are many kinds of wizards. Most of them lack the beard, the hat and the magic wand. But you must not be deluded. They can be just as powerful. They are vital for any heroic campaign.

Yes, wizards don't know it all. But who does?

Safety and Ethics

If while saving the princess you destroy the kingdom, you're no hero.

Human Practices

Little heroes save their princess. Big heroes save towns, cities or nations. Great heroes save the people.

Our

This is how we changed along the path:

  • Our logbook (or the team's tale)
  • Our tools, and how they grew old with us
  • Our memories, imprinted in minds and bytes
  • Ourselves (as childs, teens, men and women)
Sponsors

Thank you Puss in Boots, thank you Tinker Bell, thank you Godmother

Retrieved from "http://2011.igem.org/Team:UNAM-Genomics_Mexico/Templates/Team"