Difference between revisions of "Team:NUDT CHINA/Team"

(Prototype team page)
 
Line 1: Line 1:
−
{{NUDT_CHINA}}
+
{{NUDT_CHINA/navbar}}
 
<html>
 
<html>
  
−
<div class="column two_thirds_size" >
+
<div class="container">
−
 
+
<div class="row clearfix">
−
<h1>Team</h1>
+
<nav class="navbar navbar-default navbar-fixed-top" role="navigation" style= "top:14px">
−
<p>In this page you can introduce your team members, instructors, and advisors. </p>
+
<div class="navbar-header">
−
 
+
<span class="icon-bar"></span></button> <a class="navbar-brand" href="#" style="font-size: 28px;">NUDT</a>
−
 
+
</div>
−
<h3>What should this page contain?</h3>
+
<div class="collapse navbar-collapse navbar-inverse" id="bs-example-navbar-collapse-1">
−
<ul>
+
<ul class="nav navbar-nav">
−
<li> Include pictures of your teammates, don’t forget instructors and advisors! </li>
+
<li class="active">
−
<li>You can add a small biography or a few words from each team member, to tell us what you like, and what motivated you to participate in iGEM.</li>
+
<a href="./home_template.html">Home</a>
−
<li>Take team pictures! Show us your school, your lab and little bit of your city.</li>
+
</li>
−
<li>Remember that image galleries can help you showcase many pictures while saving space.</li>
+
<li>
−
</ul>
+
<a href="./content_template.html">Content</a>
−
</div>
+
</li>
−
 
+
<li>
−
 
+
<a href="./team_template.html">Team</a>
−
 
+
</li>
−
<div class="column third_size" >
+
<li class="dropdown">
−
<div class="highlight decoration_A_full">
+
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<strong class="caret"></strong></a>
−
<h3>Inspiration</h3>
+
<ul class="dropdown-menu">
−
<p>You can look at what other teams did to get some inspiration! <br />
+
<li>
−
Here are a few examples:</p>
+
<a href="#">Action</a>
−
<ul>
+
</li>
−
<li><a href="https://2014.igem.org/Team:METU_Turkey_team">2014 METU Turkey </a></li>
+
<li>
−
<li><a href="https://2014.igem.org/Team:Colombia/Members">2014 Colombia</a></li>
+
<a href="#">Another action</a>
−
<li><a href="https://2014.igem.org/Team:Stony_Brook/Team">2014 Stony Brook</a></li>
+
</li>
−
<li><a href="https://2014.igem.org/Team:OUC-China/Team">2014 OUC-China</a></li>
+
<li>
−
</ul>
+
<a href="#">Something else here</a>
 +
</li>
 +
<li class="divider">
 +
</li>
 +
<li>
 +
<a href="#">Separated link</a>
 +
</li>
 +
<li class="divider">
 +
</li>
 +
<li>
 +
<a href="#">One more separated link</a>
 +
</li>
 +
</ul>
 +
</li>
 +
</ul>
 +
<form class="navbar-form navbar-left" role="search">
 +
<div class="form-group">
 +
<input type="text" class="form-control" />
 +
</div> <button type="submit" class="btn btn-default">Submit</button>
 +
</form>
 +
<ul class="nav navbar-nav navbar-right">
 +
<li id="my_bar_for_igem" style="margin-right:20px">
 +
<a href="#"><img src="img/bars_20.png"></a>
 +
</li>
 +
</ul>
 +
</div>
 +
</nav>
 +
<div class="container"  alt="show_photo">
 +
<div class="col-md-12 column" alt="show_photo" style="background-color:#f3f3f3">
 +
<div class="carousel slide" id="carousel-1">
 +
<ol class="carousel-indicators">
 +
<li data-slide-to="0" data-target="#carousel-1">
 +
</li>
 +
<li data-slide-to="1" data-target="#carousel-1">
 +
</li>
 +
<li data-slide-to="2" data-target="#carousel-1">
 +
</li>
 +
</ol>
 +
<div class="carousel-inner">
 +
<div class="item active ">
 +
<img alt="" src="img/1.jpg" class="img-responsive center-block"/>
 +
<div class="carousel-caption" style="background-color: rgba(0, 0, 0, 0.7);">
 +
<h4>
 +
First Team member label
 +
</h4>
 +
<p>
 +
something about him
 +
</p>
 +
</div>
 +
</div>
 +
<div class="item">
 +
<img alt="" src="img/2.jpg" class="img-responsive center-block"/>
 +
<div class="carousel-caption" style="background-color: rgba(0, 0, 0, 0.7);">
 +
<h4>
 +
Second Team member label
 +
</h4>
 +
<p>
 +
something about him
 +
</p>
 +
</div>
 +
</div>
 +
<div class="item">
 +
<img alt="" src="img/3.jpg" class="img-responsive center-block"/>
 +
<div class="carousel-caption" style="background-color: rgba(0, 0, 0, 0.7);">
 +
<h4>
 +
Third Team member label
 +
</h4>
 +
<p>
 +
something about him
 +
</p>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
<a class="left carousel-control" href="#carousel-1" data-slide="prev" style="background:url('img/left.png')  no-repeat center center;">
 +
</a>
 +
<a class="right carousel-control" href="#carousel-1" data-slide="next" style="background:url('img/left.png')  no-repeat center center; transform: rotate(180deg);">
 +
</a>
 +
</div>
 +
</div>
 +
<div class="container"  alt="show_inductors">
 +
<header class="section-header" style="margin-top: 100px">
 +
<h3>Inductors</h3>
 +
</header>
 +
<div class="col-md-12 column" style="background-color:#f3f3f3">
 +
<div class="row team">
 +
<div class="col-md-3" alt="person1">
 +
