|
|
| Line 1: |
Line 1: |
| | + | {{Grenoble-Alpes}} |
| | + | |
| | <html> | | <html> |
| | | | |
| − | <head>
| |
| − | <title> Team </title>
| |
| − | </head>
| |
| | | | |
| − | <style>
| |
| − | .section-title h2 {
| |
| − | display: inline-block;
| |
| − | font-size: 30px;
| |
| − | font-weight: 300;
| |
| − | line-height: 30px;
| |
| − | margin-bottom: 40px;
| |
| − | padding-bottom: 10px;
| |
| − | position: relative;
| |
| − | text-transform: uppercase;
| |
| − | }
| |
| − | .section-title h2:before {
| |
| − | position: absolute;
| |
| − | background: #575757;
| |
| − | height: 2px;
| |
| − | width: 45px;
| |
| − | content: "";
| |
| − | bottom: 0;
| |
| − | }
| |
| − | .portfolio-menu button.mixitup-control-active {
| |
| − | background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
| |
| − | border: 2px solid #4bcaff;
| |
| − | color: #4bcaff;
| |
| − | padding: 10px 15px;
| |
| − | font-weight: 700;
| |
| − | transition: .4s;
| |
| − | text-transform: uppercase;
| |
| − | }
| |
| − | .portfolio-menu button {
| |
| − | background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
| |
| − | border: 2px solid transparent;
| |
| − | color: #515f67;
| |
| − | padding: 10px 15px;
| |
| − | font-weight: 700;
| |
| − | text-transform: uppercase;
| |
| − | cursor: pointer;
| |
| − | }
| |
| − | .single-portfolio a {
| |
| − | display: block;
| |
| − | line-height: 0;
| |
| − | position: relative;
| |
| − | }
| |
| − | .single-portfolio a::before {
| |
| − | background: #000 none repeat scroll 0 0;
| |
| − | content: "";
| |
| − | height: 100%;
| |
| − | opacity: 0;
| |
| − | position: absolute;
| |
| − | top: 0;
| |
| − | transform: scale(0.5);
| |
| − | transition: all 0.3s ease 0s;
| |
| − | width: 100%;
| |
| − | }
| |
| − | .single-portfolio:hover a::before {
| |
| − | opacity: .5;
| |
| − | transform: scale(1);
| |
| − | }
| |
| − | .single-portfolio a::after {
| |
| − | color: #fff;
| |
| − | content: "+";
| |
| − | font-size: 60px;
| |
| − | left: 0;
| |
| − | position: absolute;
| |
| − | right: 0;
| |
| − | text-align: center;
| |
| − | top: 50%;
| |
| − | transform: scale(0);
| |
| − | transition: all 0.3s ease 0s;
| |
| − | }
| |
| − | .single-portfolio:hover a::after {
| |
| − | transform: scale(1);
| |
| − | }
| |
| − | </style>
| |
| | | | |
| − | <script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>
| + | <div class="column full_size" > |
| − | <script src="https://cdnjs.cloudflare.com/ajax/libs/mixitup/2.1.11/jquery.mixitup.min.js"></script>
| + | |
| − | <body>
| + | <h1>Team</h1> |
| − | <div class="container"> | + | <p>In this page you can introduce your team members, instructors, and advisors. </p> |
| − | <div class="row">
| + | |
| − | <div class="col-md-4">
| + | |
| − | <div class="section-title">
| + | |
| − | <h2>Portfolio</h2>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | <div class="col-md-8">
| + | |
| − | <div class="portfolio-menu">
| + | |
| − | <button type="button" data-filter="all">All</button>
| + | |
| − | <button type="button" data-filter=".category-a">Bootstrap</button>
| + | |
| − | <button type="button" data-filter=".category-b">HTML5</button>
| + | |
| − | <button type="button" data-filter=".category-c">CSS3</button>
| + | |
| − | <button type="button" data-filter=".category-d">JS</button>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| | </div> | | </div> |
| − | <div class="container"> | + | |
| − | <div id="container" class="row"> | + | <div class="clear"></div> |
| − | <div class="col-md-4 mix category-a">
| + | |
| − | <div class=" single-portfolio"> | + | <div class="column half_size" > |
| − | <a class="gallery-item" href="https://static.pexels.com/photos/402023/pexels-photo-402023.jpeg"><img class="img-responsive" src="https://static.pexels.com/photos/402023/pexels-photo-402023.jpeg" alt="One" /></a>
| + | <h5>Inspiration</h5> |
| − | </div>
| + | <p>You can look at what other teams did to get some inspiration! <br /> |
| − | </div>
| + | Here are a few examples:</p> |
| − | <div class="col-md-4 mix category-b">
| + | <ul> |
| − | <div class="single-portfolio">
| + | < li><a href="https:// 2014. igem. org/ Team: METU_Turkey_team"> METU Turkey </a></ li> |
| − | <a class="gallery-item" href="https://static.pexels.com/photos/402023/pexels-photo-402023.jpeg"><img class="img-responsive" src="https://static.pexels.com/photos/402023/pexels-photo-402023.jpeg" alt="One" /></a>
| + | < li><a href="https:// 2014. igem. org/ Team: Colombia/ Members"> Colombia</a></ li> |
| − | </div>
| + | < li><a href="https:// 2014. igem. org/ Team: Stony_Brook/ Team"> Stony Brook</a></ li> |
| − | </div>
| + | < li><a href="https:// 2014. igem. org/ Team:OUC-China/ Team"> OUC- China</a></ li> |
| − | <div class="col-md-4 mix category-c">
| + | </ul> |
| − | <div class="single-portfolio">
| + | |
| − | <a class="gallery-item" href="https:// static. pexels. com/ photos/402023/pexels-photo-402023.jpeg"><img class="img-responsive" src="https: //static.pexels.com/photos/402023/pexels-photo-402023.jpeg" alt="One" /></a> | + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | <div class="col-md-4 mix category-d">
| + | |
| − | <div class="single-portfolio">
| + | |
| − | <a class="gallery-item" href="https:// static. pexels. com/ photos/402023/pexels-photo-402023.jpeg"><img class="img-responsive" src="https:/ /static.pexels.com/photos/402023/pexels-photo-402023.jpeg" alt="One" /></a> | + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | <div class="col-md-4 mix category-a">
| + | |
| − | <div class="single-portfolio">
| + | |
| − | <a class="gallery-item" href="https://static.pexels.com/photos/402023/pexels-photo-402023.jpeg"><img class="img-responsive" src="https://static.pexels.com/photos/402023/pexels-photo-402023.jpeg" alt="One" /></a>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | <div class="col-md-4 mix category-b">
| + | |
| − | <div class="single-portfolio">
| + | |
| − | <a class="gallery-item" href="https:// static. pexels. com/ photos/ 402023/pexels-photo-402023.jpeg"> <img class="img- responsive" src="https://static.pexels.com/photos/402023/pexels-photo-402023.jpeg" alt="One" /></a> | + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| | </div> | | </div> |
| − | </body>
| |
| | | | |
| − | <script> | + | <div class="column half_size" > |
| − | $(document).ready(function() {
| + | <h5>What should this page contain?</h5> |
| − | // This will create a single gallery from all elements that have class "gallery-item"
| + | <ul> |
| − | $('.gallery-item').magnificPopup({
| + | <li> Include pictures of your teammates, don’t forget instructors and advisors! </li> |
| − | type: 'image',
| + | <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> |
| − | gallery:{
| + | <li>Take team pictures! Show us your school, your lab and little bit of your city.</li> |
| − | enabled:true
| + | <li>Remember that image galleries can help you showcase many pictures while saving space.</li> |
| − | }
| + | </ul> |
| − | });
| + | </div> |
| − |
| + | |
| − | // MixItUp 2
| + | |
| − | $('#container').mixItUp();
| + | |
| − | });
| + | </div> |
| − | </script> | + | |
| | </html> | | </html> |
Grenoble-Alpes
Team
In this page you can introduce your team members, instructors, and advisors.
Inspiration
You can look at what other teams did to get some inspiration!
Here are a few examples:
What should this page contain?
- Include pictures of your teammates, don’t forget instructors and advisors!
- 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.
- Take team pictures! Show us your school, your lab and little bit of your city.
- Remember that image galleries can help you showcase many pictures while saving space.
