Difference between revisions of "Template:Example"

(Prototype team template page)
 
(40 intermediate revisions by 2 users not shown)
Line 8: Line 8:
 
#content { padding:0px; width:1000px; margin-top:-7px; margin-left:0px;}
 
#content { padding:0px; width:1000px; margin-top:-7px; margin-left:0px;}
 
body {background-color:white; }
 
body {background-color:white; }
−
 
+
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
−
 
+
  
 
/********************************* MENU ********************************/
 
/********************************* MENU ********************************/
Line 37: Line 36:
 
.menu_item:hover {  
 
.menu_item:hover {  
 
color:#000000;  
 
color:#000000;  
−
background-color: #32ddb5;
+
background-color: #72c9b6;
 
}
 
}
−
 
−
/* button on top of the page that takes you back to home */
 
−
.team_home {
 
−
border-bottom: 1px solid #d2d2d2;
 
−
}
 
−
 
−
 
−
.team_home a {
 
−
text-overflow: clip;
 
−
color: #000000;
 
−
height: 70px;
 
−
font-size: 13px;
 
−
font-weight: bold;
 
−
background-color: #32ddb5;
 
−
padding: 50px 0px 0px 0px;
 
−
display: block;
 
−
text-decoration: none;
 
−
text-align:center;
 
−
}
 
−
 
−
 
−
/* hover state for the back to home button */
 
−
.team_home a:hover  {
 
−
background-color:#000000;
 
−
color: #32ddb5;
 
−
}
 
−
 
  
 
/* decoration icon for the menu buttons*/
 
/* decoration icon for the menu buttons*/
Line 120: Line 92:
 
/* When hovering on a menu item */
 
/* When hovering on a menu item */
 
.menu_items li:hover {  
 
.menu_items li:hover {  
−
background-color:#32ddb5;  
+
background-color:#72c9b6;
 
color: #000000;
 
color: #000000;
 
}
 
}
Line 163: Line 135:
 
.submenu li a:hover  {
 
.submenu li a:hover  {
 
background-color:#000000;  
 
background-color:#000000;  
−
color: #32ddb5;  
+
color: #72c9b6;
 
}
 
}
  
Line 175: Line 147:
 
text-align:center;   
 
text-align:center;   
 
font-weight:bold;  
 
font-weight:bold;  
−
color:#32ddb5;  
+
color:#72c9b6;
 
cursor:pointer;  
 
cursor:pointer;  
 
-webkit-transition: all 0.4s ease;  
 
-webkit-transition: all 0.4s ease;  
Line 186: Line 158:
 
/* when hovering on that button */
 
/* when hovering on that button */
 
.collapsable_menu_control:hover {  
 
.collapsable_menu_control:hover {  
−
background-color: #32ddb5;
+
background-color: #72c9b6;
 
color:#000000;   
 
color:#000000;   
 
}
 
}
Line 237: Line 209:
 
}
 
}
  
−
.incomplete {
+
.judges-will-not-evaluate {
−
border: 4px solid #32DDB5;
+
border: 4px solid #72c9b6;
 
display: block;
 
display: block;
 
margin: 5px 15px;
 
margin: 5px 15px;
Line 245: Line 217:
 
}
 
}
  
−
.complete {
 
−
display: none;
 
−
}
 
  
 
/*STYLING */
 
/*STYLING */
Line 253: Line 222:
 
/* styling for the titles */
 
/* styling for the titles */
 
.content_wrapper h1, .content_wrapper h2 {
 
.content_wrapper h1, .content_wrapper h2 {
−
padding:0px 15px;  
+
padding:5px 15px;  
 
border-bottom:0px;  
 
border-bottom:0px;  
−
color: #32ddb5;  
+
color:#72c9b6;
 +
 
 
}
 
}
 
.content_wrapper h3, .content_wrapper h4, .content_wrapper h5, .content_wrapper h6 {  
 
.content_wrapper h3, .content_wrapper h4, .content_wrapper h5, .content_wrapper h6 {  
−
padding:0px 15px;  
+
padding:5px 15px;  
 
border-bottom:0px;  
 
border-bottom:0px;  
 
color: #000000;   
 
color: #000000;   
Line 275: Line 245:
 
font-weight: bold;  
 
font-weight: bold;  
 
text-decoration: underline;
 
text-decoration: underline;
−
text-decoration-color:#32ddb5;  
+
text-decoration-color:#72c9b6;
−
color: #32ddb5;  
+
color: #72c9b6;
 
-webkit-transition: all 0.4s ease;
 
-webkit-transition: all 0.4s ease;
 
-moz-transition: all 0.4s ease;  
 
-moz-transition: all 0.4s ease;  
Line 335: Line 305:
 
text-align:center;  
 
text-align:center;  
 
font-weight:bold;  
 
font-weight:bold;  
−
background-color: #32ddb5;
+
background-color: #72c9b6;
 
cursor:pointer;   
 
cursor:pointer;   
 
-webkit-transition: all 0.4s ease;
 
-webkit-transition: all 0.4s ease;
Line 347: Line 317:
 
.button_click:hover {   
 
.button_click:hover {   
 
background-color:#000000;  
 
background-color:#000000;  
−
color: #32ddb5;  
+
color:#72c9b6;
 
}
 
}
  
Line 397: Line 367:
 
<div class="menu_wrapper" >
 
<div class="menu_wrapper" >
  
−
<div class="team_home">
+
 
−
<a href="https://2016.igem.org/Team:Example">Example</a>
+
−
</div>
+
  
  
Line 405: Line 373:
  
 
<ul id="accordion" class="accordion">
 
<ul id="accordion" class="accordion">
 +
 +
<li class="menu_item"> <a href="https://2016.igem.org/Team:Example">HOME </a> </li>
 +
  
 
<li class="menu_item"> <div class="icon plus"></div> TEAM
 
<li class="menu_item"> <div class="icon plus"></div> TEAM
Line 472: Line 443:
 
<div class="content_wrapper">
 
<div class="content_wrapper">
  
 +
 +
 +
<h1 id="team_name">  </h1>
 +
<h4 id="page_name">  </h4>
  
  
Line 488: Line 463:
  
 
$("#HQ_page").attr('id','');
 
$("#HQ_page").attr('id','');
 +
 +
 +
if ( wgPageName.substring( 0,  8) == "Template")  {  // if the page is a template it displays the full name in a single line
 +
$("#team_name").html( wgPageName );
 +
}
 +
 +
else if (  ( (wgPageName.match(/\//g) || []).length ) == 0 ) {  // if it is the home page , just print the team's name
 +
$("#team_name").html( wgPageName.substring( 5, wgPageName.length ) );
 +
}
 +
 +
else {
 +
// this adds the team's name as an h1
 +
$("#team_name").html( wgPageName.substring( 5 , wgPageName.indexOf("/")  ) );
 +
 +
// this adds the page's title as an h4
 +
$("#page_name").html (    ( wgPageName.substring( wgPageName.indexOf("/") + 1, wgPageName.length ) ).replace( /\/|_/g , " ")  );
 +
}
 +
 +
 +
if( ($(location).attr('href')).indexOf("submit") >= 0  ) {
 +
$(".menu_wrapper").css( { "position": "absolute", "height": "auto"});
 +
$("#wpTextbox1").css( 'margin-top', '440px');
 +
}
 +
 +
 +
  
 
$('#accordion').find('.menu_item').click(function(){
 
$('#accordion').find('.menu_item').click(function(){

Latest revision as of 16:05, 22 March 2017

MENU ▤