Difference between revisions of "Team:Lethbridge HS/Team"

(Prototype team page)
 
Line 1: Line 1:
−
{{Lethbridge_HS}}
+
<html lang="en">
−
<html>
+
    <head>
−
 
+
        <meta charset="utf-8">
−
 
+
        <meta name="viewport" content="width=device-width, initial-scale=1">
−
 
+
        <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
−
<div class="column full_size" >
+
        <link rel="stylesheet" href="main.css">
−
 
+
        <link rel="stylesheet" href="animations.css">
−
<p>In this page you can introduce your team members, instructors, and advisors. </p>
+
                <link rel="stylesheet" href="flaticon.css">
−
 
+
−
 
+
−
</div>
+
−
 
+
−
<div class="column half_size" >
+
−
<h5>Inspiration</h5>
+
−
<p>You can look at what other teams did to get some inspiration! <br />
+
−
Here are a few examples:</p>
+
−
<ul>
+
−
<li><a href="https://2014.igem.org/Team:METU_Turkey_team">METU Turkey </a></li>
+
−
<li><a href="https://2014.igem.org/Team:Colombia/Members">Colombia</a></li>
+
−
<li><a href="https://2014.igem.org/Team:Stony_Brook/Team">Stony Brook</a></li>
+
−
<li><a href="https://2014.igem.org/Team:OUC-China/Team">OUC-China</a></li>
+
−
</ul>
+
−
 
+
−
</div>
+
−
 
+
−
<div class="column half_size" >
+
−
<h5>What should this page contain?</h5>
+
−
<ul>
+
−
<li> Include pictures of your teammates, don’t forget instructors and advisors! </li>
+
−
<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>
+
−
<li>Take team pictures! Show us your school, your lab and little bit of your city.</li>
+
−
<li>Remember that image galleries can help you showcase many pictures while saving space.</li>
+
−
</ul>
+
−
</div>
+
−
 
+
−
 
