Team:UNAM-Genomics Mexico/Templates/Notebook

From 2011.igem.org

(Difference between revisions)
m (v1.0.3 corrected text side padding)
(Replaced all the page with the wiki markup template July 10)
Line 1: Line 1:
-
<html>
+
<html xmlns="http://www.w3.org/1999/xhtml">
 +
 
 +
<!--
 +
@VERSION 1.0.0
 +
@NAME    /Templates/Notebook
 +
@DESC    This is a wiki template designed to contain the background layout and menu of all our page.
 +
-->
<head>
<head>
-
<style type="text/css">
+
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
-
/*
+
<link href="basic_layout.css" rel="stylesheet" type="text/css"></link>
-
NAME    notebook_template.css
+
<link href="basic_layout.js" rel="" type=""></link>
-
VERSION  1.0.3
+
<title>UNAM-Genomics_Mexico</title>
-
AUTHOR  Eduardo Vladimir Muñoz Hernández
+
<script type="text/javascript">
-
DESC    The file contains the css data for the UNAM-Genomics_Mexico Team wiki Notebook pages
+
-
SEE      menu_template.css which contains the layout instructions for the menu.
+
-
*/
+
-
body {
+
  var _gaq = _gaq || [];
-
font-family:"Segoe Print",Papyrus,"Viner Hand ITC","Bradley Hand ITC","Lucida Handwriting",
+
  _gaq.push(['_setAccount', 'UA-19624614-2']);
-
"Kristen ITC","Maiandra GD","Tempus Sans ITC","Comic Sans MS", Gabriola, "Juice ITC",
+
  _gaq.push(['_trackPageview']);
-
Verdana, sans-serif;
+
 
-
margin: 0px;
+
  (function() {
-
padding: 0px;
+
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
-
background-color:#EEEEEE;
+
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
 +
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
 +
  })();
 +
 
 +
</script>
 +
<script type="text/javascript">
 +
//Constants containing the menu cell positions (yeah, they're deffined as variables thx to IE)
 +
var RowPositions = new Array( "cat", "link", "mar");
 +
var ColPositions = new Array( "alpha", "beta", "gamma", "delta", "epsilon", "zeta");
 +
var OddPositions = new Array( "alpha", "gamma", "epsilon");
 +
 
 +
var currColEvenness = "";
 +
 
 +
//Constants containing the images for the table cells (odd/even/active Category/Link/Margin)
 +
// odd Cells
 +
var oCCellBg = "url(darkgrey_cardboard_332x196.png)";
 +
var oLCellBg = "url(stained_grey_cardboard_332x196.png)";
 +
var oMCellBg = "url(darkgrey_cardboard_332x196.png)";
 +
// even Cells
 +
var eCCellBg = "url(burnt_cardboard_332x196.png)";
 +
var eLCellBg = "url(cardboard_332x196.png)";
 +
var eMCellBg = "url(burnt_cardboard_332x196.png)";
 +
// active Cells
 +
var aCCellBg = "url(green_paper.png)";
 +
var aLCellBg = "url(light_green_paper.png)";
 +
var aMCellBg = "url(green_paper.png)";
 +
 
 +
//Receive a cell id and return it's prefix (which describes it's row) or it's suffix (it's col)
 +
function GetCellRow(currentId){
 +
var pattern, i;
 +
for( i=0; i < RowPositions.length; i++){
 +
pattern = new RegExp("^" + RowPositions[i]);
 +
if( pattern.test(currentId)){
 +
return( RowPositions[i]);
 +
}
 +
}
 +
return( false);
 +
}
 +
function GetCellCol(currentId){
 +
var pattern, i;
 +
for( i=0; i < ColPositions.length; i++){
 +
pattern = new RegExp(ColPositions[i] + "$");
 +
if( pattern.test(currentId)){
 +
return( ColPositions[i]);
 +
}
 +
}
 +
return( false);
}
}
-
#header{
+
//Classiffy column suffixes in odd or even suffixes
-
height:220px;
+
function ColEvenness(column){
-
width:100%;
+
var i;
-
font-family:"Arial Black", Gadget, sans-serif;
+
for( i=0; i < OddPositions.length; i++){
 +
if( column == OddPositions[i]){
 +
return( "odd");
 +
}
 +
}
 +
return( "even");
}
}
-
#header1{
+
 
