Team:Reading/Template:Head

From 2014.igem.org

(Difference between revisions)
 
Line 1: Line 1:
-
body {
+
<html>
-
    background-color: #ffffff;
+
<head>
-
}
+
<style>
-
/* from PURE menu-core.css */
+
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
-
/*csslint adjoining-classes:false, outline-none:false*/
+
    display:none;}
-
/*TODO: Remove this lint rule override after a refactor of this code.*/
+
-
.pure-skin-mine .pure-menu ul {
+
body {
-
     position: absolute;
+
     margin: 10px 0 0 0;
-
     visibility: hidden;
+
     padding: 0;
-
}
+
     background-color: #CCCCCC;}
-
 
+
#top-section {
-
.pure-skin-mine .pure-menu.pure-menu-open {
+
     width: 965px;
-
     visibility: visible;
+
     height: 0;
-
    z-index: 2;
+
     margin: 0 auto;
-
    width: 100%;
+
-
}
+
-
 
+
-
.pure-skin-mine .pure-menu ul {
+
-
     left: -10000px;
+
-
     list-style: none;
+
-
     margin: 0;
+
     padding: 0;
     padding: 0;
-
     top: -10000px;
+
    border: none;}
-
     z-index: 1;
+
#menubar {
-
}
+
    font-size: 65%;
 +
     top: -14px;}
 +
.left-menu:hover {
 +
     background-color: transparent;}
 +
#menubar li a {
 +
    background-color: transparent;}
 +
#menubar:hover {
 +
    color: white;}
 +
#menubar li a {
 +
    color: transparent;}
 +
#menubar:hover li a {
 +
    color: white;}
 +
#menubar > ul > li:last-child {
 +
    display:none;}
-
.pure-skin-mine .pure-menu > ul { position: relative; }
 
-
.pure-skin-mine .pure-menu-open > ul {
 
-
    left: 0;
 
-
    top: 0;
 
-
    visibility: visible;
 
-
}
 
-
.pure-skin-mine .pure-menu-open > ul:focus {
+
#mainpage {
-
     outline: 0;
+
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
-
}
+
    width: 100%;
-
 
+
    border-collapse: collapse;
-
.pure-skin-mine .pure-menu li {
+
     margin-left: 0%;
 +
    margin-right: 5%;
     position: relative;
     position: relative;
 +
    top:-0px;
}
}
-
.pure-skin-mine .pure-menu a, .pure-skin-mine .pure-menu .pure-menu-heading {
+
#mainpage td, #mainpage th {
-
     display: block;
+
     font-size: 1em;
-
    color: inherit;
+
     padding: 3px 7px 2px 7px;
-
    line-height: 1.5em;
+
     vertical-align: text-top;
-
     padding: 0.35em 1.4em;
+
-
     text-decoration: none;
+
-
    white-space: nowrap;
+
}
}
-
.pure-skin-mine .pure-menu.pure-menu-horizontal > .pure-menu-heading {
+
#mainpage th {
-
     display: inline-block;
+
     text-align: center;
-
    *display: inline;
+
     padding-top: 5px;
-
    zoom: 1;
+
     padding-bottom: 4px;
-
    margin: 0;
+
     background-color: #ffffff;
-
    vertical-align: middle;
+
-
}
+
-
.pure-skin-mine .pure-menu.pure-menu-horizontal > ul {
+
-
     display: inline-block;
+
-
    *display: inline;
+
-
    zoom: 1;
+
-
    vertical-align: middle;
+
-
    /* height: 2.4em; removed for Skin Builder */
+
-
}
+
-
 
+
-
.pure-skin-mine .pure-menu li a { padding: 0.35em 1.4em; }
+
-
 
+
-
.pure-skin-mine .pure-menu-can-have-children > .pure-menu-label:after {
+
-
    content: '\25B8';
+
-
    float: right;
+
-
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'DejaVu Sans', sans-serif; /* These specific fonts have the Unicode char we need. */
+
-
    margin-right: -20px;
+
-
    margin-top: -1px;
+
-
}
+
-
 