+
  
 +
        <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
 +
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
 +
        <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
 +
        <script src="js/jquery.localscroll.min.js" type="text/javascript"></script>
 +
        <script src="js/jquery.scrollTo.min.js" type="text/javascript"></script>
 +
       
 +
        <script type="text/javascript">
 +
            $(document).ready(function(){
 +
               
 +
                $('.profilePicBox img').mouseenter(function(){
 +
                    var parent = $(this).parent();
 +
                    var infoBoxPopUp = $(parent).next();
 +
                    var selected_member = $(this).data('type');
 +
                    $('.profileInfoBox.'+selected_member+'').addClass('showInfoBox');
 +
                   
 +
                    $('.profilePicBox img').each(function(){
 +
                        if ($(this).data('type')==selected_member){
 +
                               
 +
                        }
 +
                            else{
 +
                                $(this).addClass('makeGray');
 +
                            }
 +
                    });
 +
                });
 +
                $('.profilePicBox img').mouseleave(function(){
 +
                    var parent = $(this).parent();
 +
                    var infoBoxPopUp = $(parent).next();
 +
                    var selected_member = $(this).data('type');
 +
                    $('.profileInfoBox.'+selected_member+'').removeClass('showInfoBox');
 +
                    $('.profilePicBox img').removeClass('makeGray');
 +
                });
 +
               
 +
                $('#blooddrop').addClass('delay-2000 animated pulse');
 +
                var s = $(".menu");
 +
                s.addClass("removeNavBarColor");
 +
                $(window).scroll(function(){
 +
                    var windowPos = $(window).scrollTop();
 +
                   
 +
                    if (windowPos >= 50){
 +
                        s.addClass("makeNavBarColor"); 
 +
                        s.removeClass("removeNavBarColor");
 +
                       
 +
                    }
 +
                    else{
 +
                        s.addClass("removeNavBarColor"); 
 +
                        s.removeClass("makeNavBarColor");
 +
                    }
 +
                })
 +
            });
 +
        </script>
 +
    </head>
  
 +
    <body>
 +
        <nav class="navbar navbar-default navbar-fixed-top menu" style="border:none;">
 +
            <div class="container-fluid" style="padding-left:10%; padding-right:10%;">
 +
                <div class="navbar-header">
 +
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar1" aria-expanded="false">
 +
                        <span class="sr-only">Toggle navgiation</span>
 +
                        <span class="icon-bar"></span>
 +
                        <span class="icon-bar"></span>
 +
                        <span class="icon-bar"></span>
 +
                        <span class="icon-bar"></span>
 +
                    </button>
 +
                    <a class="navbar-brand" href="#" style="color:#CC141C; margin-top:-5%;"><img src="images/logo.png" width="170"></a>
 +
                </div>
 +
               
 +
                <div class="collapse navbar-collapse" id="navbar1">
 +
                    <ul class="nav navbar-nav navbar-right" >
 +
                        <li class="dropdown">
 +
                            <a href="project.html" style="" class="dropdown-toggle" data-toggle = "dropdown" style="margin:0; padding:0; "><div class="glyph-icon flaticon-dna-structure menuIcon "></div>Project</a>
 +
                        <ul class="dropdown-menu">
 +
                            <li>
 +
                            <a href="#">adsf</a>
 +
                            <a href="#">adsfd</a>
 +
                            </li>
 +
                        </ul>
 +
                        </li>
 +
                        <li><a href="#" style="" class="menuitem" style="margin:0; padding:0; "><div class="glyph-icon flaticon-earth menuIcon"></div>Human Practices</a></li>
 +
                        <li><a href="#" style="" class="menuitem" style="margin:0; padding:0;"><div class="glyph-icon flaticon-notebook menuIcon "></div>Notebook</a></li>
 +
                        <li><a href="#" style="" class="menuitem" style="margin:0; padding:0; "><div class="glyph-icon flaticon-safety-glasses menuIcon "></div>Safety</a></li>
 +
                        <li><a href="#" style="" class="menuitem active" style="margin:0; padding:0; "><div class="glyph-icon flaticon-people  menuIcon active"></div>Team</a></li>
 +
                        <li><a href="#" style="" class="menuitem" style="margin:0; padding:0 "><div class="glyph-icon flaticon-earth menuIcon "></div>iGEM</a></li>
 +
                        <li class= "dropdown">
 +
                            <a href="#" class="dropdown-toggle" data-toggle = "dropdown">Project<b class="caret"></b></a>
 +
                            <ul class="dropdown-menu">
 +
                                <li>
 +
                                    <a href="project.html">Overview</a>
 +
                                    <a href="#">Math Model</a>
 +
                                </li>
 +
                            </ul>   
 +
                        </li>
 +
                    </ul>
 +
                </div>
 +
            </div>
 +
        </nav>
 +
       
 +
        <div class="jumbotron slide" id="slide_team_0" style="">
 +
            <!---<img id="blooddrop" src="images/blooddrop.png" width="50">-->
 +
            <img class="coverCircle" src="images/teamcircle.png" width="110px">
 +
        </div>
 +
       
 +
        <div class="container-fluid">
 +
            <h1>Students </h1>
 +
            <div class="row">
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img data-type="member-Dinula" src="images/Team/dinula1.jpg" onmouseover="this.src='images/Team/dinula2.jpg'"  onmouseout="this.src='images/Team/dinula1.jpg'" width="100%">
 +
                    </div>
 +
                    <div class="profileInfoBox member-Dinula">
 +
                        <h3>Dinula De Silva</h3>
 +
                        <p>I am a grade 12 student at Winston Churchill High School. I enjoy programming, playing the guitar, and watching movies. When I’m not stuck indoors, I like going running and biking. I joined iGEM because the feats of synthetic biology fascinated me and I wanted to learn more about the processes involved. I additionally wanted to develop my computer programming skills by working on the wiki and software aspect of the competition.</p>
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img data-type="member-Dinulasssss" src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                    <div class="profileInfoBox member-Dinulasssss">
 +
                        <h3>Dinula De Silva</h3>
 +
                        <p>Blah blah blah</p>
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img data-type="member-Dinulasss" src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                    <div class="profileInfoBox member-Dinulasss">
 +
                        <h3>Dinula De Silva</h3>
 +
                        <p>Blah blah blah</p>
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img data-type="member-Dinulass" src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                    <div class="profileInfoBox member-Dinulass">
 +
                        <h3>Dinula De Silva</h3>
 +
                        <p>Blah blah blah</p>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
            <div class="row">
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                    <div class="profileInfoBox">
 +
                        <h3>Dinula De Silva</h3>
 +
                        <p>Blah blah blah</p>
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img  src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                </div>
 +
            </div>
 +
            <div class="row">
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                    <div class="profileInfoBox">
 +
                        <h3>Dinula De Silva</h3>
 +
                        <p>Blah blah blah</p>
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img  src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-3">
 +
                    <div class="profilePicBox">
 +
                        <img src="images/Team/dinula1.jpg" width="100%">
 +
                    </div>
 +
                </div>
 +
            </div>
 +
        </div>
 +
       
 +
       
 +
    </body>
 
</html>
 
</html>

Revision as of 05:26, 2 September 2016

Students

Dinula De Silva

I am a grade 12 student at Winston Churchill High School. I enjoy programming, playing the guitar, and watching movies. When I’m not stuck indoors, I like going running and biking. I joined iGEM because the feats of synthetic biology fascinated me and I wanted to learn more about the processes involved. I additionally wanted to develop my computer programming skills by working on the wiki and software aspect of the competition.

Dinula De Silva

Blah blah blah

Dinula De Silva

Blah blah blah

Dinula De Silva

Blah blah blah

Dinula De Silva

Blah blah blah

Dinula De Silva

Blah blah blah