-
height:220px;
+
//Function for lightening cells according to their position
-
width:100%;
+
function LightenCell(row, column){
-
bottom: auto;
+
var cell = document.getElementById( row + column);
-
font-family:"Arial Black", Gadget, sans-serif;
+
switch (row){
 +
case "cat":
 +
cell.style.backgroundImage = aCCellBg;
 +
break;
 +
case "link":
 +
cell.style.backgroundImage = aLCellBg;
 +
break;
 +
case "mar":
 +
cell.style.backgroundImage = aMCellBg;
 +
break;
 +
}
}
}
-
p.title{
+
//Function to Lighten the current menu table column
-
color:#CC4455;
+
function LightenMenu(currentCell){
-
font-size:150%;
+
var column = GetCellCol( currentCell.id );
 +
LightenCell( "cat", column);
 +
LightenCell("link", column);
 +
LightenCell( "mar", column);
 +
currColEvenness = ColEvenness(column);
}
}
-
#container {
+
//Function for darkening cells according to their position and evenness
-
margin: 0px auto;
+
function DarkenCell(row, column){
-
text-align:justify;
+
var cell = document.getElementById( row + column);
-
width: 100%;
+
if( currColEvenness == "odd"){
-
background-image:url(https://static.igem.org/mediawiki/2011/7/7e/Paper_100_up.jpg);
+
switch (row){
-
color:#404040;
+
case "cat":
-
font-size: 110%;
+
cell.style.backgroundImage = oCCellBg;
 +
break;
 +
case "link":
 +
cell.style.backgroundImage = oLCellBg;
 +
break;
 +
case "mar":
 +
cell.style.backgroundImage = oMCellBg;
 +
break;
 +
}
 +
} else if( currColEvenness == "even"){
 +
switch (row){
 +
case "cat":
 +
cell.style.backgroundImage = eCCellBg;
 +
break;
 +
case "link":
 +
cell.style.backgroundImage = eLCellBg;
 +
break;
 +
case "mar":
 +
cell.style.backgroundImage = eMCellBg;
 +
break;
 +
}
 +
}
}
}
-
div.summary_text{
+
//Function to Darken the current menu table column
-
padding: 30px 30px 30px 30px;
+
function DarkenMenu(currentCell){
-
border:none;
+
var column = GetCellCol( currentCell.id );
-
font-size:115%;
+
DarkenCell( "cat", column);
 +
DarkenCell("link", column);
 +
DarkenCell( "mar", column);
 +
currColEvenness = "";
}
}
-
div.more_text{
+
</script>
-
vertical-align:top;
+
<style>
-
padding: 0px 30px 0px 30px;
+
/*
 +
NAME basic_layout.css
 +
AUTHOR Eduardo Vladimir Muñoz Hernández
 +
VERSION 1.0.0
 +
DESC CSS for basic_layout.css
 +
*/
 +
 
 +
dummy.rule {
 +
/*Nothing here*/
}
}
-
div.left_garabato{
+
body{
-
float:left;
+
background-color:#AAAAAA;
-
border:none;
+
background-image: url("black_cardboard_tiled.png");
-
padding: 0px 0px 0px 0px;
+
margin: 0;
 +
padding: 0;
 +
text-align: center;
}
}
-
div.right_garabato{
+
 
-
float:right;
+
div#bodyContent{
-
border:none;
+
position: relative;
 +
width: 1000px;
 +
margin: 0 auto;
padding: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
 +
border: none;
 +
z-index: 0;
 +
background-color: transparent;
 +
color: #000000;
 +
text-align:justify;
 +
line-height: 1.2em;
 +
font-size:100%;
 +
font-family: "Maiandra GD", Garamond, "Tempus Sans ITC", Papyrus, "Kristen ITC",
 +
"Segoe Print", "Comic Sans MS", Verdana, sans-serif;
 +
/*
 +
Fonts I recomend the most:
 +
"Maiandra GD", Garamond,
 +
Fonts that resemble handwriting but are uncomfortable to read.
 +
These letters are too decorated:
 +
"Viner Hand ITC","Bradley Hand ITC","Lucida Handwriting","Tempus Sans ITC",
 +
These letter is too small:
 +
Gabriola,
 +
These letter is too narrow:
 +
"Juice ITC",
 +
*/
}
}
-
div.bottomr_garabato{
+
 
-
float:right;
+
 
-
vertical-align: bottom;
+
/***********************************
-
border:none;
+
    iGEM header instructions
 +
***********************************/
 +
 
 +
div#top-section{
 +
position: relative;
 +
width: 1000px;
 +
height: 25px;
 +
margin: 0 auto;
 +
border: none;
 +
z-index: 0;
 +
background-color: transparent;
 +
color: #FF0000;
 +
font-size:85%;
 +
font-family: "Maiandra GD", Garamond, "Tempus Sans ITC", Papyrus, "Kristen ITC",
 +
"Segoe Print", "Comic Sans MS", Verdana, sans-serif;
 +
}
 +
