Difference between revisions of "Template:NYMU-Taipei/newtemplate1"

 
(329 intermediate revisions by the same user not shown)
Line 7: Line 7:
 
<link href="https://fonts.googleapis.com/css?family=Monoton" rel="stylesheet">
 
<link href="https://fonts.googleapis.com/css?family=Monoton" rel="stylesheet">
 
<link href="https://fonts.googleapis.com/css?family=Dosis" rel="stylesheet">
 
<link href="https://fonts.googleapis.com/css?family=Dosis" rel="stylesheet">
 +
<link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
  
 
<style>
 
<style>
 +
 +
body{
 +
font-family: 'Open Sans Condensed', sans-serif;
 +
font-size:120%;
 +
 +
}
 +
 +
body #content #HQ_page p, h1,h2,h3{
 +
font-family: 'Open Sans Condensed', sans-serif;
 +
 +
}
 +
 +
#home_logo, #sideMenu { display:none; }
 +
#sideMenu, #top_title, .patrollink  {display:none;}
 +
#content { margin-left:0px; margin-top:-7px; padding:0px; width:100%;}
 +
body {background-color:white; }
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 +
 +
.judges-will-not-evaluate { border: 4px solid #e4dede; padding: 2% !important; width: 92%!important;}
  
 
#toc{
 
#toc{
−
position:relative;
+
display:none;
−
left:-40%;
+
}
 +
 
 +
sidemenu{
 
width:20%;
 
width:20%;
 +
float:left
 +
position:fixed;
 
}
 
}
  
 
#page-content{
 
#page-content{
 
position:relative;
 
position:relative;
−
width:70%;
+
top:100px;
−
left:20%;
+
width:1040px;
 +
left:200px;
 +
margin:0px;
 +
}
 +
 
 +
.coverimage{
 +
width:1200px; z-index:2; opacity:0.9;
 +
}
 +
 
 +
.column{
 +
background-color:white; width:1180px; margin-left:0px; padding:10px;
 +
box-shadow: 0px 2px 10px #B1C4C9;
 +
 
 +
}
 +
 
 +
.story{
 +
border-style:solid;
 +
border-width:10px 0px 10px 0px;
 +
border-color:#638695;
 +
padding:20px;
 +
margin:20px;
 +
width:1000px;
 +
}
 +
 
 +
.story img{
 +
width: 90%;
 +
z-index:10;
 +
margin:40px;
 +
}
 +
 
 +
.paragraphs{
 +
 
 +
position:relative;
 +
width:90%;
 +
left:10%;
 +
}
 +
 
 +
#page-content .paragraphs p{
 +
font-size:30px;
 +
}
 +
 
 +
#page-content  h1{
 +
font-size:90px;
 +
text-align:left;
 +
margin:none;
 +
padding:none;
 +
height:50px;
 +
}
 +
 
 +
#page-content  .column h1{
 +
color:#638695; font-size:70px; line-height:1em;
 +
}
 +
 
 +
#page-content  h2{
 +
font-size:50px;
 +
line-height:2em;
 +
}
 +
#page-content  h3{
 +
font-size:40px;
 
}
 
}
  
−
#content { margin-left:0px; margin-top:-7px; padding:0px; width:100%;}
 
−
body {background-color:#F1F1F1; }
 
  
 
#container{
 
#container{
−
background-color:#F1F1F1;  
+
background-color:#f1f1f1;  
  
 
}
 
}
Line 32: Line 112:
 
a:hover{
 
a:hover{
 
text-decoration:none;
 
text-decoration:none;
 +
color:#638695;
 +
 
}
 
}
  
Line 40: Line 122:
 
a{
 
a{
 
text-decoration: none;
 
text-decoration: none;
 +
color:#B1C4C9;;
 
}
 
}
 +
 +
a:visited{
 +
text-decoration: none;
 +
color:#B1C4C9;;
 +
}
 +
  
 
#title{
 
#title{
Line 52: Line 141:
 
top:18px;
 
top:18px;
 
left:0px;
 
