Difference between revisions of "Template:UIOWA"

(Replaced content with "<html> <style> #curves {border-radius: 100px;} </style>")
Line 3: Line 3:
 
#curves {border-radius: 100px;}
 
#curves {border-radius: 100px;}
 
</style>
 
</style>
 +
 +
 +
/***************************************************** DEFAULT WIKI SETTINGS  ****************************************************/
 +
 +
/* Clear the default wiki settings */
 +
 +
#home_logo, #sideMenu { display:none; }
 +
#sideMenu, #top_title, .patrollink  {display:none;}
 +
#content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
 +
body {background-color:white; }
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 +
 +
 +
 +
 +
/**************************************************************** MENU ***************************************************************/
 +
 +
 +
 +
/***************************************************** CONTENT OF THE PAGE ****************************************************/
 +
 +
/* Wrapper for the content */
 +
.igem_2017_content_wrapper {
 +
width: 81%;
 +
margin: 2%;
 +
display:block;
 +
float:left;
 +
background-color:white;
 +
font-family:Tahoma, Geneva, sans-serif;
 +
}
 +
 +
 +
/********************************* HTML STYLING  *********************************/
 +
 +
/* styling for the titles h1 h2 */
 +
.igem_2017_content_wrapper h1, .igem_2017_content_wrapper h2 {
 +
padding:5px 15px;
 +
border-bottom: 0px;
 +
color: gold;
 +
}
 +
 +
 +
/* styling for the titles  h3 h4 h5 h6*/
 +
.igem_2017_content_wrapper h3, .igem_2017_content_wrapper h4, .igem_2017_content_wrapper h5, .igem_2017_content_wrapper h6 {
 +
padding:5px 15px;
 +
border-bottom:0px;
 +
color: #000000; 
 +
}
 +
 +
 +
/* font and text */
 +
.igem_2017_content_wrapper p {
 +
padding: 0px 15px;
 +
font-size: 13px;
 +
}
 +
 +
/* Links */
 +
.igem_2017_content_wrapper a {
 +
font-weight: bold;
 +
text-decoration: underline;
 +
text-decoration-color: #3399ff;
 +
color:  #3399ff;
 +
-webkit-transition: all 0.4s ease;
 +
-moz-transition: all 0.4s ease;
 +
-ms-transition: all 0.4s ease;
 +
-o-transition: all 0.4s ease;
 +
transition: all 0.4s ease;
 +
}
 +
 +
/* hover for the links */
 +
.igem_2017_content_wrapper a:hover {
 +
text-decoration:none;
 +
color:#000000;
 +
}
 +
 +
/* non numbered lists */
 +
.igem_2017_content_wrapper ul {
 +
padding:0px 20px;
 +
font-size: 13px;
 +
font-family:Tahoma, Geneva, sans-serif;
 +
}
 +
 +
/* numbered lists */
 +
.igem_2017_content_wrapper ol {
 +
padding:0px;
 +
font-size: 13px;
 +
font-family:Tahoma, Geneva, sans-serif;
 +
}
 +
 +
/* Table */
 +
.igem_2017_content_wrapper table { 
 +
}
 +
 +
/* table cells */
 +
.igem_2017_content_wrapper  td {
 +
padding: 10px;
 +
}
 +
 +
/* table headers */
 +
.igem_2017_content_wrapper th {
 +
padding: 10px; 
 +
}
 +
 +
 +
/**********************************LAYOUT CLASSES **********************************/
 +
 +
/* general class for column divs */
 +
.igem_2017_content_wrapper .column  {
 +
padding: 10px 0px;
 +
float:left;
 +
}
 +
 +
/* class for a full width column */
 +
.column .full_size {
 +
width:100%;
 +
}
 +
 +
/* styling for images in a full width column*/
 +
.column.full_size img {
 +
width:97%;
 +
padding: 10px 15px;
 +
}
 +
 +
/* class for a half width column */
 +
.column.half_size {
 +
width: 50%;
 +
}
 +
/* styling for images in a half width column*/
 +
.column.half_size img {
 +
width: 94.5%;
 +
padding: 10px 15px;
 +
}
 +
 +
 +
 +
 +
/********************************* SUPPORT CLASSES ********************************/
 +
 +
/* class that clears content below*/
 +
.igem_2017_content_wrapper .clear {
 +
clear:both;
 +
}
 +
 +
 +
/* adds extra spacing when clearing content */
 +
.igem_2017_content_wrapper  .clear.extra_space {
 +
height: 30px;
 +
}
 +
 +
 +
/* highlight class, makes content slightly smaller */
 +
