Team:UNAM-Genomics Mexico/Templates/Home
From 2011.igem.org
(Difference between revisions)
m (v3.0.4 more row margin) |
(version 1.0.0 for the wiki markup template) |
||
Line 1: | Line 1: | ||
- | <html> | + | <html xmlns="http://www.w3.org/1999/xhtml"> |
+ | |||
+ | <!-- | ||
+ | @VERSION 1.0.0 | ||
+ | @NAME /Templates/Home | ||
+ | @DESC This is a wiki template designed for the welcoming page. | ||
+ | --> | ||
<head> | <head> | ||
- | < | + | <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> |
- | + | <title>UNAM-Genomics_Mexico</title> | |
- | + | <script type="text/javascript"> | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | var _gaq = _gaq || []; | |
- | + | _gaq.push(['_setAccount', 'UA-19624614-2']); | |
- | + | _gaq.push(['_trackPageview']); | |
- | + | ||
- | + | (function() { | |
+ | var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; | ||
+ | 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(https://static.igem.org/mediawiki/2011/9/95/Darkgrey_cardboard_332x196_UGM.png)"; | ||
+ | var oLCellBg = "url(https://static.igem.org/mediawiki/2011/e/e6/Stained_grey_cardboard_332x196_UGM.png)"; | ||
+ | var oMCellBg = "url(https://static.igem.org/mediawiki/2011/9/95/Darkgrey_cardboard_332x196_UGM.png)"; | ||
+ | // even Cells | ||
+ | var eCCellBg = "url(https://static.igem.org/mediawiki/2011/a/ae/Burnt_cardboard_332x196_UGM.png)"; | ||
+ | var eLCellBg = "url(https://static.igem.org/mediawiki/2011/6/66/Cardboard_332x196_UGM.png)"; | ||
+ | var eMCellBg = "url(https://static.igem.org/mediawiki/2011/a/ae/Burnt_cardboard_332x196_UGM.png)"; | ||
+ | // active Cells | ||
+ | var aCCellBg = "url(https://static.igem.org/mediawiki/2011/e/e8/Green_paper_UGM.png)"; | ||
+ | var aLCellBg = "url(https://static.igem.org/mediawiki/2011/0/03/Light_green_paper_UGM.png)"; | ||
+ | var aMCellBg = "url(https://static.igem.org/mediawiki/2011/e/e8/Green_paper_UGM.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); | ||
} | } | ||
- | + | ||
- | + | //Classiffy column suffixes in odd or even suffixes | |
- | + | function ColEvenness(column){ | |
- | + | var i; | |
- | + | for( i=0; i < OddPositions.length; i++){ | |
+ | if( column == OddPositions[i]){ | ||
+ | return( "odd"); | ||
+ | } | ||
+ | } | ||
+ | return( "even"); | ||
} | } | ||
- | + | //Function for lightening cells according to their position | |
- | + | function LightenCell(row, column){ | |
- | + | var cell = document.getElementById( row + column); | |
+ | switch (row){ | ||
+ | case "cat": | ||
+ | cell.style.backgroundImage = aCCellBg; | ||
+ | break; | ||
+ | case "link": | ||
+ | cell.style.backgroundImage = aLCellBg; | ||
+ | break; | ||
+ | case "mar": | ||
+ | cell.style.backgroundImage = aMCellBg; | ||
+ | break; | ||
+ | } | ||
} | } | ||
- | # | + | |
- | margin: | + | //Function to Lighten the current menu table column |
+ | function LightenMenu(currentCell){ | ||
+ | var column = GetCellCol( currentCell.id ); | ||
+ | LightenCell( "cat", column); | ||
+ | LightenCell("link", column); | ||
+ | LightenCell( "mar", column); | ||
+ | currColEvenness = ColEvenness(column); | ||
+ | } | ||
+ | |||
+ | //Function for darkening cells according to their position and evenness | ||
+ | function DarkenCell(row, column){ | ||
+ | var cell = document.getElementById( row + column); | ||
+ | if( currColEvenness == "odd"){ | ||
+ | switch (row){ | ||
+ | case "cat": | ||
+ | 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; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | |||
+ | //Function to Darken the current menu table column | ||
+ | function DarkenMenu(currentCell){ | ||
+ | var column = GetCellCol( currentCell.id ); | ||
+ | DarkenCell( "cat", column); | ||
+ | DarkenCell("link", column); | ||
+ | DarkenCell( "mar", column); | ||
+ | currColEvenness = ""; | ||
+ | } | ||
+ | </script> | ||
+ | <style> | ||
+ | |||
+ | dummy.rule { | ||
+ | /*Nothing here*/ | ||
+ | } | ||
+ | |||
+ | body{ | ||
+ | background-color: black; | ||
+ | background-image: url("https://static.igem.org/mediawiki/2011/9/98/Black_cardboard_tiled_UGM.png"); | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | text-align: center; | ||
+ | font-size:medium; | ||
+ | font-family: "Maiandra GD", Garamond, "Tempus Sans ITC", Papyrus, "Kristen ITC", | ||
+ | "Segoe Print", "Comic Sans MS", Verdana, sans-serif; | ||
+ | } | ||
+ | div#globalWrapper{ | ||
+ | background-color: transparent; | ||
+ | font-size: 100%; | ||
+ | } | ||
+ | |||
+ | /*content and bodyContent are given the same properties to avoid problems*/ | ||
+ | div#content{ | ||
+ | position: relative; | ||
+ | width: 1000px; | ||
+ | margin: 0 auto; | ||
+ | padding: 0px 0px 0px 0px; | ||
+ | border: none; | ||
+ | z-index: 0; | ||
+ | background-color: transparent; | ||
+ | color: #000000; | ||
text-align:justify; | text-align:justify; | ||
- | + | line-height: 1em; | |
- | + | font-size:100%; | |
- | + | font-family: "Maiandra GD", Garamond, "Tempus Sans ITC", Papyrus, "Kristen ITC", | |
- | + | "Segoe Print", "Comic Sans MS", Verdana, sans-serif; | |
} | } | ||
- | div | + | div#bodyContent{ |
- | + | position: relative; | |
- | + | width: 1000px; | |
+ | margin: 0 auto; | ||
+ | padding: 0px 0px 0px 0px; | ||
+ | border: none; | ||
+ | z-index: 0; | ||
+ | background-color: transparent; | ||
+ | color: #000000; | ||
+ | text-align:justify; | ||
+ | line-height: 1em; | ||
+ | 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. | + | div#content h1.firstHeading{ |
- | + | display: none; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | div | + | div#bodyContent p{ |
- | + | margin: 0em 0em 0em 0em; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | div | + | div#contentSub{ |
- | + | margin: 0 0 0.7em 0; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
- | + | div#catlinks{ | |
- | + | display: none; | |
- | + | ||
} | } | ||
- | + | ||
- | color:# | + | |
- | + | /*********************************** | |
+ | iGEM header instructions | ||
+ | ***********************************/ | ||
+ | |||
+ | div#top-section{ | ||
+ | position: relative; | ||
+ | width: 1000px; | ||
+ | height: 21px; | ||
+ | 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; | |
} | } | ||
- | + | #menubar li{ | |
- | + | display: inline; | |
- | + | ||
} | } | ||
- | + | div.left-menu{ | |
- | + | text-align: left; | |
- | text- | + | |
} | } | ||
- | + | div.right-menu{ | |
- | + | text-align: right; | |
- | + | right: 0px; | |
} | } | ||
- | + | div#search-controls{ | |
- | + | display: none; | |
+ | } | ||
+ | #menubar a{ | ||
text-decoration:none; | text-decoration:none; | ||
+ | color:#C0C0C0; | ||
} | } | ||
- | a | + | #menubar a:visited { |
- | + | color:#9A8A5E; | |
- | + | ||
} | } | ||
- | /* | + | /******************************* |
- | + | iGEM Footer Instructions | |
- | + | *******************************/ | |
- | width: | + | div#footer-box { |
- | border:none; | + | margin: 0 auto; |
+ | width: 990px; | ||
+ | padding: 5px; | ||
+ | background-color: #6b6b6b; | ||
+ | background-image: url("https://static.igem.org/mediawiki/2011/5/5b/Darkgrey_noise_UGM.png"); | ||
+ | border: none; | ||
} | } | ||
- | + | div#footer-box div#footer ul#f-list li a { | |
- | + | color: silver; | |
- | + | } | |
- | + | div#footer-box div#footer ul#f-list li a:hover { | |
+ | color: white; | ||
} | } | ||
- | </style> | + | /******************************* |
+ | Cell Properties | ||
+ | *******************************/ | ||
+ | div.sixpack{ | ||
+ | margin: 0px; | ||
+ | padding: 5px; | ||
+ | border: none; | ||
+ | background-color: #770022; | ||
+ | } | ||
+ | div#ULC{ | ||
+ | position:absolute; | ||
+ | top: 0px; | ||
+ | left: 0px; | ||
+ | } | ||
+ | div#UMC{ | ||
+ | position:absolute; | ||
+ | top: 0px; | ||
+ | left: 350px; | ||
+ | } | ||
+ | div#URC{ | ||
+ | position:absolute; | ||
+ | top: 0px; | ||
+ | left: 700px; | ||
+ | } | ||
+ | div#BLC{ | ||
+ | position:absolute; | ||
+ | top: 350px; | ||
+ | right: 700px; | ||
+ | } | ||
+ | div#ULC{ | ||
+ | position:absolute; | ||
+ | top: 350px; | ||
+ | right: 350px; | ||
+ | } | ||
+ | div#ULC{ | ||
+ | position:absolute; | ||
+ | top: 350px; | ||
+ | right: 0px; | ||
+ | } | ||
+ | |||
+ | </style> | ||
</head> | </head> | ||
</html> | </html> | ||
+ | |||
+ | <div id="ULC" class="sixpack"> | ||
+ | {{{ULC}}} | ||
+ | </div> | ||
+ | <div id="UMC" class="sixpack"> | ||
+ | {{{UMC}}} | ||
+ | </div> | ||
+ | <div id="URC" class="sixpack"> | ||
+ | {{{URC}}} | ||
+ | </div> | ||
+ | <div id="BLC" class="sixpack"> | ||
+ | {{{BLC}}} | ||
+ | </div> | ||
+ | <div id="BMC" class="sixpack"> | ||
+ | {{{BMC}}} | ||
+ | </div> | ||
+ | <div id="BRC" class="sixpack"> | ||
+ | {{{BRC}}} | ||
+ | </div> |
Revision as of 19:19, 19 July 2011
{{{ULC}}}
{{{UMC}}}
{{{URC}}}
{{{BLC}}}
{{{BMC}}}
{{{BRC}}}