+
-
.pure-skin-mine .pure-menu-can-have-children > .pure-menu-label {
+
-
     padding-right: 30px;
+
-
}
+
-
 
+
-
.pure-skin-mine .pure-menu-separator {
+
-
     background-color: #dce9d3;
+
-
    display: block;
+
-
    height: 1px;
+
-
    font-size: 0;
+
-
    margin: 7px 2px;
+
-
    overflow: hidden;
+
-
}
+
-
 
+
-
.pure-skin-mine .pure-menu-hidden {
+
-
    display: none;
+
-
}
+
-
 
+
-
/* FIXED MENU */
+
-
.pure-skin-mine .pure-menu-fixed {
+
-
    position: fixed;
+
-
    top:0;
+
-
    left:0;
+
-
    width: 100%;
+
-
}
+
-
 
+
-
 
+
-
/* HORIZONTAL MENU CODE */
+
-
 
+
-
/* Initial menus should be inline-block so that they are horizontal */
+
-
.pure-skin-mine .pure-menu-horizontal li {
+
-
    display: inline-block;
+
-
    *display: inline;
+
-
    zoom: 1;
+
-
    vertical-align: middle;
+
-
}
+
-
 
+
-
/* Submenus should still be display:block; */
+
-
.pure-skin-mine .pure-menu-horizontal li li {
+
-
    display: block;
+
-
}
+
-
 
+
-
/* Content after should be down arrow */
+
-
.pure-skin-mine .pure-menu-horizontal > .pure-menu-children > .pure-menu-can-have-children > .pure-menu-label:after {
+
-
    content: "\25BE";
+
-
}
+
-
/*Add extra padding to elements that have the arrow so that the hover looks nice */
+
-
.pure-skin-mine .pure-menu-horizontal > .pure-menu-children > .pure-menu-can-have-children > .pure-menu-label {
+
-
    padding-right: 30px;
+
-
}
+
-
 
+
-
/* Adjusting separator for vertical menus */
+
-
.pure-skin-mine .pure-menu-horizontal li.pure-menu-separator {
+
-
    height: 50%;
+
-
    width: 1px;
+
-
    margin: 0 7px;
+
-
}
+
-
 
+
-
/* Submenus should be horizontal separator again */
+
-
.pure-skin-mine .pure-menu-horizontal li li.pure-menu-separator {
+
-
height: 1px;
+
-
width: auto;
+
-
margin: 7px 2px;
+
-
}
+
-
 
+
-
 
+
-
/* end from yuicss/menu-core.css *******************************************/
+
-
/* from yuicss menu-paginator.css */
+
-
/*csslint box-model:false*/
+
-
/*TODO: Remove this lint rule override after a refactor of this code.*/
+
-
 
+
-
.pure-skin-mine .pure-paginator {
+
-
 
+
-
    /* `pure-g` Grid styles */
+
-
    letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
+
-
    *letter-spacing: normal; /* reset IE < 8 */
+
-
    *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
+
-
    text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */
+
-
 
+
-
    /* `pure-paginator` Specific styles */
+
-
    list-style: none;
+
-
    margin: 0;
+
-
    padding: 0;
+
-
}
+
-
.opera-only :-o-prefocus,
+
-
.pure-skin-mine .pure-paginator {
+
-
    word-spacing: -0.43em;
+
-
}
+
-
 