.igem_2017_content_wrapper .highlight {
 +
margin: 0px 15px;
 +
padding: 15px 0px;
 +
}
 +
 +
 +
/* highlight class, adds a gray background */
 +
.igem_2017_content_wrapper .highlight.gray {
 +
background-color: #f2f2f2;
 +
}
 +
 +
/* highlight with decoration blue line on top */
 +
.igem_2017_content_wrapper .highlight.blue_top {
 +
    border-top: 4px solid #3399ff;
 +
}
 +
 +
/* highlight with a full blue border decoration */
 +
.igem_2017_content_wrapper .highlight.blue_border {
 +
    border: 4px solid  #3399ff;
 +
}
 +
 +
 +
/* button class */
 +
.igem_2017_content_wrapper .button{
 +
max-width: 35%;
 +
margin: 30px auto;
 +
padding: 12px 10px;
 +
    background-color: #3399ff;
 +
    text-align: center;
 +
  color: #ffffff;
 +
-webkit-transition: all 0.4s ease;
 +
-moz-transition: all 0.4s ease;
 +
-ms-transition: all 0.4s ease;
 +
-o-transition: all 0.4s ease; transition: all 0.4s ease; 
 +
}
 +
 +
/* styling for button on hover */
 +
.igem_2017_content_wrapper .button:hover{
 +
background-color: #3399ff;
 +
    color: #000000;
 +
}
 +
 +
 +
 +
 +
/***************************************************** RESPONSIVE STYLING ****************************************************/
 +
 +
/* IF THE SCREEN IS LESS THAN 1200PX */
 +
@media only screen and (max-width: 1200px) {
 +
 +
#content {width:100%; }
 +
.igem_2017_menu_wrapper {width:15%; right:0;}
 +
.highlight {padding:10px 0px;}
 +
.igem_2017_menu_wrapper #display_menu_control { display:none; }
 +
#menu_content { display:block;}
 +
.menu_button.direct_to_page {padding-left: 17px;}
 +
 +
}
 +
 +
/* IF THE SCREEN IS LESS THAN 800PX */
 +
@media only screen and (max-width: 800px) {
 +
 +
.igem_2017_menu_wrapper { width:100%; height: 15%; position:relative; left:0%;}
 +
.igem_2017_content_wrapper {width:100%; margin-left:0px;}
 +
.column.half_size  {width:100%; }
 +
.column.full_size img, .column.half_size img {  width: 100%; padding: 10px 0px;}
 +
.highlight {padding:15px 5px;}
 +
.igem_2017_menu_wrapper #display_menu_control { display:block; }
 +
#menu_content { display:none;}
 +
.igem_2017_menu_wrapper .menu_button .expand_collapse_icon { width: 5%; }
 +
.menu_bottom_padding {display:none;}
 +
.menu_button.direct_to_page { padding-left: 36px; }
 +
}
 +
 +
 +
 +
 +
/* special class that the system uses to make sure the team wants a page to be evaluated */
 +
.judges-will-not-evaluate {
 +
    width: 96.6%;
 +
  margin: 5px 15px;
 +
  display: block;
 +
border: 4px solid #3399ff;
 +
    font-weight: bold;
 +
}
 +
 +
</style>
 +
 +
 +
<!--- THIS IS WHERE THE HTML BEGINS --->
 +
 +
 +
 +
<head>
 +
 +
<!-- This tells the browser that your page is responsive -->
 +
<meta name="viewport" content="width=device-width, initial-scale=1">
 +
 +
</head>
 +
 +
 +
 +
<div class="igem_2017_menu_wrapper" >
 +
 +
 +
 +
<a href="https://2017.igem.org/Team:UIOWA">
 +
<img src="https://static.igem.org/mediawiki/2017/5/54/T--UIOWA--banner.jpg" >
 +
</a>
 +
 +
 +
<!-- this div is hidden by default and will only be displayed if the screen size is too small -->
 +
<div class="menu_button" id="display_menu_control">
 +
MENU 
 +
</div>
 +
 +
<div id="menu_content">
 +
 +
 +
 +
 +
<a href="https://2017.igem.org/Team:UIOWA">
 +
<div class="menu_button direct_to_page">
 +
HOME
 +
</div>
 +
</a>
 +
 +
 +
 +
<div class="menu_button">
 +
<div class="expand_collapse_icon">  </div> TEAM
 +
</div>
 +
 +
<div class="submenu_wrapper" id="team_submenu">
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Team">
 +
<div class="submenu_button" id="Team_page">
 +
Team
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Collaborations">
 +
<div class="submenu_button"  id="Collaborations_page">
 +