left:0px;
−
z-index: 1;
+
z-index: 3;
−
height: 100px;
+
height: 90px;
−
border-style:solid;
+
background-color:white;
−
border-width:0px 0px 5px 0px;
+
opacity:0.98;
−
border-color:#638695;
+
box-shadow: 0px 5px 100px;
−
background-color:#F1F1F1;
+
−
 
+
 
}
 
}
  
 
.dropdowns{
 
.dropdowns{
−
width:85%;
+
width:84%;
−
min-width:1250px;
+
min-width:1200px;
 
display:inline-block;
 
display:inline-block;
 
position:relative;
 
position:relative;
 
left:70px;
 
left:70px;
−
top:20px;
+
top: 15px;
 +
}
 +
 
 +
.menu-part{
 +
display:inline;
 
}
 
}
  
Line 76: Line 167:
 
     display: inline-block;
 
     display: inline-block;
 
min-width:140px;
 
min-width:140px;
−
width:10%;
+
width:12%;
 
text-align:center;
 
text-align:center;
−
color:#638695;
+
color:#4B727B;
−
font-size: 20px;
+
font-size: 17px;
 
}
 
}
  
Line 94: Line 185:
 
     z-index: 5;
 
     z-index: 5;
 
     text-align: left;
 
     text-align: left;
 +
width:100%;
 +
box-shadow: 0px 2px 10px;
 
}
 
}
  
 +
a {
 +
color:#B1C4C9;
 +
}
  
 +
