Team:Grenoble/Templates/Team:Grenoble V02

From 2011.igem.org

(Difference between revisions)
 
(81 intermediate revisions not shown)
Line 1: Line 1:
-
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
+
<!--
-
  <head>
+
Maxime: J'ai remis à jour ce fichier (j'en ai une sauvegarde si qqun en a besoin, elle est à la même adresse mais avec V03 au lieu de V02) j'ai refait l'indentation plus proprement.
 +
 
 +
Pour éditer proprement et simplement le wiki, j'utilise Geany. Il suffit de copier tout ce qui est ici et de l'enregistrer avec une extension .html
 +
 
 +
Il faut décommenter les deux lignes:
 +
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 +
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 +
 
 +
Ensuite dans Geany on appuie sur "F5" pour voir la page dans un navigateur, tout apparaît sauf la bannière Team:Grenoble, c'est normal mais je ne sais pas pourquoi ^^
 +
 
 +
Les lignes qu'on décommente pour observer le résultat dans un navigateur doivent être remises en commentaire quand on copie dans le wiki !
 +
 
 +
Je m'occuperai de rendre un peu plus joli le code des autres pages bientôt (faut que je ferme les balises qui ne le sont pas, j'avais ouvert des <p> sans les fermer).
 +
-->
 +
 
 +
<!--
 +
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 +
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 +
-->
 +
 
 +
<!--
 +
Ce qui suit doit être mis dans le wiki:
 +
-->
 +
 +
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 +
 
 +
<head>
 +
        <title>Grenoble</title>
 +
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
 +