+
-
/* `pure-u` Grid styles */
+
-
.pure-skin-mine .pure-paginator li {
+
-
    display: inline-block;
+
-
    *display: inline; /* IE < 8: fake inline-block */
+
-
    zoom: 1;
+
-
    letter-spacing: normal;
+
-
    word-spacing: normal;
+
-
    vertical-align: top;
+
-
    text-rendering: auto;
+
-
}
+
-
.pure-skin-mine .pure-paginator .pure-button {
+
-
    border-radius: 0;
+
-
    padding: 0.8em 1.4em;
+
-
    vertical-align: top;
+
-
    height: 1.1em;
+
-
}
+
-
.pure-skin-mine .pure-paginator .pure-button:focus,
+
-
.pure-skin-mine .pure-paginator .pure-button:active {
+
-
    outline-style: none;
+
-
}
+
-
.pure-skin-mine .pure-paginator .prev,
+
-
.pure-skin-mine .pure-paginator .next {
+
-
    /*color: #C0C1C3; allow .pure-button to color text*/
+
-
}
+
-
.pure-skin-mine .pure-paginator .prev {
+
-
    border-radius: 4px 0px 0px 4px;
+
-
}
+
-
.pure-skin-mine .pure-paginator .next {
+
-
    border-radius: 0px 4px 4px 0px;
+
-
}
+
-
/* end from PURE menu-paginator.css ******************************/
+
-
/* from PURE menu.css *******************************************/
+
-
/* MAIN MENU STYLING */
+
-
/*csslint adjoining-classes:false*/
+
-
/*TODO: Remove this lint rule override after a refactor of this code.*/
+
-
 
+
-
.pure-skin-mine .pure-menu.pure-menu-open,
+
-
.pure-skin-mine .pure-menu.pure-menu-horizontal li .pure-menu-children {
+
-
    background: #f4f8f1; /* Old browsers */
+
-
    border: 1px solid #dce9d3;
+
-
}
+
-
 
+
-
/* remove borders for horizontal menus */
+
-
.pure-skin-mine .pure-menu.pure-menu-horizontal,
+
-
.pure-skin-mine .pure-menu.pure-menu-horizontal .pure-menu-heading {
+
     border: none;
     border: none;
 +
    color: #7C7C7C;
 +
    width: 20%;
 +
    line-height: 120px;
}
}
-
/* LINK STYLES */
+
</style>
 +
</head>
 +
<table id="mainpage">
-
.pure-skin-mine .pure-menu a {
+
<tr>
-
    border: 1px solid transparent;
+
<th height="60px">
-
    border-left: none;
+
<font size="100" line-height="60px">University of Reading iGEM</font>
-
    border-right: none;
+
</th>
 +
</tr>
-
}
+
<tr>
 +
<td>
-
.pure-skin-mine .pure-menu a,
+
<table  width="100%">
-
.pure-skin-mine .pure-menu .pure-menu-can-have-children > li:after {
+
<tr height="10px"></tr>
-
    color: #384e27;
+
<tr height="20px">
-
}
+
-
.pure-skin-mine .pure-menu .pure-menu-can-have-children > li:hover:after {
+
<td align ="center"> <a href="https://2014.igem.org/Main_Page"> <img align=centre src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="55px"></a> </td>
-
    color: #1d2915;
+
-
}
+
-
/* Focus style for a dropdown menu-item when the parent has been opened */
+
<td align="center" height ="20px" onMouseOver="this.bgColor='#70AE3D'" onMouseOut="this.bgColor='#77bd3f'" bgColor=#77bd3f> 
-
.pure-skin-mine .pure-menu .pure-menu-open {
+
<a href="https://2014.igem.org/Team:Reading"style="color:#4C4C4C">Home </a> </td>
-
    background: #ccdfbf;
+
-
}
+
-
.pure-skin-mine .pure-menu li a:hover,
+
<td align="center" height ="20px" onMouseOver="this.bgColor='#70AE3D'" onMouseOut="this.bgColor='#77bd3f'" bgColor=#77bd3f>
-
.pure-skin-mine .pure-menu li a:focus {
+
<a href="https://2014.igem.org/Team:Reading/Team"style="color:#4C4C4C"> Team </a> </td>
-
    background: #ccdfbf;
+
-
}
+
-
/* DISABLED STATES */
+
<td align="center"  height ="20px" onMouseOver="this.bgColor='#70AE3D'" onMouseOut="this.bgColor='#77bd3f'" bgColor=#77bd3f> 
-
.pure-skin-mine .pure-menu li.pure-menu-disabled a:hover,
+
<a href="https://2014.igem.org/Team:Reading/Project"style="color:#4C4C4C"> Project</a></td>
-
.pure-skin-mine .pure-menu li.pure-menu-disabled a:focus {
+
-
    background: #f4f8f1;
+
-
    color: #8ab46a;
+
-
}
+
-
.pure-skin-mine .pure-menu .pure-menu-disabled > a {
+
<td align="center"  height ="20px" onMouseOver="this.bgColor='#70AE3D'" onMouseOut="this.bgColor='#77bd3f'" bgColor=#77bd3f>  
-
    background-image: none;
+
<a href="https://2014.igem.org/Team:Reading/Parts"style="color:#4C4C4C"> Parts</a></td>
-
    border-color: transparent;
+
-
    cursor: default;
+
-
}
+
-
.pure-skin-mine .pure-menu .pure-menu-disabled > a,
+
<td align="center" height ="20px" onMouseOver="this.bgColor='#70AE3D'" onMouseOut="this.bgColor='#77bd3f'" bgColor=#77bd3f>  
-
.pure-skin-mine .pure-menu .pure-menu-can-have-children.pure-menu-disabled > a:after {
+
<a href="https://2014.igem.org/Team:Reading/Modeling"style="color:#4C4C4C"> Modeling</a></td>
-
    color: #8ab46a;
+
-
}
+
-
/* HEADINGS */
+
<td align="center" height ="20px" onMouseOver="this.bgColor='#70AE3D'" onMouseOut="this.bgColor='#77bd3f'" bgColor=#77bd3f> 
-
.pure-skin-mine .pure-menu .pure-menu-heading {
+
<a href="https://2014.igem.org/Team:Reading/Lab Work"style="color:#4C4C4C"> Lab Work </a></td>
-
    color: #182211;
+
-
    text-transform: uppercase;
+
-
    font-size: 90%;
+
-
    margin-top: 0.5em;
+
-
    border-bottom: solid 1px #dce9d3;
+
-
}
+
 +
