WikitemplateA home
From 2014.igem.org
(21 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
+ | |||
+ | |||
+ | <!-- this section changes the default wiki template to a | ||
+ | white full width background --> | ||
<style type="text/css"> | <style type="text/css"> | ||
- | #contentSub, #footer-box, #catlinks, #search-controls, #p- | + | #contentSub, #footer-box, #catlinks, #search-controls, #p- |
- | #top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/ | + | logo, .printfooter, .firstHeading,.visualClear {display: |
+ | |||
+ | none;} /*-- hides default wiki settings --*/ | ||
+ | |||
+ | #top-section { /*-- styling for default menu bar (edit, page, | ||
+ | |||
+ | history, etc.) --*/ | ||
border: 0 none; | border: 0 none; | ||
Line 16: | Line 26: | ||
} | } | ||
- | #globalWrapper, #content { /*-- changes default wiki settings --*/ | + | #globalWrapper, #content { /*-- changes default wiki settings |
+ | |||
+ | --*/ | ||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
Line 25: | Line 37: | ||
} | } | ||
- | html, body, .wrapper { /*-- changes default wiki settings --*/ | + | html, body, .wrapper { /*-- changes default wiki settings -- |
+ | |||
+ | */ | ||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
Line 31: | Line 45: | ||
} | } | ||
</style> | </style> | ||
+ | <style type="text/css"> | ||
+ | nav ul ul { | ||
+ | display: none; | ||
+ | } | ||
+ | nav ul li:hover > ul { | ||
+ | display: block; | ||
+ | } | ||
+ | nav ul { | ||
+ | background: #efefef; | ||
+ | background: linear-gradient(top, #efefef 0%, #bbbbbb 100%); | ||
+ | background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%); | ||
+ | background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%); | ||
+ | box-shadow: 0px 0px 9px rgba(0,0,0,0.15); | ||
+ | padding: 0 20px; | ||
+ | border-radius: 10px; | ||
+ | list-style: none; | ||
+ | position: relative; | ||
+ | display: inline-table; | ||
+ | } | ||
+ | nav ul:after { | ||
+ | content: ""; clear: both; display: block; | ||
+ | } | ||
+ | nav ul li { | ||
+ | float: left; | ||
+ | } | ||
+ | nav ul li:hover { | ||
+ | background: #4b545f; | ||
+ | background: linear-gradient(top, #4f5964 0%, #5f6975 40%); | ||
+ | background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%); | ||
+ | background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%); | ||
+ | } | ||
+ | nav ul li:hover a { | ||
+ | color: #fff; | ||
+ | } | ||
+ | |||
+ | nav ul li a { | ||
+ | display: block; padding: 25px 40px; | ||
+ | color: #757575; text-decoration: none; | ||
+ | } | ||
+ | nav ul ul { | ||
+ | background: #5f6975; border-radius: 0px; padding: 0; | ||
+ | position: absolute; top: 100%; | ||
+ | } | ||
+ | nav ul ul li { | ||
+ | float: none; | ||
+ | border-top: 1px solid #6b727c; | ||
+ | border-bottom: 1px solid #575f6a; | ||
+ | position: relative; | ||
+ | } | ||
+ | nav ul ul li a { | ||
+ | padding: 15px 40px; | ||
+ | color: #fff; | ||
+ | } | ||
+ | nav ul ul li a:hover { | ||
+ | background: #4b545f; | ||
+ | } | ||
+ | nav ul ul ul { | ||
+ | position: absolute; left: 100%; top:0; | ||
+ | } | ||
+ | </style> | ||
+ | <!-- here ends the section that changes the default wiki | ||
+ | template to a white full width background --> | ||
+ | |||
+ | <!-- beginning of your page --> | ||
<div id="contentcontainer"> | <div id="contentcontainer"> | ||
+ | <!-- this table contains the navigation bar --> | ||
<table width="975px" align="center"> | <table width="975px" align="center"> | ||
<tr> <td colspan="10" heigth="155px"> </td></tr> | <tr> <td colspan="10" heigth="155px"> </td></tr> | ||
<br> | <br> | ||
+ | |||
<tr> | <tr> | ||
+ | <!-- | ||
+ | **************Navigation bar************** | ||
+ | Each cell represents a button, | ||
+ | 1.- first row defines the borders outside each box, how the | ||
- | + | text is aligned and the height | |
- | + | 2.- second row defines the color, here you can change the | |
- | + | color by modifying the hex code | |
- | + | 3.- third row is where you place the link to where you want | |
- | + | that button to take you | |
- | + | 4.- fourth row you define the color of the text inside the | |
- | + | button and the content of it | |
- | + | --> | |
- | <td | + | <td> |
- | <a href="" | + | <nav> |
+ | <ul> | ||
+ | <li><a href="#">Home</a></li> | ||
+ | <li><a href="#">Team</a> | ||
+ | <ul> | ||
+ | <li><a href="#">Alejandro</a></li> | ||
+ | <li><a href="#">Isabel</a></li> | ||
+ | <li><a href="#">Karla Rios</a> | ||
+ | <ul> | ||
+ | <li><a href="#">Perfil</a></li> | ||
+ | <li><a href="#">Historial</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#">Project</a> | ||
+ | <ul> | ||
+ | <li><a href="#">Tema investigación I</a></li> | ||
+ | <li><a href="#">Tema investigación II</a></li> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="#">Parts</a></li> | ||
+ | <li><a href="#">Modeling</a></li> | ||
+ | <li><a href="#">Notebook</a></li> | ||
+ | <li><a href="#">Safely</a></li> | ||
+ | <li><a href="#">Attributions</a></li> | ||
+ | </ul> | ||
+ | </nav> | ||
+ | </td> | ||
- | |||
- | |||
- | |||
- | |||
- | <td | + | <!-- this is the iGEM logo! it will take to igem.org --> |
- | <a href=" | + | <td align ="center"> <a href="https://igem.org/Main_Page"> |
- | < | + | <img |
- | + | ||
+ | src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" | ||
- | + | width="55px"></a> </td> | |
</tr> | </tr> | ||
- | |||
<tr> <td colspan="10" heigth="45px"> </td></tr> | <tr> <td colspan="10" heigth="45px"> </td></tr> | ||
</table> | </table> | ||
+ | <!-- end of navigation bar --> | ||
- | <!-- | + | |
+ | <!-- page content begins--> | ||
+ | |||
<table width="975px" align="center"> | <table width="975px" align="center"> | ||
<tr ><td coslpan="2" height="35px"></td></tr> | <tr ><td coslpan="2" height="35px"></td></tr> | ||
Line 88: | Line 198: | ||
<td width="35%" valign="top"> | <td width="35%" valign="top"> | ||
- | <h3>Welcome | + | <h3>Welcome ! </h3> |
- | <p> | + | <p> |
+ | This is a basic template you may use to customize your wiki, | ||
+ | you can take it apart and modify it as much as you want. The | ||
+ | links and tabs provided here are basic suggestions, feel free | ||
+ | to adapt it for your team and your project. </p> | ||
+ | <p> | ||
+ | If you are looking for general wiki guidelines, | ||
+ | |||
+ | restrictions, design tips and more, visit the <br><a | ||
+ | |||
+ | href="https://2014.igem.org/Wiki_How-To"> Wiki How-To | ||
+ | |||
+ | Page</a></p> | ||
+ | </p> | ||
Line 99: | Line 222: | ||
<td width="5%" > </td> | <td width="5%" > </td> | ||
- | <td width="60%" > <img src="https://static.igem.org/mediawiki/2014/b/b7/ | + | |
+ | <!-- here you can place an image related to your project or | ||
+ | |||
+ | your logo! --> | ||
+ | <td width="60%" > <img | ||
+ | |||
+ | src="https://static.igem.org/mediawiki/2014/b/b7/2014placeholderima | ||
+ | |||
+ | ge.jpg" width="600px" height="300px"></td> | ||
Line 105: | Line 236: | ||
<tr ><td coslpan="2" height="35px"></td></tr> | <tr ><td coslpan="2" height="35px"></td></tr> | ||
</tr> | </tr> | ||
- | |||
</table> | </table> | ||
+ | |||
+ | |||
+ | <!-- 3 columns content | ||
+ | this area is divided intro 3 columns, you can add more | ||
+ | |||
+ | information about your team, project, city or mention your | ||
+ | |||
+ | sponsors! --> | ||
<table width="975px" align="center"> | <table width="975px" align="center"> | ||
- | |||
+ | |||
+ | <tr> | ||
+ | <!-- first column --> | ||
<td width="30%"> | <td width="30%"> | ||
+ | <!-- you can have an image related to your paragraph --> | ||
+ | <img | ||
+ | |||
+ | src="https://static.igem.org/mediawiki/2014/b/b7/2014placeholderima | ||
+ | |||
+ | ge.jpg" width="300px" height="200px"> | ||
+ | <h4> Results</h4> | ||
+ | <p>Lorem ipsum ad his scripta blandit partiendo, eum fastidii | ||
+ | |||
+ | accumsan euripidis in, eum liber | ||
+ | hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit | ||
+ | |||
+ | ridens inciderint id. </p> | ||
- | |||
- | |||
</td> | </td> | ||
<td width="5%"></td> | <td width="5%"></td> | ||
+ | |||
+ | |||
+ | <!-- second column --> | ||
<td width="30%"> | <td width="30%"> | ||
+ | <img | ||
+ | |||
+ | src="https://static.igem.org/mediawiki/2014/b/b7/2014placeholderima | ||
+ | |||
+ | ge.jpg" width="300px" height="200px"> | ||
+ | <h4>Human Practice</h4> | ||
+ | <p>Lorem ipsum ad his scripta blandit partiendo, eum fastidii | ||
+ | |||
+ | accumsan euripidis in, | ||
+ | eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo | ||
- | + | dicit ridens inciderint id. </p> | |
- | + | ||
</td> | </td> | ||
<td width="5%"></td> | <td width="5%"></td> | ||
+ | |||
+ | |||
+ | <!-- third column --> | ||
<td width="30%"> | <td width="30%"> | ||
+ | <img | ||
- | + | src="https://static.igem.org/mediawiki/2014/b/b7/2014placeholderima | |
- | <p>Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. </p> | + | |
+ | ge.jpg" width="300px" height="200px"> | ||
+ | <h4>Follow us on Twitter/Facebook!</h4> | ||
+ | <p>Lorem ipsum ad his scripta blandit partiendo, eum fastidii | ||
+ | |||
+ | accumsan euripidis in, | ||
+ | eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, | ||
+ | |||
+ | quo dicit ridens inciderint id. </p> | ||
</td> | </td> | ||
</tr> | </tr> | ||
Line 134: | Line 309: | ||
</table> | </table> | ||
+ | <!-- end of 3 column content --> | ||
Line 139: | Line 315: | ||
</div> | </div> | ||
</html> | </html> | ||
+ | |||
+ | <!-- end of page --> |
Latest revision as of 16:48, 29 September 2014
Welcome !This is a basic template you may use to customize your wiki, you can take it apart and modify it as much as you want. The links and tabs provided here are basic suggestions, feel free to adapt it for your team and your project.
If you are looking for general wiki guidelines,
restrictions, design tips and more, visit the |
||
ResultsLorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. |
Human PracticeLorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. |
Follow us on Twitter/Facebook!Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. |