a:hover{
 +
color:#638695;
 +
}
  
 
.dropdown .dropdown-content a div{
 
.dropdown .dropdown-content a div{
 
color:#B1C4C9;
 
color:#B1C4C9;
 
text-align:center;
 
text-align:center;
−
padding:15px;
+
padding:5px;
 
}
 
}
  
 
.dropdown .dropdown-content a :hover{
 
.dropdown .dropdown-content a :hover{
−
background-color:#e6e6e6;
+
background-color:#f1f1f1;
−
color:#B1C4C9;
+
color:#638695;
 
text-decoration:none;
 
text-decoration:none;
 
}
 
}
  
 
.nymu_menu img{
 
.nymu_menu img{
−
width: 40px;
+
min-width: 120px;
 +
width:9%;
 
position: relative;
 
position: relative;
 
left: 30px;
 
left: 30px;
Line 117: Line 217:
 
.dropdown:hover .dropdown-content {
 
.dropdown:hover .dropdown-content {
 
     display: block;
 
     display: block;
−
background-color: #F1F1F1;
+
background-color: white;
−
border-style:solid;
+
/*border-style:solid;
−
border-color:#B1C4C9;
+
border-color:#B1C4C9;*/
 
}
 
}
  
Line 131: Line 231:
  
  
−
 
−
 
−
/* cover of other pages*/
 
−
 
−
.covertopic{
 
−
position:absolute;
 
−
top:100px
 
−
}
 
−
 
−
.coversentnece{
 
−
position:absolute;
 
−
top:150px;
 
−
}
 
  
 
</style>
 
</style>
Line 154: Line 241:
 
<div id="title">HAIR TO STAY</div>
 
<div id="title">HAIR TO STAY</div>
  
−
<img src="https://static.igem.org/mediawiki/2018/b/b4/T--NYMU-Taipei--menuicon.png">
+
<div class="menu-part">
−
 
+
−
<div class="dropdowns">
+
−
 
+
 
<a href="https://2018.igem.org/Team:NYMU-Taipei">
 
<a href="https://2018.igem.org/Team:NYMU-Taipei">
−
<div class="dropdown">
+
<img src="https://static.igem.org/mediawiki/2018/c/cd/T--NYMU-Taipei--gear-logo-2.jpg" style="width:130px;">
−
HOME
+
−
</div>  
+
 
</a>
 
</a>
 +
</div>
 +
 +
<div class="dropdowns menu-part">
  
 
<!-- Team -->
 
<!-- Team -->
 
<div class="dropdown">
 
<div class="dropdown">
−
<div>
+
<div id="1r" onclick="closeintro(event),openintro(event)">
 
TEAM
 
TEAM
 
</div>  
 
</div>  
−
<div class="dropdown-content">
+
<div class="dropdown-content" id="1c">
 
 
 
<a href="https://2018.igem.org/Team:NYMU-Taipei/Team">
 
<a href="https://2018.igem.org/Team:NYMU-Taipei/Team">
Line 188: Line 273:
 
<div class="dropdown">
 
<div class="dropdown">
 
<!-- Project -->
 
<!-- Project -->
−
<div>
+
<div id="2r" onclick="closeintro(event),openintro(event)">
−
<div class="submenu_control_icon"> </div>
+
 
PROJECT
 
PROJECT
 
</div>  
 
</div>  
−
<div class="dropdown-content">
+
<div class="dropdown-content" id="2c">
 
 
 
<a href="https://2018.igem.org/Team:NYMU-Taipei/Description">
 
<a href="https://2018.igem.org/Team:NYMU-Taipei/Description">
Line 206: Line 290:
 
</a>
 
</a>
  
−
<a href="https://2018.igem.org/Team:NYMU-Taipei/Experiments">
+
<a href="https://2018.igem.org/Team:NYMU-Taipei/experimentsandresults">
 
<div >
 
<div >
−
Experiments
+
Experiments & Results
 
</div>
 
</div>
 
</a>
 
</a>
Line 229: Line 313:
 
<div >
 
<div >
 
Model
 
Model
−
</div>
 
−
</a>
 
−
 
−
<a href="https://2018.igem.org/Team:NYMU-Taipei/Results">
 
−
<div >
 
−
Results
 
 
</div>
 
</div>
 
</a>
 
</a>
Line 261: Line 339:
  
 
<div class="dropdown">
 
<div class="dropdown">
−
<div >
+
<div id="3r" onclick="closeintro(event),openintro(event)">
−
<div class="submenu_control_icon"> </div>
+
 
PARTS
 
PARTS
 
</div>
 
</div>
−
<div class="dropdown-content">
+
<div class="dropdown-content" id="3c">
 
 
 
<a href="https://2018.igem.org/Team:NYMU-Taipei/Parts">
 
<a href="https://2018.igem.org/Team:NYMU-Taipei/Parts">
Line 308: Line 385:
  
 
<div class="dropdown">
 
<div class="dropdown">
−
<div >
+
<div id="4r" onclick="closeintro(event),openintro(event)">
−
<div class="submenu_control_icon"> </div>  
+
 
HUMAN PRACTICES  
 
HUMAN PRACTICES  
 
</div>  
 
</div>  
  
−
<div class="dropdown-content">
+
<div class="dropdown-content"id="4c">
  
 
<a href="https://2018.igem.org/Team:NYMU-Taipei/Human_Practices">
 
<a href="https://2018.igem.org/Team:NYMU-Taipei/Human_Practices">
Line 334: Line 410:
  
 
<div class="dropdown">
 
<div class="dropdown">
−
<div >
+
<div id="5r" onclick="closeintro(event),openintro(event)">
−
<div class="submenu_control_icon"> </div>  
+
 
AWARDS
 
AWARDS
 
</div>  
 
</div>  
  
−
<div class="dropdown-content">
+
<div class="dropdown-content" id="5c">
  
 
<a href="https://2018.igem.org/Team:NYMU-Taipei/Applied_Design">
 
<a href="https://2018.igem.org/Team:NYMU-Taipei/Applied_Design">
Line 350: Line 425:
 
<div >
 
<div >
 
Entrepreneurship
 
Entrepreneurship
−
</div>
 
−
</a>
 
−
 
−
<a href="https://2018.igem.org/Team:NYMU-Taipei/Hardware">
 
−
<div >
 
−
Hardware
 
−
</div>
 
−
</a>
 
−
 
−
<a href="https://2018.igem.org/Team:NYMU-Taipei/Measurement">
 
−
<div>
 
−
Measurement
 
 
</div>
 
</div>
 
</a>
 
</a>
Line 368: Line 431:
 
<div >
 
<div >
 
Model
 
Model
−
</div>
 
−
</a>
 
−
 
−
<a href="https://2018.igem.org/Team:NYMU-Taipei/Plant">
 
−
<div >
 
−
Plant
 
−
</div>
 
−
</a>
 
−
 
−
 
−
<a href="https://2018.igem.org/Team:NYMU-Taipei/Software">
 
−
<div >
 
−
Software
 
 
</div>
 
</div>
 
</a>
 
</a>
Line 397: Line 447:
  
 
<!-- menuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu -->
 
<!-- menuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu -->
 +
 +
<div id="dot-side-bar"></div>
 +
 +
 +
<script type="text/javascript">
 +
$(document).ready(function(){
 +
var dots = [];
 +
var contents = document.getElementsByClassName("subtitle");
 +
for (var i = 0; i <= contents.length - 1; i++) {
 +
dots.push('<div class="sidebar-item"><span class="sidebar-stuff sidebar-switch dot"></span><div class="sidebar-content sidebar-stuff"><a href=#'+(i+1)+">"+contents[i].innerHTML+'</a></div></div>');
 +
}
 +
$("#dot-side-bar").html(dots.join().replace(/,/g,''));
 +
});
 +
 +
 +
 +
function closeintro(x){
 +
var intros = $('.intro');
 +
var targetintro = x.target.id.replace('d','c');
 +
for (var i = intros.length - 1; i >= 0; i--) {
 +
if (intros[i].id != targetintro) {
 +
intros[i].hide();
 +
}
 +
}
 +
}
 +
 +
function openintro(x){
 +
var targetintro = x.target.id.replace('r','c');
 +
document.getElementById(targetintro).show();;
 +
}
 +
 +
 +
</script>
 +
 +
<style type="text/css">
 +
#dot-side-bar{
 +
position: fixed;
 +
padding-top:200px;
 +
font-size: 20px;
 +
z-index:0px;
 +
background-color:#f0f0f0;
 +
height:100%;
 +
padding-right:0px;
 +
}
 +
.sidebar-content{
 +
display: inline-block;
 +
position:absolute;
 +
height:40px;
 +
width: 180px;
 +
}
 +
.sidebar-stuff{
 +
display: inline-block;
 +
}
 +
.sidebar-item{
 +
border-radius: 0px 20px 20px 0px;
 +
background-color:white;
 +
box-shadow: 0px 2px 10px #B1C4C9;
 +
height: 40px;
 +
display: block;
 +
min-width: 180px;
 +
margin:10px;
 +
margin-left:2px;
 +
margin-right:10px;
 +
padding-left:10px;
 +
color:gray;
 +
}
 +
.dot {
 +
  height: 15px;
 +
  width: 15px;
 +
  background-color: #bbb;
 +
  border-radius: 50%;
 +
  display: none;
 +
}
 +
.sidebar-item:hover .dot{
 +
background-color: #638695;
 +
}
 +
 +
#dot-side-bar {
 +
color:#bbb;
 +
}
 +
 +
#dot-side-bar .sidebar-item a{
 +
display:inline;
 +
}
 +
 +
#dot-side-bar .sidebar-item:hover a{
 +
color: #638695;
 +
}
 +
body{
 +
background-color: #F1F1F1;
 +
}
 +
 +
</style>
  
 
<!--the_above_is_to_be_copied----------------------------------------------------------------------------------------------------------------------------------------------------->
 
<!--the_above_is_to_be_copied----------------------------------------------------------------------------------------------------------------------------------------------------->

Latest revision as of 19:37, 17 October 2018

HAIR TO STAY
TEAM
Team Members
Collaborations
PROJECT
Description
Design
Experiments & Results
Notebook
InterLab
Model
Demonstrate
Improve
Attributions
PARTS
Parts Overview
Basic Parts
Composite Parts
Part Collection
SAFETY
HUMAN PRACTICES
Human Practices
Education & Engagement
AWARDS
Applied Design
Entrepreneurship
Model
JUDGING FORM ⇗