Collaborations
 +
</div>
 +
</a>
 +
 +
 +
</div>
 +
 +
 +
 +
 +
 +
<div class="menu_button">
 +
<div class="expand_collapse_icon">  </div> PROJECT
 +
</div>
 +
 +
<!-- project submenu -->
 +
<div class="submenu_wrapper">
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Description">
 +
<div class="submenu_button"  id="Description_page">
 +
Description
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Design">
 +
<div class="submenu_button"  id="Design_page">
 +
Design
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Experiments">
 +
<div class="submenu_button"  id="Experiments_page">
 +
Experiments
 +
</div>
 +
</a>
 +
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Notebook">
 +
<div class="submenu_button"  id="Notebook_page">
 +
Notebook
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/InterLab">
 +
<div class="submenu_button"  id="InterLab_page">
 +
InterLab
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Contribution">
 +
<div class="submenu_button"  id="Contribution_page">
 +
Contribution
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Model">
 +
<div class="submenu_button"  id="Model_page">
 +
Model
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Results">
 +
<div class="submenu_button"  id="Results_page">
 +
Results
 +
</div>
 +
</a>
 +
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Demonstrate">
 +
<div class="submenu_button"  id="Demonstrate_page">
 +
Demonstrate
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Improve">
 +
<div class="submenu_button"  id="Improve_page">
 +
Improve
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Attributions">
 +
<div class="submenu_button"  id="Attributions_page">
 +
Attributions
 +
</div>
 +
</a>
 +
 +
</div>
 +
 +
 +
 +
 +
 +
 +
<div class="menu_button">
 +
<div class="expand_collapse_icon">  </div> PARTS
 +
</div>
 +
 +
<!-- parts submenu -->
 +
<div class="submenu_wrapper">
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Parts">
 +
<div class="submenu_button"  id="Parts_page">
 +
Parts
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Basic_Part">
 +
<div class="submenu_button"  id="Basic_Part_page">
 +
Basic Parts
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Composite_Part">
 +
<div class="submenu_button"  id="Composite_Part_page">
 +
Composite Parts
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Part_Collection">
 +
<div class="submenu_button"  id="Part_Collection_page">
 +
Part Collection
 +
</div>
 +
</a>
 +
</div>
 +
 +
 +
 +
 +
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Safety">
 +
<div class="menu_button direct_to_page">
 +
SAFETY
 +
</div>
 +
</a>
 +
 +
 +
 +
 +
 +
 +
 +
<div class="menu_button" >
 +
<div class="expand_collapse_icon">  </div> HUMAN PRACTICES
 +
</div>
 +
 +
<!-- human practices submenu -->
 +
<div class="submenu_wrapper">
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/HP/Silver">
 +
<div class="submenu_button"  id="Silver_page">
 +
Silver HP
 +
</div>
 +
</a>
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/HP/Gold_Integrated">
 +
<div class="submenu_button" id="Gold_Integrated_page">
 +
Integrated and Gold
 +
</div>
 +
</a>
 +
 +
 +
<a href="https://2017.igem.org/Team:UIOWA/Engagement">
 +
<div class="submenu_button"  id="Engagement_page">
 +
Public Engagement
 +
</div>
 +
</a>
 +
 +
</div>
 +
 +
 +
 +
<a href="https://igem.org/2017_Judging_Form?team=UIOWA">
 +
<div class="menu_button direct_to_page">
 +
JUDGING FORM
 +
</div>
 +
</a>
 +
 +
 +
 +
<div class="menu_bottom_padding" >
 +
</div>
 +
 +
</div>
 +
 +
 +
 +
 +
</div>
 +
 +
 +
 +
<!-- start of content -->
 +
<div class="igem_2017_content_wrapper">
 +
<div align=center >

Revision as of 17:31, 30 June 2017