div#p-logo{
 +
display: none;
 +
width: 1000px;
 +
z-index: 1;
 +
}
 +
div#menubar{
 +
position: absolute;
 +
width: 400px;
 +
height: 21px;
 +
z-index: 5;
 +
top:22px;
 +
margin-top: -20px;
 +
}
 +
#menubar ul{
 +
margin: 0px 10px 0px 10px;
padding: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
}
-
 
+
#menubar li{
-
h1.wrote_header{
+
display: inline;
-
margin: 1px 1px 1px 1px;
+
}
-
border:none;
+
div.left-menu{
 +
text-align: left;
 +
}
 +
div.right-menu{
 +
text-align: right;
 +
right: 0px;
 +
}
 +
div#search-controls{
 +
display: none;
 +
}
 +
#menubar a{
text-decoration:none;
text-decoration:none;
-
color:#93F;
+
color:#C0C0C0;
-
font-size:110%;
+
}
 +
#menubar a:visited {
 +
color:#9A8A5E;
}
}
-
a.HP{
+
/************************************
-
color:#B0E;
+
  Our header instructions
-
text-decoration:none;
+
************************************/
 +
div#hydrobiumHeader{
 +
margin: 0 auto;
 +
background-color: transparent;
}
}
-
a.project{
+
 
-
color:#06C;
+
/************************************
-
text-decoration:none;
+
      Menu layout instructions
 +
************************************/
 +
 
 +
table#menuTable {
 +
width:1000px;
 +
margin: 0px 0px 0px 0px;
 +
border: none;
 +
border-collapse: collapse;
 +
color: black;
}
}
-
a.parts{
+
tr#menuCategories {
-
color:#00A449;
+
height:30px;
-
text-decoration:none;
+
text-align: center;
}
}
-
a.model{
+
tr#menuLinks {
-
color:#C00505;
+
height:98px;
-
text-decoration:none;
+
text-align: left;
}
}
-
a.safety{
+
tr#menuMargin {
-
color:#FC0;
+
heigth:3px;
-
text-decoration:none;
+
}
}
-
a.team{
+
td.alpha_cell, td.zeta_cell{
-
color:#00C;
+
width:16.66%; /* 1000px * 0.1666 = 166px */
-
text-decoration:none;
+
}
}
-
a.notebook{
+
td.beta_cell, td.gamma_cell, td.delta_cell, td.epsilon_cell{
-
color:#93F;
+
width:16.67%;
-
text-decoration:none;
+
}
}
-
a.attributions{
+
tr#menuCategories td.odd_cell{
-
color:#F90;
+
background-color:#495398;
-
text-decoration:none;
+
background-image: url("darkgrey_cardboard_332x196.png");
 +
background-position:center;
}
}
-
a.garden{
+
tr#menuCategories td.even_cell{
-
color:#40D840;
+
background-color:#7B6F48;
-
text-decoration:none;
+
background-image: url("burnt_cardboard_332x196.png");
}
}
-
a.project:hover, a.model:hover, a.garden:hover, a.team:hover, a.HP:hover,
+
tr#menuLinks td.odd_cell{
-
a.safety:hover, a.parts:hover, a.attributions:hover, a.notebook:hover{
+
background-color:#6973B6;
-
text-decoration:underline;
+
background-image: url("stained_grey_cardboard_332x196.png");
}
}
-
 
+
tr#menuLinks td.even_cell{
-
/*The following classes require images with the speciffied proportions.
+
background-color:#AD9E72;
-
An image with width=200px and length=300px won't fit the 1x1 class, but the 2x3 class.*/
+
background-image: url("cardboard_332x196.png");
-
img.prop_1x1{
+
-
width:150px;
+
-
height:150px;
+
-
border:none;
+
}
}
-
img.prop_3x4{
+
tr#menuMargin td.odd_cell{
-
width:120px;
+
background-color:#495398;
-
height:160px;
+
background-image: url("darkgrey_cardboard_332x196.png");
-
border:none;
+
background-position: center;
 +
}
 +