<meta name="generator" content="Geany 0.19.1" />
<style>
<style>
Line 25: Line 54:
-
blabla.img  {
+
img.blabla {
width:100%;
width:100%;
Line 67: Line 96:
-
.banner {
 
-
position:absolute;
 
-
top:192px;
+
h1 {
-
 
+
-
margin:0 auto;
+
-
 
+
-
padding:5px 0 0 0;
+
-
 
+
-
}
+
-
 
+
-
 
+
-
h1 {
+
margin:0;
margin:0;
-
padding:38px 0 36px 32px;
+
padding:30px 0 30px 32px;
color:#5c5c5c;
color:#5c5c5c;
Line 123: Line 141:
.menu {
.menu {
-
 
-
 
padding:4px 2px 2px 2px;
padding:4px 2px 2px 2px;
Line 170: Line 186:
padding:20px 0;
padding:20px 0;
-
color:#fff;
+
color:#5c5c5c;
font:bold 30px Arial, Helvetica, sans-serif;
font:bold 30px Arial, Helvetica, sans-serif;
Line 217: Line 233:
}
}
-
</style>
 
-
  </head>
 
-
<body>
 
-
<div class="header">
 
-
<h1><span>Team:</span>Grenoble v0.1</h1>
 
-
</div>
 
-
<div class="menu">
+
.body {
-
<ul>
+
-
<li><a href="myfirstwebpage.html">Home</a></li>
+
-
<li><a href="mysecondwebpage.html">The Team</a></li>
+
-
<li><a href="mythirdwebpage.html">Grenoble</a></li>
+
-
<li><a href="http://danstonchat.com/latest.html">Notebook</a></li>
+
-
<li><a href="http://www.urbandictionary.com/define.php?term=macfag">Safety</a></li>
+
-
<li><a href="http://www.urbandictionary.com/define.php?term=macfag">Links</a></li>
+
-
</ul>
+
-
</div>
+
-
<div class="banner">
+
-
<img src="greenzap/images/Grenoble_pan2.jpg"/>
+
-
</div>
+
-
<!-- Au-dessus : le code pour le header et la bannière + menu -->
+
margin:0;
-
<!-- En-dessous : Le sidebar menu, à droite -->
+
-
<div class="body" id="arf" >
+
-
<div class="right">
+
padding:0;
-
+
-
<h3><span class="vert">TEAM:</span>Grenoble</h3>
+
-
<ul>
+
-
<li><a href="myfirstwebpage.html">Home</a></li>
+
-
<li><a href="mysecondwebpage.html">The Team</a></li>
+
-
<li><a href="mythirdwebpage.html">Grenoble</a></li>
+
-
<li><a href="http://danstonchat.com/latest.html">Notebook</a></li>
+
-
<li><a href="http://www.urbandictionary.com/define.php?term=macfag">Safety</a></li>
+
-
<li><a href="http://www.urbandictionary.com/define.php?term=macfag">Links</a></li>
+
-
</ul>
+
-
+
}
-
<h3><span class="vert">The</span> Labs</h3>
+
-
<ul>
+
-
<li><a href="http://www.grenoble.cnrs.fr/">The CNRS</a></li>
+
-
<li><a href="http://www.cea.fr/">The CEA</a></li>
+
-
<li><a href="http://www.ibs.fr/">IBS</a></li>
+
-
<li><a href="http://www.inria.fr/centre-de-recherche-inria/grenoble-rhone-alpes">INRIA</a></li>
+
-
<li><a href="http://www.minatec.com/">Minatec</a></li>
+
-
<li><a href="http://www.ujf-grenoble.fr/36392593/0/fiche___pagelibre_accueil/">UJF</a></li>
+
-
<li><a href="http://www.grenoble-inp.fr/">Grenoble INP</a></li>
+
-
</ul>
+
-
<h3><span class="vert">Our</span> Sponsors</h3>
+
.body h2 {
-
<ul>
+
-
<li><a href="http://patterntap.com/404">Our numerous sponsors 1</a></li>
+
-
<li><a href="http://1.bp.blogspot.com/_m6hW5ezJHzE/TQub76oD26I/AAAAAAAACIU/cfAO853keuw/s1600/erreur-404.gif">Our numerous sponsors 2</a></li>
+
-
<li><a href="http://sgen-alsace.org/spip/images/nono_erreur404_412x274.png">Our numerous sponsors 3</a></li>
+
-
<li><a href="http://www.deuxmainsgauches.com/wp-content/uploads/2007/06/404.jpg">Our numerous sponsors 4</a></li>
+
-
</ul>
+
-
<h3><span class="vert">Event</span> Calendar</h3>
+
font:bold 24px Arial, Helvetica, sans-serif;
-
<img src="greenzap/images/calendrier-cote-forme.png"/>
+
-
<p>(Coming Soon ...)</p>
+
-
</div>
+
color:#323a3f;
-
<!-- Le corps du site, ce qui ne fera pas partie du template : -->
+
padding:10px 5px;
-
<div class="left">
+
margin:5px 2px 12px 0;
-
<img src="greenzap/photos_etudiants/robin.png" class="icon"/>
+
-
<a href="http://fr.wikipedia.org/wiki/Faux-texte#Lorem_ipsum_.28version_populaire.29">
+
-
<h2 class="lien"id="Paragraphe1">Welcome on our first version of the Wiki !<span> By Robin</span></h2>
+
-
</a>
+
-
<p >Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec pharetra volutpat nisl. Nullam sollicitudin nulla eget justo. Maecenas urna dui, mollis ut, tristique sit amet, adipiscing nec, neque. Praesent bibendum tempor metus. Sed vitae tellus mollis magna luctus ultrices. Mauris sollicitudin aliquet nunc. Aenean urna. Duis lorem. Proin augue. Quisque interdum felis eu diam.</p>
+
-
</div>
+
}
-
<div class="left">
+
-
<img class="icon" src="greenzap/photos_etudiants/samia.png"/>
+
-
<a href="http://syntheticbiology.org/">
+
-
<h2 class="lien"id="Paragraphe2">iGem and the future of synthetic biology<span>By Samia</span></h2>
+
-
</a>
+
 +
.body h1 {
-
<p>Etiam pede lectus, facilisis sit amet, varius a, malesuada varius, nisl. Aenean aliquam, odio quis semper cursus, nisl lacus rutrum ipsum, a laoreet neque ante vitae tortor. In hac habitasse platea dictumst. Ut at neque interdum enim pharetra commodo. Curabitur erat mi, congue ut, volutpat vel, semper ac, wisi. Sed non metus vel massa pharetra euismod. Nunc quis quam. Curabitur non libero a libero semper tincidunt. Mauris vehicula dui a wisi. Quisque nisl dolor, tempus nec, tristique vitae, eleifend eget, nunc. Duis dapibus, lectus eget egestas consectetuer, nibh metus pharetra nisl, vitae rutrum mi tellus placerat nulla. Praesent sed libero non enim suscipit aliquet. Proin tincidunt pede sit amet eros.</p>
+
font:bold 34px Arial, Helvetica, sans-serif;
-
<p>Phasellus sed nisl. Integer rhoncus risus vitae arcu. Praesent sed diam non justo sagittis vulputate. Etiam faucibus posuere tortor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam porta. Vestibulum lectus ante, laoreet a, condimentum sit amet, dictum ac, sapien. Ut et tortor. Aliquam vitae lacus. Vestibulum non pede eget ante elementum elementum. Quisque accumsan wisi id quam. Integer tortor justo, cursus volutpat, vehicula ut, pellentesque ultrices, neque. Aenean eu tortor vitae dui pretium molestie. Sed dui nibh, rhoncus ut, egestas quis, commodo id, magna. Morbi gravida tellus id diam. Nunc nonummy leo nec velit. Curabitur id lacus a ipsum lacinia accumsan.</p>
+
color:#323a3f;
-
<p>Nunc ullamcorper imperdiet lorem. Aliquam convallis, sapien sit amet malesuada dignissim, sem tortor interdum risus, vel scelerisque sapien est ac justo. Sed varius nisl lacinia libero accumsan luctus. Nam luctus leo. In hac habitasse platea dictumst. Donec eget massa. Vivamus arcu ante, condimentum eu, imperdiet et, pulvinar vel, neque. Morbi auctor. Sed ac ligula. Pellentesque adipiscing orci id ipsum. Fusce ipsum. Cras eget neque. Nulla at sapien ornare augue tempor viverra. Praesent vulputate. Mauris mi. Quisque quam. Cras fermentum orci non risus. Phasellus quis augue vitae felis tincidunt dignissim. Vestibulum ut nulla at eros sagittis ullamcorper.</p>
+
padding:10px 5px;
-
</div>
+
margin:5px 2px 12px 0;
 +
}
-
<div class="left">
+
.body h3 {
-
<img class="icon" src="greenzap/photos_etudiants/clement.png"/>
+
-
<a href="http://syntheticbiology.org/">
+
-
<h2 class="lien"id="Paragraphe2">A great human adventure<span>By Clement</span></h2>
+
-
</a>
+
-
<p>Nunc ullamcorper imperdiet lorem. Aliquam convallis, sapien sit amet malesuada dignissim, sem tortor interdum risus, vel scelerisque sapien est ac justo. Sed varius nisl lacinia libero accumsan luctus. Nam luctus leo. In hac habitasse platea dictumst. Donec eget massa. Vivamus arcu ante, condimentum eu, imperdiet et, pulvinar vel, neque. Morbi auctor. Sed ac ligula. Pellentesque adipiscing orci id ipsum. Fusce ipsum. Cras eget neque. Nulla at sapien ornare augue tempor viverra. Praesent vulputate. Mauris mi. Quisque quam. Cras fermentum orci non risus. Phasellus quis augue vitae felis tincidunt dignissim. Vestibulum ut nulla at eros sagittis ullamcorper.</p>
+
-
<p>Sed vel erat. Aenean a massa. Quisque ultricies, dolor non rutrum ullamcorper, lorem ligula blandit pede, malesuada volutpat magna dolor et ante. In tellus felis, tincidunt eget, adipiscing eu, gravida sit amet, lorem. Proin dolor. Proin vel elit. Morbi vel enim. Aenean congue enim sed ipsum. Praesent tristique. Ut placerat metus sed nibh. Sed sit amet urna. Morbi et lorem. Sed a erat eget dolor sollicitudin ornare. Maecenas nibh. Quisque tincidunt. Sed odio diam, dapibus a, interdum non, convallis id, pede. Donec condimentum eros eu nunc consequat commodo. Donec tempus fringilla eros.</p>
+
font:bold 24px Arial, Helvetica, sans-serif;
-
<img class="floated" src="greenzap/images/mit.jpg"/>
+
color:#323a3f;
-
<p>Mauris mollis luctus urna. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Suspendisse consectetuer sem at urna. Aliquam dui magna, congue non, porttitor vitae, varius a, lacus. Duis nec enim. Quisque malesuada, lectus vel laoreet egestas, lorem nibh ultricies elit, et varius velit erat vel risus. Maecenas pellentesque nibh et purus. Nulla commodo justo vitae odio. Sed ornare. Quisque at tortor. Donec mi. Vestibulum consectetuer congue purus. Aenean pulvinar.</p>
+
padding:10px 5px;
-
<p>Nam vel arcu quis justo condimentum egestas. Aliquam dictum wisi. Nam lorem. Ut scelerisque. In velit tortor, venenatis eget, ultricies id, mollis nec, dui. Morbi nec ante vitae libero fermentum aliquam. Ut non quam. Cras ac urna. Aenean sollicitudin turpis sit amet quam. Quisque lacinia. Proin mollis. Vestibulum dapibus, nulla sit amet lacinia dapibus, est odio condimentum lorem, id aliquam lorem enim vitae nibh. Nulla tortor. Nunc pulvinar. Vestibulum malesuada wisi et urna.</p>
+
margin:5px 0 10px 0;
-
<p>Nam sodales hendrerit enim in aliquam. Quisque viverra egestas est aliquet sagittis. Maecenas ut orci ipsum, ut egestas tellus. Fusce convallis, massa in iaculis pretium, massa tellus facilisis risus, commodo tempor enim lacus sed libero. Cras lacinia diam quis tellus eleifend pellentesque. Nunc eu suscipit libero. Suspendisse in diam est, et congue justo. Sed pulvinar pharetra leo, accumsan vehicula ipsum pharetra sit amet. Phasellus pharetra metus sit amet orci ornare lacinia. Donec eget purus sapien, nec imperdiet odio. Aenean vel quam quis enim convallis posuere hendrerit hendrerit augue. Etiam nisl eros, tempus ut placerat vitae, auctor et risus. Nulla lectus turpis, tincidunt pellentesque lobortis in, dapibus eget ligula. Phasellus blandit velit et enim ornare euismod porttitor sem viverra. Curabitur convallis suscipit nunc dapibus viverra. </p>
+
}
 +
 
 +
.body h3 span.vert{
 +
 
 +
color:#8fc400;
 +
 
 +
}
 +
 
 +
 
 +
 
 +
.body h2 span {
 +
 
 +
float:right;
 +
 
 +
color:#959595;
 +
 
 +
font:normal 12px Arial, Helvetica, sans-serif;
 +
 
 +
}
 +
 
 +
.body p {
 +
 
 +
font:normal 12px Arial, Helvetica, sans-serif;
 +
 
 +
color:#5f5f5f;
 +
 
 +
padding:5px;
 +
 
 +
margin:0;
 +
 
 +
line-height:1.8em;
 +
 
 +
}
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
.body img {
 +
 
 +
float:left;
 +
 
 +
padding:0;
 +
 
 +
 +
 
 +
}
 +
 
 +
.body img.icon {
 +
 
 +
margin: 15px 5px 2px 0;
 +
 
 +
width:80px;
 +
 
 +
height:auto;
 +
 
 +
}
 +
 
 +
 
 +
 
 +
.body img.floated {
 +
 
 +
float:right;
 +
 
 +
margin:5px 10px 5px 0;
 +
 
 +
padding:0;
 +
 
 +
width:auto;
 +
 
 +
height:auto;
 +
 
 +
}
 +
 
 +
.body a {
 +
 
 +
color:#97c950;
 +
 
 +
text-decoration:underline;
 +
 
 +
}
 +
 
 +
 
 +
 
 +
.body h2.lien:hover{
 +
 
 +
background-color: #D8FFC8;
 +
 
 +
}
 +
 
 +
 
 +
 
 +
.left {
 +
 
 +
float:left;
 +
 
 +
width:65%;
 +
 
 +
margin:40px 0px 10px 25px;
 +
 
 +
padding: 0 25px;
 +
 
 +
background:url(images/l_bg.gif) top left no-repeat;
 +
 
 +
}
 +
 
 +
.right {
 +
 
 +
 
 +
 
 +
float:right;
 +
 
 +
width:20%;
 +
 
 +
margin:40px 10px 0 0;
 +
 
 +
padding:0 25px;
 +
 
 +
background:url(images/r_bg.gif) top center no-repeat;
 +
 
 +
}
 +
 
 +
.right ul {
 +
 
 +
list-style:none;
 +
 
 +
margin:5px 0;
 +
 
 +
padding:0;
 +
 
 +
}
 +
 
 +
.right li {
 +
 
 +
background:10px 10px no-repeat;
 +
 
 +
font:normal 14px Arial, Helvetica, sans-serif;
 +
 
 +
color:#464646;
 +
 
 +
padding:5px 0;
 +
 
 +
margin:3px 0;
 +
 
 +
}
 +
 
 +
.right li a {
 +
 
 +
padding:0 0 0 5px;
 +
 
 +
margin:0;
 +
 
 +
font:bold 17px Arial, Helvetica, sans-serif;
 +
 
 +
color:#5f5f5f;
 +
 
 +
text-decoration:none;
 +
 
 +
}
 +
 
 +
.right li a:hover {
 +
 
 +
color:#97c950;
 +
 
 +
margin:5px;
 +
 
 +
/*background-color:#a2cd9a;*/
 +
 
 +
text-decoration:none;
 +
 
 +
}
 +
 
 +
.right ul.sponsors {
 +
 
 +
list-style:none;
 +
 
 +
margin:5px 0;
 +
 
 +
padding:0;
 +
 
 +
}
 +
 
 +
.right li.sponsors {
 +
 
 +
background:none;
 +
 
 +
font:normal 12px Arial, Helvetica, sans-serif;
 +
 
 +
color:#5f5f5f;
 +
 
 +
padding:8px 0;
 +
 
 +
}
 +
 
 +
.right li.sponsors a {
 +
 
 +
padding:0 0 0 0px;
 +
 
 +
margin:0;
 +
 
 +
font:normal 13px Arial, Helvetica, sans-serif;
 +
 
 +
color:#97c950;
 +
 
 +
text-decoration:none;
 +
 
 +
}
 +
 
 +
.right li.sponsors strong {
 +
 
 +
color:#97c950;
 +
 
 +
}
 +
</style>
 +
 
 +
</head>
 +
 
 +
<body>
 +
 +
<div class="menu">
 +
<ul>
 +
<li><a href="/Team:Grenoble">Home</a></li>
 +
<li><a href="/Team:Grenoble/The_Team/">The Team</a></li>
 +
<li><a href="/Team:Grenoble/Grenoble">Project</a></li>
 +
<li><a href="/Team:Grenoble/Notebook">Notebook</a></li>
 +
<li><a href="/Team:Grenoble/Safety">Safety</a></li>
 +
<li><a href="/Team:Grenoble/HumanPractice">Human Practice</a></li>
 +
<li><a href="/Team:Grenoble/Sponsors">Sponsors</a></li>
 +
</ul>
 +
</div>
 +
 
 +
 
 +
<!-- Au-dessus : le code pour le header et la bannière + menu -->
 +
 
 +
<!-- En-dessous : Le sidebar menu, à droite -->
-
<div class="left">
+
<div class="body" id="arf" >  
-
</div>
+
<div class="right">
-
</div>
+
<h3><span class="vert">TEAM:</span>Grenoble</h3>
 +
<ul>
 +
<li><a href="/Team:Grenoble">Home</a></li>
 +
<li><a href="/Team:Grenoble/The_Team/">The Team</a></li>
 +
<li><a href="/Team:Grenoble/Grenoble">Project</a></li>
 +
<li><a href="/Team:Grenoble/Notebook">Notebook</a></li>
 +
<li><a href="/Team:Grenoble/Safety">Safety</a></li>
 +
<li><a href="/Team:Grenoble/HumanPractice">Human Practice</a></li>
 +
<li><a href="/Team:Grenoble/Sponsors">Sponsors</a></li>
 +
</ul>
 +
 +
<h3><span class="vert">Our</span> Sponsors</h3>
 +
<a href="https://2011.igem.org/Team:Grenoble/Sponsors"><img src="https://static.igem.org/mediawiki/2011/c/c8/Logosright.png"\></a>
 +
<br/>
 +
 +
<h3><span class="vert">Event</span> Calendar</h3>
 +
 +
<p>
 +
<ul>
 +
<li>2nd September:</li>
 +
</ul>
 +
<a href="http://www.minatec.com/midis">Conference Midi Minatec,</a>
 +
<br />
 +
3 parvis Louis Néel<br />
 +
38 000 GRENOBLE<br />
 +
                        FRANCE
 +
</p>
 +
 +
 +
<h3><span class="vert">Contact</span> Us</h3>
 +
 
 +
<h3>
 +
<a title="Geoffrey BOUCHAGE" href="mailto:geoffrey.bouchage@phelma.grenoble-inp.fr"> Clic here !</a>
 +
</h3>
 +
 
 +
</div>
 +
 
 +
 
 +
<!-- Le corps du site, ce qui ne fera pas partie du template : -->
-
<script type="text/javascript">
 
-
var s = document.getElementById('arf');
 
-
var w = screen.width;
 
-
//alert(screen.width);
 
-
//alert(s);
 
-
var r = (w/3097)*452 + 192;
 
-
//alert(r);
 
-
var str = String(r)+"px";
 
-
//alert(str);
 
-
s.style.top = str;
 
-
</script>
+
 
-
        <script type="text/javascript">
+
<script type="text/javascript">
-
document.getElementById('p-logo').innerHTML = '<a href=\"/Main_Page\" title=\"Main Page\"> <div class="blabla"> <img src=\'http://www.chachatelier.fr/programmation/images/mozodojo-original-image.jpg\'> </div></a>'
+
var s = document.getElementById('arf');
 +
var w = screen.width;
 +
//alert(screen.width);
 +
//alert(s);
 +
var r = (w/3097)*452 + 192;
 +
//alert(r);
 +
var str = String(r)+"px";
 +
//alert(str);
 +
s.style.top = str;
</script>
</script>
-
</body>
+
 
 +
<script type="text/javascript">
 +
var hones = document.getElementsByTagName('h1');
 +
hones[0].innerHTML = '<span>Team:</span>Grenoble v0.2<br/><small>In Tartiflette we trust</small>';
 +
</script>
 +
 
 +
<script type="text/javascript">
 +
document.getElementById('p-logo').innerHTML = '<a href=\"/Main_Page\" title=\"Main Page\">  <img class=\"blabla\" src=\'http://farm4.static.flickr.com/3067/3084131521_36c059f6f0_b.jpg\'> </a>'
 +
</script>
 +
 
 +
 
 +
</body>
 +
 
</html>
</html>

Latest revision as of 15:06, 24 July 2011



Grenoble

TEAM:Grenoble

Our Sponsors


Event Calendar

  • 2nd September:
Conference Midi Minatec,
3 parvis Louis Néel
38 000 GRENOBLE
FRANCE

Contact Us

Clic here !

Retrieved from "http://2011.igem.org/Team:Grenoble/Templates/Team:Grenoble_V02"