/***************************************************** DEFAULT WIKI SETTINGS ****************************************************/ /* Clear the default wiki settings */ #home_logo, #sideMenu { display:none; } #sideMenu, #top_title, .patrollink {display:none;} #content { width:100%; padding:0px; margin-top:-7px; margin-left:0px;} body {background-color:white; } #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; } /**************************************************************** MENU ***************************************************************/ /***************************************************** CONTENT OF THE PAGE ****************************************************/ /* Wrapper for the content */ .igem_2017_content_wrapper { width: 81%; margin: 2%; display:block; float:left; background-color:white; font-family:Tahoma, Geneva, sans-serif; } /********************************* HTML STYLING *********************************/ /* styling for the titles h1 h2 */ .igem_2017_content_wrapper h1, .igem_2017_content_wrapper h2 { padding:5px 15px; border-bottom: 0px; color: gold; } /* styling for the titles h3 h4 h5 h6*/ .igem_2017_content_wrapper h3, .igem_2017_content_wrapper h4, .igem_2017_content_wrapper h5, .igem_2017_content_wrapper h6 { padding:5px 15px; border-bottom:0px; color: #000000; } /* font and text */ .igem_2017_content_wrapper p { padding: 0px 15px; font-size: 13px; } /* Links */ .igem_2017_content_wrapper a { font-weight: bold; text-decoration: underline; text-decoration-color: #3399ff; color: #3399ff; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } /* hover for the links */ .igem_2017_content_wrapper a:hover { text-decoration:none; color:#000000; } /* non numbered lists */ .igem_2017_content_wrapper ul { padding:0px 20px; font-size: 13px; font-family:Tahoma, Geneva, sans-serif; } /* numbered lists */ .igem_2017_content_wrapper ol { padding:0px; font-size: 13px; font-family:Tahoma, Geneva, sans-serif; } /* Table */ .igem_2017_content_wrapper table { } /* table cells */ .igem_2017_content_wrapper td { padding: 10px; } /* table headers */ .igem_2017_content_wrapper th { padding: 10px; } /**********************************LAYOUT CLASSES **********************************/ /* general class for column divs */ .igem_2017_content_wrapper .column { padding: 10px 0px; float:left; } /* class for a full width column */ .column .full_size { width:100%; } /* styling for images in a full width column*/ .column.full_size img { width:97%; padding: 10px 15px; } /* class for a half width column */ .column.half_size { width: 50%; } /* styling for images in a half width column*/ .column.half_size img { width: 94.5%; padding: 10px 15px; } /********************************* SUPPORT CLASSES ********************************/ /* class that clears content below*/ .igem_2017_content_wrapper .clear { clear:both; } /* adds extra spacing when clearing content */ .igem_2017_content_wrapper .clear.extra_space { height: 30px; } /* highlight class, makes content slightly smaller */ .igem_2017_content_wrapper .highlight { margin: 0px 15px; padding: 15px 0px; } /* highlight class, adds a gray background */ .igem_2017_content_wrapper .highlight.gray { background-color: #f2f2f2; } /* highlight with decoration blue line on top */ .igem_2017_content_wrapper .highlight.blue_top { border-top: 4px solid #3399ff; } /* highlight with a full blue border decoration */ .igem_2017_content_wrapper .highlight.blue_border { border: 4px solid #3399ff; } /* button class */ .igem_2017_content_wrapper .button{ max-width: 35%; margin: 30px auto; padding: 12px 10px; background-color: #3399ff; text-align: center; color: #ffffff; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } /* styling for button on hover */ .igem_2017_content_wrapper .button:hover{ background-color: #3399ff; color: #000000; } /***************************************************** RESPONSIVE STYLING ****************************************************/ /* IF THE SCREEN IS LESS THAN 1200PX */ @media only screen and (max-width: 1200px) { #content {width:100%; } .igem_2017_menu_wrapper {width:15%; right:0;} .highlight {padding:10px 0px;} .igem_2017_menu_wrapper #display_menu_control { display:none; } #menu_content { display:block;} .menu_button.direct_to_page {padding-left: 17px;} } /* IF THE SCREEN IS LESS THAN 800PX */ @media only screen and (max-width: 800px) { .igem_2017_menu_wrapper { width:100%; height: 15%; position:relative; left:0%;} .igem_2017_content_wrapper {width:100%; margin-left:0px;} .column.half_size {width:100%; } .column.full_size img, .column.half_size img { width: 100%; padding: 10px 0px;} .highlight {padding:15px 5px;} .igem_2017_menu_wrapper #display_menu_control { display:block; } #menu_content { display:none;} .igem_2017_menu_wrapper .menu_button .expand_collapse_icon { width: 5%; } .menu_bottom_padding {display:none;} .menu_button.direct_to_page { padding-left: 36px; } } /* special class that the system uses to make sure the team wants a page to be evaluated */ .judges-will-not-evaluate { width: 96.6%; margin: 5px 15px; display: block; border: 4px solid #3399ff; font-weight: bold; }

HOME
TEAM
PROJECT
Description
Design
Experiments
Notebook
InterLab
Contribution
Model
Results
Demonstrate
Improve
Attributions
PARTS
Parts
Basic Parts
Composite Parts
Part Collection
SAFETY
HUMAN PRACTICES
Silver HP
Integrated and Gold
Public Engagement
JUDGING FORM