tr#menuMargin td.even_cell{
 +
background-color:#7B6F48;
 +
background-image: url("burnt_cardboard_332x196.png");
 +
}
 +
table#menuTable tr#menuLinks td ul{
 +
line-height: 1.2em;
 +
list-style-position: outside;
 +
list-style-type:none;
 +
margin: 10px 0px 10px 0px;
 +
padding: 0px 0px 0px 20px;
 +
}
 +
table#menuTable td.odd_cell a{
 +
text-decoration: none;
 +
color: #343434; /*Dark grey*/
 +
}
 +
table#menuTable td.even_cell a{
 +
text-decoration: none;
 +
color: #322914; /*Dark brown*/
}
}
-
</style>
+
/*******************************
 +
        Body Text code
 +
*******************************/
 +
div#text_content{
 +
background-color: #FFFFFF;
 +
background-image: url("white_paper_tiled.png");
 +
margin: 0px 0px 25px 0px;
 +
padding: 15px 45px 15px 45px;
 +
}
 +
h1{
 +
text-align:center;
 +
}
 +
h2{}
 +
h3{}
 +
h4{}
 +
#text_content a{
 +
text-decoration: none;
 +
color: #18824B; /*Dark green from our logo*/
 +
}
 +
#text_content a:visited{
 +
color: #5e5231; /*Medium brown from table background*/
 +
}
 +
img.hydrobium_logo{
 +
float: left;
 +
height: 120px;
 +
width: 160px;
 +
}
 +
#text_content a.anchor{
 +
color: #000000;
 +
}
 +
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>
</head>
</head>
 +
 +
<body>
 +
<div id="bodyContent">
 +
<div id="top-section">
 +
<!-- BEG top-section. This is the iGEM page generic header. We must retain both menubars. -->
 +
<div id="p-logo">
 +
<a href="/Main_Page" title="Main Page"><img src='https://2011.igem.org/wiki/skins/common/images/wiki.png' width=1000px></a>
 +
</div>  <!-- end p-logo -->
 +
<script type="text/javascript"> if (window.isMSIE55) fixalpha(); </script>
 +
<div id="menubar" class='left-menu noprint'>
 +
<ul>
 +
<li class='selected'><a href="/Team:UNAM-Genomics_Mexico">Page</a></li>
 +
<li class='new'>
 +
<a href="/wiki/index.php?title=Talk:Team:UNAM-Genomics_Mexico&amp;action=edit&amp;redlink=1">Discussion</a></li>
 +
<li><a href="/wiki/index.php?title=Team:UNAM-Genomics_Mexico&amp;action=edit">Edit</a></li>
 +
<li><a href="/wiki/index.php?title=Team:UNAM-Genomics_Mexico&amp;action=history">History</a></li>
 +
<li><a href="/Special:MovePage/Team:UNAM-Genomics_Mexico">Move</a></li>
 +
<li><a href="/wiki/index.php?title=Team:UNAM-Genomics_Mexico&amp;action=unwatch">Unwatch</a></li>
 +
<li style='color:#808080;cursor:default'>teams</li>
 +
</ul>
 +
</div> <!-- end menubar (left) -->
 +
<div class="right-menu noprint" id="menubar">
 +
<ul>
 +
<li id="pt-userpage"><a href="/User:Vladimir" title="Your user page [.]" accesskey=".">Vladimir</a></li>
 +
<li id='pt-preferences'><a href='https://igem.org/User_Information' title='My account'>My account</a></li>
 +
<li id="pt-logout">
 +
<a href="/wiki/index.php?title=Special:UserLogout&amp;returnto=Team:UNAM-Genomics_Mexico" title="Log out">Log out</a></li>
 +
</ul>
 +
</div><!-- end right menubar -->
 +
<div id="search-controls" class="noprint">
 +
<form action="/Special:Search" id="searchform">
 +
<input id="searchInput" name="search" type="text" title="Search 2011.igem.org [f]" accesskey="f" value="" />
 +
<input type='submit' name="go" class="searchButton" id="searchGoButton" value="Go" title="Go to a page with this exact name if exists" />&nbsp;
 +
<input type='submit' name="fulltext" class="searchButton" id="mw-searchButton" value="Search" title="Search the pages for this text" />
 +