<td align="center"  height ="20px" onMouseOver="this.bgColor='#70AE3D'" onMouseOut="this.bgColor='#77bd3f'" bgColor=#77bd3f>
 +
<a href="https://2014.igem.org/Team:Reading/Safety"style=" color:#4C4C4C"> Safety </a></td>
-
/* SELECTED MENU ITEM */
+
<td align="center"  height ="20px" onMouseOver="this.bgColor='#70AE3D'" onMouseOut="this.bgColor='#77bd3f'" bgColor=#77bd3f>
-
.pure-skin-mine .pure-menu li.pure-menu-selected a {
+
<a href="https://2014.igem.org/Team:Reading/Attributions"style="color:#4C4C4C"> Attributions </a></td>
-
    background-color: #77bd3f;
+
-
    color: #020401;
+
-
}
+
-
/* FIXED MENU */
+
<td align ="center"> <a href="https://2014.igem.org/Team:Reading"> <img align=centre src="https://static.igem.org/mediawiki/2014/3/34/Reading_Logo.png" width="55px"> </a></td> </tr>
-
.pure-skin-mine .pure-menu.pure-menu-open.pure-menu-fixed {
+
-
    border: none;
+
-
    border-bottom: 1px solid #dce9d3;
+
-
}
+
-
/* end from PURE menu.css ***********************************/
+
-
/* from PURE menu-responsive.css ****************************/
+
-
/* RESPONSIVE */
+
-
@media (max-width: 480px) {
+
</table>
-
    .pure-skin-mine .pure-menu-horizontal {
+
</td>
-
        width:100%;
+
</tr>
-
    }
+
-
    .pure-skin-mine .pure-menu-children li {
+
<tr> <td colspan="3"  height="15px"> </td></tr>
-
        display: block;
+
<tr><td bgColor="#7C7C7C" colspan="3" height="1px"> </tr>
-
        border-bottom:1px solid #dce9d3;
+
<tr> <td colspan="3"  height="5px"> </td></tr>
-
    }
+
-
 
+
-
}
+
-
/* end from menu-responsive.css ******************/
+

Latest revision as of 15:54, 27 August 2014

Retrieved from "http://2014.igem.org/Team:Reading/Template:Head"
University of Reading iGEM
Home Team Project Parts Modeling Lab Work Safety Attributions