<div class="thumbnail member">
 +
<img alt="300x200" src="img/team-1.jpg" />
 +
<div class="member-info">
 +
<div class="member-info-content">
 +
<h4 class="text-center">
 +
Team member
 +
</h4>
 +
<p>
 +
something about him
 +
 +
</p>
 +
</div>
 +
</div>
 +
<div class="caption">
 +
<h3 class="text-center">
 +
Team member
 +
</h3>
 +
<p>
 +
something about him
 +
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
 +
</p>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="col-md-3" alt="person2">
 +
<div class="thumbnail member">
 +
<img alt="300x200" src="img/team-2.jpg" />
 +
<div class="member-info">
 +
<div class="member-info-content">
 +
<h4 class="text-center">
 +
Team member
 +
</h4>
 +
<p>
 +
something about him
 +
 +
</p>
 +
</div>
 +
</div>
 +
<div class="caption">
 +
<h3 class="text-center">
 +
Team member
 +
</h3>
 +
<p>
 +
something about him
 +
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
 +
</p>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="col-md-3" alt="person3">
 +
<div class="thumbnail member">
 +
<img alt="300x200" src="img/team-3.jpg" />
 +
<div class="member-info">
 +
<div class="member-info-content">
 +
<h4 class="text-center">
 +
Team member
 +
</h4>
 +
<p>
 +
something about him
 +
 +
</p>
 +
</div>
 +
</div>
 +
<div class="caption">
 +
<h3 class="text-center">
 +
Team member
 +
</h3>
 +
<p>
 +
something about him
 +
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
 +
</p>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="col-md-3" alt="person4">
 +
<div class="thumbnail member">
 +
<img alt="300x200" src="img/team-4.jpg" />
 +
<div class="member-info">
 +
<div class="member-info-content">
 +
<h4 class="text-center">
 +
Team member
 +
</h4>
 +
<p>
 +
something about him
 +
 +
</p>
 +
</div>
 +
</div>
 +
<div class="caption">
 +
<h3 class="text-center">
 +
Team member
 +
</h3>
 +
<p>
 +
something about him
 +
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
 +
</p>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="container" alt="show_student">
 +
<header class="section-header">
 +
<h3>Students</h3>
 +
</header>
 +
<div class="col-md-12 column" style="background-color:#f3f3f3">
 +
<div class="row team">
 +
<div class="col-md-3" alt="person1">
 +
<div class="thumbnail member">
 +
<img alt="300x200" src="img/team-1.jpg" />
 +
<div class="member-info">
 +
<div class="member-info-content">
 +
<h4 class="text-center">
 +
Team member
 +
</h4>
 +
<p>
 +
something about him
 +
 +
</p>
 +
</div>
 +
</div>
 +
<div class="caption">
 +
<h3 class="text-center">
 +
Team member
 +
</h3>
 +
<p>
 +
something about him
 +
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
 +
</p>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="col-md-3" alt="person2">
 +
<div class="thumbnail member">
 +
<img alt="300x200" src="img/team-2.jpg" />
 +
<div class="member-info">
 +
<div class="member-info-content">
 +
<h4 class="text-center">
 +
Team member
 +
</h4>
 +
<p>
 +
something about him
 +
 +
</p>
 +
</div>
 +
</div>
 +
<div class="caption">
 +
<h3 class="text-center">
 +
Team member
 +
</h3>
 +
<p>
 +
something about him
 +
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
 +
</p>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="col-md-3" alt="person3">
 +
<div class="thumbnail member">
 +
<img alt="300x200" src="img/team-3.jpg" />
 +
<div class="member-info">
 +
<div class="member-info-content">
 +
<h4 class="text-center">
 +
Team member
 +
</h4>
 +
<p>
 +
something about him
 +
 +
</p>
 +
</div>
 +
</div>
 +
<div class="caption">
 +
<h3 class="text-center">
 +
Team member
 +
</h3>
 +
<p>
 +
something about him
 +
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
 +
</p>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="col-md-3" alt="person4">
 +
<div class="thumbnail member">
 +
<img alt="300x200" src="img/team-4.jpg" />
 +
<div class="member-info">
 +
<div class="member-info-content">
 +
<h4 class="text-center">
 +
Team member
 +
</h4>
 +
<p>
 +
something about him
 +
 +
</p>
 +
</div>
 +
</div>
 +
<div class="caption">
 +
<h3 class="text-center">
 +
Team member
 +
</h3>
 +
<p>
 +
something about him
 +
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
 +
</p>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 
</div>
 
</div>
 +
<div class="col-md-12"  style="background-color: #0000004d; margin:0 ;padding:0">
 +
<a class="back-to-top" href="#top" style="background-image:url(img/left.png);transform: rotate(90deg);" ></a>
 +
<div class="col-md-push-3 col-md-2"  alt="logo_blow">
 +
<img alt="300x200" src="img/2018_igem_mobile_menu_logo.svg" />
 +
</div>
 +
<div class="col-md-push-4 col-md-5 " style="margin-top: 2.5%">
 +
<p style="font-size: 20px;">Thanks to everyone who join in the team!</p>
 +
</div>
 
</div>
 
</div>
 
</html>
 
</html>

Revision as of 17:37, 29 June 2018

Inductors

300x200

Team member

something about him

Team member

something about him Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.

300x200

Team member

something about him

Team member

something about him Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.

300x200

Team member

something about him

Team member

something about him Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.

300x200

Team member

something about him

Team member

something about him Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.

Students

300x200

Team member

something about him

Team member

something about him Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.

300x200

Team member

something about him

Team member

something about him Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.

300x200

Team member

something about him

Team member

something about him Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.

300x200

Team member

something about him

Team member

something about him Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.

300x200

Thanks to everyone who join in the team!