</form>
 +
</div> <!-- close search controls -->
 +
</div>
 +
<!-- close top-section-->
 +
<!--BEG Menu Table code-->
 +
<table id="menuTable">
 +
<tr id="menuCategories">
 +
<td class="odd_cell alpha_cell" id="catalpha"
 +
onMouseOver="LightenMenu(this);return true" onMouseOut="DarkenMenu(this);return true;">
 +
Alfa
 +
</td>
 +
<td class="even_cell beta_cell" id="catbeta"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
Beta
 +
</td>
 +
<td class="odd_cell gamma_cell" id="catgamma"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
Gamma
 +
</td>
 +
<td class="even_cell delta_cell" id="catdelta"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
Delta
 +
</td>
 +
<td class="odd_cell espsilon_cell" id="catepsilon"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
Épsilon
 +
</td>
 +
<td class="even_cell zeta_cell" id="catzeta"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
Zeta
 +
</td>
 +
</tr>
 +
<tr id="menuLinks">
 +
<td class="odd_cell alpha_cell" id="linkalpha"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
<ul>
 +
<li><a class="menu_a" href="">Anélido</a></li>
 +
<li><a class="menu_a" href="">Acacia</a></li>
 +
<li><a class="menu_a" href="">Artrópodo</a></li>
 +
<li><a class="menu_a" href="">Astrocito</a></li>
 +
</ul>
 +
</td>
 +
<td class="even_cell beta_cell" id="linkbeta"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
<ul>
 +
<li><a class="menu_a" href="">Bugambilia</a></li>
 +
<li><a class="menu_a" href="">Buey</a></li>
 +
<li><a class="menu_a" href="">Branquia</a></li>
 +
<li><a class="menu_a" href="">Boro</a></li>
 +
</ul>
 +
</td>
 +
<td class="odd_cell gamma_cell" id="linkgamma"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
<ul>
 +
<li><a class="menu_a" href="">Ganso</a></li>
 +
<li><a class="menu_a" href="">Gato</a></li>
 +
<li><a class="menu_a" href="">Gusano</a></li>
 +
<li><a class="menu_a" href="">Grillo</a></li>
 +
</ul>
 +
</td>
 +
<td class="even_cell delta_cell" id="linkdelta"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
<ul>
 +
<li><a class="menu_a" href="">Dinosaurio</a></li>
 +
<li><a class="menu_a" href="">Dendrita</a></li>
 +
<li><a class="menu_a" href="">Destino</a></li>
 +
<li><a class="menu_a" href="">Diurno</a></li>
 +
</ul>
 +
</td>
 +
<td class="odd_cell epsilon_cell" id="linkepsilon"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
<ul>
 +
<li><a class="menu_a" href="">Esperanto</a></li>
 +
<li><a class="menu_a" href="">Español</a></li>
 +
<li><a class="menu_a" href="">Ermita</a></li>
 +
<li><a class="menu_a" href="">Einstein</a></li>
 +
</ul>
 +
</td>
 +
<td class="even_cell zeta_cell" id="linkzeta"
 +
onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;">
 +
<ul>
 +
<li><a class="menu_a" href="">Zafiro</a></li>
 +
<li><a class="menu_a" href="">Zootecnista</a></li>
 +
<li><a class="menu_a" href="">Zinc</a></li>
 +
<li><a class="menu_a" href="">Z-score</a></li>
 +
</ul>
 +
</td>
 +
</tr>
 +
<tr id="menuMargin">
 +
<td class="odd_cell alpha_cell" id="maralpha" onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;"></td>
 +
<td class="even_cell beta_cell" id="marbeta" onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;"></td>
 +
<td class="odd_cell gamma_cell" id="margamma" onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;"></td>
 +
<td class="even_cell delta_cell" id="mardelta" onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;"></td>
 +
<td class="odd_cell espsilon_cell" id="marepsilon" onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;"></td>
 +
<td class="even_cell zeta_cell" id="marzeta" onMouseOver="LightenMenu(this);return true;" onMouseOut="DarkenMenu(this);return true;"></td>
 +
</tr>
 +
</table>
 +
</div>
 +
<div id="UNAM-Genomics_Content">
 +
{{{content}}}
 +
</div>
 +
</body>
</html>
</html>

Revision as of 01:58, 11 July 2011

UNAM-Genomics_Mexico

{{{content}}}

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