Difference between revisions of "Team:NUS Singapore-A/Team"

Line 1: Line 1:
 
{{NUS_Singapore-A}}
 
{{NUS_Singapore-A}}
 +
{{:Team:NUS_Singapore-A/Templates/Style}}
 
<html>
 
<html>
 
<head>
 
<head>
−
<link href="https://fonts.googleapis.com/css?family=Patua+One" rel="stylesheet">  
+
<link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,600" rel="stylesheet">
−
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">  
+
<link href="https://fonts.googleapis.com/css?family=Lora:400,400i,700i" rel="stylesheet">
  
 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
Line 9: Line 10:
 
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
 
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
  
 +
</head>
  
  
−
</head>
 
  
 +
<div class="inner-border" style="border-top:none;">
  
 +
  <div class="members-gallery">
 +
    <img src="https://static.igem.org/mediawiki/2018/f/fe/T--NUS_Singapore-A--TeamHeader.png">
 +
    <a href="#nanda" class="nanda"></a>
 +
    <a href="#ting2" class="ting2"></a>
 +
    <a href="#marcus" class="marcus"></a>
 +
    <a href="#rita" class="rita"></a>
 +
    <a href="#walter" class="walter"></a>
 +
    <a href="#liyana" class="liyana"></a>
 +
    <a href="#aaronl" class="aaronl"></a>
 +
    <a href="#russell" class="russell"></a>
 +
    <a href="#hyhy" class="hyhy"></a>
 +
    <a href="#ryan" class="ryan"></a>
 +
    <a href="#beatrix" class="beatrix"></a>
 +
    <a href="#jiacheng" class="jiacheng"></a>
 +
    <a href="#me" class="me"></a>
 +
    <div class="the-middle" id="nanda"></div>
 +
  </div>
  
−
<style>
+
<div class="all-wrapper">
 +
  <div class="profile-wrapper">
 +
  <div class="profile-content">
 +
    <div class="profile">
 +
      <div class="profile-picture">
 +
        <span class="portrait1 portrait_nanda"></span>
 +
      </div>
 +
      <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>NANDA WANG NUO'EN</h1>
 +
          <p>Biomedical Engineering</p>
 +
        </div>
  
−
.members-gallery{
+
        <h2>ROLE</h2>
−
  max-width: 80%;
+
        <p style="font-family: 'lora';">
−
  position: relative;
+
−
  margin: auto;
+
−
  padding: 10px;
+
−
}
+
−
.members-gallery img{
+
−
  max-width: 100%;
+
−
}
+
−
.nanda{
+
−
  position: absolute;
+
−
  top: 4.5%;
+
−
  left: 42.5%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.ting2{
+
−
  position: absolute;
+
−
  top: 21%;
+
−
  left: 29%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.marcus{
+
−
  position: absolute;
+
−
  top: 21%;
+
−
  left: 56.5%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.rita{
+
−
  position: absolute;
+
−
  top: 28.5%;
+
−
  left: 14%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.walter{
+
−
  position: absolute;
+
−
  top: 28.5%;
+
−
  left: 72%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.liyana{
+
−
  position: absolute;
+
−
  top: 37%;
+
−
  left: 42.5%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.aaronl{
+
−
  position: absolute;
+
−
  top: 49%;
+
−
  left: 26.5%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.russell{
+
−
  position: absolute;
+
−
  top: 49%;
+
−
  left: 58.5%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.hyhy{
+
−
  position: absolute;
+
−
  top: 54.5%;
+
−
  left: 9.5%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.ryan{
+
−
  position: absolute;
+
−
  top: 54.5%;
+
−
  left: 76%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.beatrix{
+
−
  position: absolute;
+
−
  top: 65%;
+
−
  left: 42.5%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.jiacheng{
+
−
  position: absolute;
+
−
  top: 75%;
+
−
  left: 27%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
−
.me{
+
−
  position: absolute;
+
−
  top: 75%;
+
−
  left: 59%;
+
−
  width: 12%;
+
−
  height: 21.5%;
+
−
}
+
  
−
</style>
+
        Team Leader, Head of Wet Lab, Member of Science Team, Marketing Team, Safety Team, and Human Practices Team
  
−
<div class="inner-border" style="border-top:none;">
+
        </p>
−
  <div class="members-gallery">
+
        <h2>AMBITION</h2>
−
    <img src="https://static.igem.org/mediawiki/2018/0/03/T--NUS_Singapore-A--NUSGEM_Team_Final.png">
+
        <p style="font-family: 'lora';">Nanda hopes to make the world a better place in any way she can, which includes helping anyone in need of her love and support. She’s one ambitious lady; she hopes to pick up as many skills as possible and be a Jack of all trades and Master of some. She envisions her future self as someone who would not only make significant contributions to the society, but also empower others, especially the underprivileged, to pursue their dreams. Aside from these, she has also been secretly wishing to have a celestial star named after her in future.</p>
−
    <img src=https://static.igem.org/mediawiki/2018/4/4e/T--NUS_Singapore-A--Jiacheng.jpeg">
+
        <h2>INTERESTING FACT ABOUT HER</h2>
−
    <a href="#" class="nanda"></a>
+
        <p style="font-family: 'lora';">Usually people can't tell which country is she from because of her rather unique name - it's not very Singaporean but she's born and bred in Singapore! Perhaps because of her multilingual name, she is skilled at doing English-Chinese translation, and would probably make a career of it if she can’t find employment related to her main degree.</p>
−
    <a href="#" class="ting2"></a>
+
      </div>
−
    <a href="#" class="marcus"></a>
+
     </div>
−
    <a href="#" class="rita"></a>
+
     <div class="the-middle" id="liyana"></div>
−
    <a href="#" class="walter"></a>
+
−
    <a href="#" class="liyana"></a>
+
−
    <a href="#" class="aaronl"></a>
+
−
    <a href="#" class="russell"></a>
+
−
     <a href="#" class="hyhy"></a>
+
−
     <a href="#" class="ryan"></a>
+
−
    <a href="#" class="beatrix"></a>
+
−
    <a href="#" class="jiacheng"></a>
+
−
    <a href="#" class="me"></a>
+
 
   </div>
 
   </div>
  
  
  
 +
  <div class="profile-content">
 +
    <div class="profile">
 +
      <div class="profile-picture">
 +
        <span class="portrait1 portrait_liyana"></span>
 +
      </div>
 +
      <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>NUR LIYANA BINTE AYUB OW YONG</h1>
 +
          <p>Life Sciences</p>
 +
        </div>
  
−
<style>
+
        <h2 style=>ROLE</h2>
 +
        <p style="font-family: 'lora';">
  
−
.profile-wrapper{
+
        Team Leader, Head of Creative, Member of Science Team and Wet Lab Team
−
  max-width: 300%;
+
−
  width: 100%;
+
−
  position: relative;
+
−
  overflow: hidden;
+
−
  margin: 2em auto;
+
−
}
+
  
−
.carousel{
+
        </p>
−
  width: 100%;
+
        <h2>AMBITION</h2>
−
  background-color: #ffffff;
+
        <p style="font-family: 'lora';">Liyana’s ultimate goal is to dedicate her life to humanitarian work, and be a powerful voice for women and children who have none. She also strives to help others recognize their own worth. As a side project, she’s working on inventing teleportation.
−
  position: relative;
+
</p>
−
}
+
        <h2>INTERESTING FACT ABOUT HER</h2>
−
.carousel-content{
+
        <p style="font-family: 'lora';">She loves it when people teach her things they’re passionate about. Languages, carpentry, sewing, bring it on! (Especially quantum mechanics someone please teach her please please please she really needs it for her teleportation thing...)
−
  width: auto;
+
</p>
−
  position: relative;
+
      </div>
−
  overflow: hidden
+
    </div>
−
  -webkit-backface-visibility: hidden;
+
    <div class="the-middle" id="jiacheng"></div>
−
  -webkit-transition: translate3d(0,0,0);
+
   </div>
−
}
+
−
.item{
+
−
  display: block;
+
−
  float: left;
+
−
  width: 100%;
+
−
  position: relative;
+
−
}
+
−
.carousel .carousel__nav {
+
−
  position: absolute;
+
−
  width: 100%;
+
−
  top: 50%;
+
−
  margin-top: -17px;
+
−
  left: 0;
+
−
  z-index: 1;
+
−
}
+
−
.carousel .carousel__nav .nav {
+
−
  position: absolute;
+
−
  top: 0;
+
−
  color: #000;
+
−
  background: #FFF;
+
−
  padding: 8px 12px;
+
−
  font-weight: bold;
+
−
  text-decoration: none;
+
−
  font-size: .8rem;
+
−
  transition: padding .25s ease;
+
−
}
+
−
.carousel .carousel__nav .nav:hover {
+
−
  padding: 8px 20px;
+
−
}
+
−
.carousel .carousel__nav .nav--left {
+
−
  border-radius: 0px 3px 3px 0px;
+
−
}
+
−
.carousel .carousel__nav .nav--right {
+
−
   right: 0;
+
−
  border-radius: 3px 0px 0px 3px;
+
−
}
+
−
.pic-and-name{
+
−
  width: 250px;
+
−
  display: inline-block;
+
−
}
+
  
−
.portrait1{
 
−
  height: 250px;
 
−
  width: 250px;
 
−
  border: 5px solid #0d090a;
 
−
  border-radius: 50%;
 
−
  background-size:cover;
 
−
  background-position: center;
 
−
  background-image: url("https://static.igem.org/mediawiki/2018/1/18/T--NUS_Singapore-A--Jiacheng_formal.jpg");
 
−
  float: left;
 
−
  margin-top: 60px;
 
−
  transition: 0.7;
 
−
  transition-property: background-image;
 
−
  transition-duration: 0.7s;
 
−
  transition-timing-function: linear;
 
−
}
 
−
.portrait1:hover{
 
−
  background-image: url("https://static.igem.org/mediawiki/2018/1/12/T--NUS_Singapore-A--Jiacheng_informal.jpg");
 
−
  transition: 0.7;
 
−
  transition-property: background-image;
 
−
  transition-duration: 0.7s;
 
−
  transition-timing-function: linear;
 
−
}
 
  
−
.name-tag{
 
−
  float: left;
 
−
  text-align: center;
 
−
  width: 250px;
 
−
  font-size: 2.5em;
 
−
  margin-top: 10px;
 
−
}
 
−
.info-wrapper{
 
−
  float: right;
 
−
  text-align: left !important;
 
−
  width: 735px;
 
−
  height: 400px;
 
−
  margin: 15px;
 
−
  padding: 10px;
 
−
  font-size: 1.75em;
 
−
  color: #521945;
 
−
  /*border: 2px solid #123C69;*/
 
−
}
 
−
.info-wrapper h2{
 
−
  margin: 0;
 
−
  font-size: 1.5em;
 
−
  border-bottom: 3px solid black;
 
−
}
 
−
.info-wrapper p{
 
−
  font-family: 'Open Sans', sans-serif;
 
−
  font-weight: 800;
 
−
  float: left;
 
−
  margin-top: 5px;
 
−
  font-size: .70em;
 
−
}
 
−
.carousel .carousel__content .item .title {
 
−
  position: absolute;
 
−
  top: 50%;
 
−
  left: 0;
 
−
  margin: -33px 0 0 0;
 
−
  padding: 0;
 
−
  font-size: 3rem;
 
−
  width: 100%;
 
−
  text-align: center;
 
−
  letter-spacing: .3rem;
 
−
  color: #FFF;
 
−
</style>
 
  
 +
    <div class="profile-content">
 +
      <div class="profile">
 +
        <div class="profile-picture">
 +
          <span class="portrait1 portrait_jc"></span>
 +
        </div>
 +
        <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>WU JIACHENG</h1>
 +
          <p>Engineering Science</p>
 +
        </div>
 +
          <h2>ROLE</h2>
 +
          <p style="font-family: 'lora';">
  
−
<div class="profile-wrapper">
+
          Head of Wiki, Head of Hardware
−
  <div class="carousel">
+
 
−
    <div class ="carousel-content">
+
          </p>
−
      <div class="item">
+
          <h2>AMBITION</h2>
−
        <p class="title">First</p>
+
          <p style="font-family: 'lora';">Jiacheng’s dream is uncomplicated. He just wants to travel around the world.</p>
−
         <img src="http://placehold.it/1800x850/70AD96/FFF&text=&nbsp;" alt="">
+
 
 +
          <h2>INTERESTING FACT ABOUT HIM</h2>
 +
          <p style="font-family: 'lora';">He loves philosophy. Thankfully, the kind of philosophy he’s inclined towards is not Sartre’s “Hell is other people” or Schopenhauer’s relentless pessimism, but more Lao Tzu’s “Simplicity, patience, compassion.” (Editor’s note: It is with deepest
 +
          regret that I announce the premature demise of the editorial gerbils, Pinky and The Brian. Hegel’s Phenomenology of Spirit was too much to handle. This intellectual deficiency will be rectified in the next generation of editorial gerbils.)
 +
          </p>
 +
         </div>
 +
      </div>
 +
      <div class="the-middle" id="ting2"></div>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
  
−
     <div class="carousel__nav">
+
 
−
       <a href="#" class="nav nav--left">Previous</a>
+
  <div class="profile-content">
−
       <a href="#" class="nav nav--right">Next</a>
+
     <div class="profile">
 +
       <div class="profile-picture">
 +
        <span class="portrait1 portrait_ting2"></span>
 +
       </div>
 +
      <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>ZHU TINGTING</h1>
 +
          <p>Life Sciences</p>
 +
        </div>
 +
        <h2>ROLE</h2>
 +
        <p style="font-family: 'lora';">
 +
 
 +
        Member of Science Team, Wet Lab Team, Safety Team, and Creative Team
 +
 
 +
        </p>
 +
        <h2>AMBITION</h2>
 +
        <p style="font-family: 'lora';">Ting Ting has a passion for fashion, and hopes to combine this with what she’s learning as a life sciences student.</p>
 +
        <h2>INTERESTING FACT ABOUT HER</h2>
 +
        <p style="font-family: 'lora';">For some incredibly odd reason, pigs stop when they meet Ting Ting. One day she may accidentally cause a traffic jam, either because all those pigs are blocking the way, or because she’s the chicest chica around.</p>
 +
      </div>
 
     </div>
 
     </div>
 +
    <div class="the-middle" id="marcus"></div>
 
   </div>
 
   </div>
  
−
</div>
 
  
  
 +
  <div class="profile-content">
 +
    <div class="profile">
 +
      <div class="profile-picture">
 +
        <span class="portrait1 portrait_marcus"></span>
 +
      </div>
 +
      <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>MARCUS CHAN</h1>
 +
          <p>Biomedical Engineering</p>
 +
        </div>
 +
        <h2>ROLE</h2>
 +
        <p style="font-family: 'lora';">
  
−
</div>
+
        Head of Modelling, Member of Creative Team and Hardware Team
  
 +
        </p>
 +
        <h2>AMBITION</h2>
 +
        <p style="font-family: 'lora';">When Marcus was a wee lad, he wanted to become a reality television star so he constantly practiced throwing drinks on everyone bar complete strangers. This dream was cruelly dashed so he’s studying biomedical engineering instead, in the hopes of becoming rich enough to own a lawn. He covets this hallowed, immaculate patch of greenery solely for the pleasure of being able to yell at young humans to GET OFF HIS LAWN.</p>
 +
        <h2>INTERESTING FACT ABOUT HIM</h2>
 +
        <p style="font-family: 'lora';">He loves feeling moisturized. Please send him many free samples of moisturizer.
 +
</p>
 +
      </div>
 +
    </div>
 +
    <div class="the-middle" id="rita"></div>
 +
  </div>
  
  
 +
  <div class="profile-content">
 +
    <div class="profile">
 +
      <div class="profile-picture">
 +
        <span class="portrait1 portrait_rita"></span>
 +
        <p class="namecard">RITA</p>
 +
      </div>
 +
      <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>TVARITA SHIVAKUMAR IYER</h1>
 +
          <p>Material Science Engineering</p>
 +
        </div>
 +
        <h2>ROLE</h2>
 +
        <p style="font-family: 'lora';">
  
−
<script>
+
        Head of Outreach, Member of Human Practices Team, Wet Lab Team, Hardware Team, and Creative Team
−
(function() {
+
−
  // Carousel variables
+
−
  var carouselContent, carouselIndex, carouselLength, firstClone, firstItem, isAnimating, itemWidth, lastClone, lastItem;
+
  
−
  carouselContent = $(".carousel__content");
+
        </p>
 +
        <h2>AMBITION</h2>
 +
        <p style="font-family: 'lora';">Tvarita is a connoisseur of ice lemon tea. She plans on starting a blog introducing plebeians such as ourselves to the finest ice lemon teas known to mankind.</p>
 +
        <h2>INTERESTING FACT ABOUT HER</h2>
 +
        <p style="font-family: 'lora';">Tvarita’s a vegetarian!
 +
</p>
 +
      </div>
 +
    </div>
 +
    <div class="the-middle" id="walter"></div>
 +
  </div>
  
−
   carouselIndex = 0;
+
   <div class="profile-content">
 +
    <div class="profile">
 +
      <div class="profile-picture">
 +
        <span class="portrait1 portrait_walter"></span>
 +
      </div>
 +
      <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>LAM SZE TUNG WALTER</h1>
 +
          <p>Medicine</p>
 +
        </div>
 +
        <h2>ROLE</h2>
 +
        <p style="font-family: 'lora';">
  
−
  carouselLength = carouselContent.children().length;
+
        Deputy Treasurer, Head of Human Practices, Editor of the Wiki, Member of Marketing Team
  
−
  isAnimating = false;
+
        </p>
 +
        <h2>AMBITION</h2>
 +
        <p style="font-family: 'lora';">Walter dreams of being the world's deadliest spy or becoming part of a secret intelligence organisation. He is also interested in having a dish named after him, getting crowned champion of an IKEA hotdog speed-eating contest, or defusing a bomb whilst performing open heart surgery in a war-torn country. Failing which, Walter is quite satisfied with being able to wake up on time for his lessons (which start at the eminently reasonable time of 12pm had Walter been living in Honolulu instead).
 +
</p>
 +
        <h2>INTERESTING FACT ABOUT HIM</h2>
 +
        <p style="font-family: 'lora';">He is a rather cunning linguist, having attained a respectable degree of fluency in English, Chinese, Cantonese, French, Spanish, and sarcasm.
 +
</p>
 +
      </div>
 +
    </div>
 +
    <div class="the-middle" id="aaronl"></div>
 +
  </div>
  
−
  itemWidth = 100 / carouselLength;
 
  
−
  firstItem = $(carouselContent.children()[0]);
 
  
−
  lastItem = $(carouselContent.children()[carouselLength - 1]);
 
  
−
   firstClone = null;
+
   <div class="profile-content">
 +
    <div class="profile">
 +
      <div class="profile-picture">
 +
        <span class="portrait1 portrait_aaronl"></span>
 +
      </div>
 +
      <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>LEOW CHUNG YONG AARON</h1>
 +
          <p>Biomedical Engineering</p>
 +
        </div>
 +
        <h2>ROLE</h2>
 +
        <p style="font-family: 'lora';">
  
−
  lastClone = null;
+
        Treasurer, Head of Marketing, Head of Human Practices, Member of Science Team and Wet Lab Team
  
−
  // Apply the 3D transformations to avoid a white blink when you slide for the first time
+
        </p>
−
  carouselContent.css("width", carouselLength * 100 + "%");
+
        <h2>AMBITION</h2>
 +
        <p style="font-family: 'lora';">He wants to be an academic researcher and a technopreneur. He loves all sorts of animals and admires Taylor Nicole Dean and her pets. Perhaps that is why he desires his very own pogo stick, so he can bounce and frolic alongside his furry friends like the loveliest, prettiest Disney princess there ever was.
 +
</p>
 +
        <h2>INTERESTING FACT ABOUT HIM</h2>
 +
        <p style="font-family: 'lora';">He owns many pairs of broken shoes (including trainers), worn out in his never-ending quest to be a Pokémon trainer.)
 +
</p>
 +
      </div>
 +
    </div>
 +
    <div class="the-middle" id="russell"></div>
 +
  </div>
  
−
  carouselContent.transition({
 
−
    x: `${carouselIndex * -itemWidth}%`
 
−
  }, 0);
 
  
−
  $.each(carouselContent.children(), function() {
 
−
    return $(this).css("width", itemWidth + "%");
 
−
  });
 
  
−
    
+
   <div class="profile-content">
−
  // Click on the "Previous" button
+
    <div class="profile">
−
  $(".nav--left").on("click", function() {
+
       <div class="profile-picture">
−
    if (isAnimating) {
+
        <span class="portrait1 portrait_russell"></span>
−
       return;
+
       </div>
−
    }
+
       <div class="profile-description">
−
    isAnimating = true;
+
         <div class="namecard">
−
    carouselIndex--;
+
          <h1>RUSSELL NGO</h1>
−
    if (carouselIndex === -1) {
+
          <p>Chemical Engineering</p>
−
       lastItem.prependTo(carouselContent);
+
         </div>
−
       carouselContent.transition({
+
         <h2>ROLE</h2>
−
        x: `${(carouselIndex + 2) * -itemWidth}%`
+
         <p style="font-family: 'lora';">
−
      }, 0);
+
−
      return carouselContent.transition({
+
−
         x: `${(carouselIndex + 1) * -itemWidth}%`
+
−
      }, 1000, "easeInOutExpo", function() {
+
−
        carouselIndex = carouselLength - 1;
+
−
        lastItem.appendTo(carouselContent);
+
−
         carouselContent.transition({
+
−
          x: `${carouselIndex * -itemWidth}%`
+
−
         }, 0);
+
−
         return isAnimating = false;
+
−
      });
+
−
    } else {
+
−
      return carouselContent.transition({
+
−
        x: `${carouselIndex * -itemWidth}%`
+
−
      }, 1000, "easeInOutExpo", function() {
+
−
        return isAnimating = false;
+
−
      });
+
−
    }
+
−
  });
+
  
−
  // Click on the "Next" button
+
         Member of Modelling Team, Science Team, and Wiki Team
−
  $(".nav--right").on("click", function() {
+
−
    if (isAnimating) {
+
−
      return;
+
−
    }
+
−
    isAnimating = true;
+
−
    carouselIndex++;
+
−
    return carouselContent.transition({
+
−
      x: `${carouselIndex * -itemWidth}%`
+
−
    }, 1000, "easeInOutExpo", function() {
+
−
      isAnimating = false;
+
−
      if (firstClone) {
+
−
         carouselIndex = 0;
+
−
        carouselContent.transition({
+
−
          x: `${carouselIndex * -itemWidth}%`
+
−
        }, 0);
+
−
        firstClone.remove();
+
−
        firstClone = null;
+
−
        carouselLength = carouselContent.children().length;
+
−
        itemWidth = 100 / carouselLength;
+
−
        carouselContent.css("width", carouselLength * 100 + "%");
+
−
        $.each(carouselContent.children(), function() {
+
−
          return $(this).css("width", itemWidth + "%");
+
−
        });
+
−
        return;
+
−
      }
+
−
      if (carouselIndex === carouselLength - 1) {
+
−
        carouselLength++;
+
−
        itemWidth = 100 / carouselLength;
+
−
        firstClone = firstItem.clone();
+
−
        firstClone.addClass("clone");
+
−
        firstClone.appendTo(carouselContent);
+
−
        carouselContent.css("width", carouselLength * 100 + "%");
+
−
        $.each(carouselContent.children(), function() {
+
−
          return $(this).css("width", itemWidth + "%");
+
−
        });
+
−
        return carouselContent.transition({
+
−
          x: `${carouselIndex * -itemWidth}%`
+
−
        }, 0);
+
−
      }
+
−
    });
+
−
  });
+
  
−
}).call(this);
+
        </p>
−
</script>
+
        <h2>AMBITION</h2>
 +
        <p style="font-family: 'lora';"> Russell strongly believes in change, and thinks that synthetic biology is one of the keys to change, which is why he’s taking part in iGEM.
  
 +
</p>
 +
        <h2>INTERESTING FACT ABOUT HIM</h2>
 +
        <p style="font-family: 'lora';">He tried to join the previous year’s iGEM team, but was unsuccessful due to unfortunate circumstances beyond his control. However, this year he’s finally here, and raring to go! If anything else, it speaks to his tremendous passion for synthetic biology and demonstrates his sheer tenacity. Russell also enjoys taking naps at lunchtime, and feels very much at home in IKEA, especially during lunchtime. His favourite pop artiste is Norlie & KKV.
 +
</p>
 +
      </div>
 +
    </div>
 +
    <div class="the-middle" id="hyhy"></div>
 +
  </div>
  
  
  
  
−
<div class="column two_thirds_size" >
+
  <div class="profile-content">
 +
    <div class="profile">
 +
      <div class="profile-picture">
 +
        <span class="portrait1 portrait_hyhy"></span>
 +
      </div>
 +
      <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>YANG HAO YUAN</h1>
 +
          <p>Life Sciences</p>
 +
        </div>
 +
        <h2>ROLE</h2>
 +
        <p style="font-family: 'lora';">
  
−
<h1>Team</h1>
+
        Head of Science, Member of Wet Lab Team, Modelling Team, and Human Practices Team
−
<p>In this page you can introduce your team members, instructors, and advisors. </p>
+
  
 +
        </p>
 +
        <h2>AMBITION</h2>
 +
        <p style="font-family: 'lora';"> Hao Yuan aspires to do something good using (surprise, surprise) synthetic biology. Other less lofty life goals include re-learning how to play the piano, watching his beloved football team in the flesh, and learning Japanese so he can finally watch anime without subtitles.
  
−
<h3>What should this page contain?</h3>
+
</p>
−
<ul>
+
        <h2>INTERESTING FACT ABOUT HIM</h2>
−
<li> Include pictures of your teammates, don’t forget instructors and advisors! </li>
+
        <p style="font-family: 'lora';">Besides being a science buff, he’s also physically buff! He plays tennis using tables rather than rackets. (Editor’s Note: The editorial gerbils report that something may have been lost in transcription. The editor thus warns that the accuracy of Hao Yuan’s interesting fact may have been compromised, an understandable result of salvaging the remains of Hao Yuan’s files from gerbil excrement.)
−
<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>
+
</p>
−
<li>Take team pictures! Show us your school, your lab and little bit of your city.</li>
+
      </div>
−
<li>Remember that image galleries can help you showcase many pictures while saving space.</li>
+
    </div>
−
</ul>
+
    <div class="the-middle" id="ryan"></div>
−
</div>
+
  </div>
  
  
  
−
<div class="column third_size" >
+
 
−
<div class="highlight decoration_A_full">
+
  <div class="profile-content">
−
<h3>Inspiration</h3>
+
    <div class="profile">
−
<p>You can look at what other teams did to get some inspiration! <br />
+
      <div class="profile-picture">
−
Here are a few examples:</p>
+
        <span class="portrait1 portrait_ryan"></span>
−
<ul>
+
      </div>
−
<li><a href="https://2014.igem.org/Team:METU_Turkey_team">2014 METU Turkey </a></li>
+
      <div class="profile-description">
−
<li><a href="https://2014.igem.org/Team:Colombia/Members">2014 Colombia</a></li>
+
        <div class="namecard">
−
<li><a href="https://2014.igem.org/Team:Stony_Brook/Team">2014 Stony Brook</a></li>
+
          <h1>RYAN LEONG WEI REN</h1>
−
<li><a href="https://2014.igem.org/Team:OUC-China/Team">2014 OUC-China</a></li>
+
          <p>Architecture</p>
−
</ul>
+
        </div>
 +
        <h2>ROLE</h2>
 +
        <p style="font-family: 'lora';">
 +
 
 +
        Designer-in-Residence
 +
 
 +
        </p>
 +
        <h2>AMBITION</h2>
 +
        <p style="font-family: 'lora';"> Ryan is a “design-author” who enjoys conceptualising creative products using graphic illustrations, craftwork, and creative storytelling across many topics, from architecture to fashion. He hopes to transform experiences, add value wherever he goes, and inspire purpose in others throughout his artful adventures.
 +
</p>
 +
        <h2>INTERESTING FACT ABOUT HIM</h2>
 +
        <p style="font-family: 'lora';">He’s always stuck with Laurel in Blue, and is still hoping for Yanny in Gold.
 +
</p>
 +
      </div>
 +
    </div>
 +
    <div class="the-middle" id="beatrix"></div>
 +
  </div>
 +
 
 +
 
 +
 
 +
 
 +
  <div class="profile-content">
 +
    <div class="profile">
 +
      <div class="profile-picture">
 +
        <span class="portrait1 portrait_beatrix"></span>
 +
      </div>
 +
      <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>BEATRIX TUNG XUE LIN</h1>
 +
          <p>Mechanical Engineering</p>
 +
        </div>
 +
        <h2>ROLE</h2>
 +
        <p style="font-family: 'lora';">
 +
 
 +
        Chief Editor of the Wiki, Member of Modelling Team, Human Practices Team, Hardware Team, and Safety Team
 +
 
 +
        </p>
 +
        <h2>AMBITION</h2>
 +
        <p style="font-family: 'lora';"> Beatrix wishes to infiltrate the human race, following in the footsteps of her illustrious predecessors Ford Prefect and J’onn J’onnz. She is currently working on appearing perfectly normal in public, and absorbing as much human knowledge as is alienly possible. Participating in iGEM to learn more about synthetic biology is all part of her plan for world domination.
 +
</p>
 +
        <h2>INTERESTING FACT ABOUT HER</h2>
 +
        <p style="font-family: 'lora';">With the help of some good old-fashioned British sci-fi technology, she owns a hammerhead shark named Clarence whose former self currently exists alongside its present self, thus contravening the First Law of Time.
 +
 
 +
</p>
 +
      </div>
 +
    </div>
 +
    <div class="the-middle" id="me"></div>
 +
  </div>
 +
 
 +
 
 +
  <div class="profile-content">
 +
    <div class="profile">
 +
      <div class="profile-picture">
 +
        <span class="portrait1 portrait_me"></span>
 +
      </div>
 +
      <div class="profile-description">
 +
        <div class="namecard">
 +
          <h1>AARON RAMZEEN</h1>
 +
          <p>Biomedical Engineering</p>
 +
        </div>
 +
        <h2>ROLE</h2>
 +
        <p style="font-family: 'lora';">
 +
 
 +
        Member of Wiki Team, Modelling Team, Human Practices Team, and Hardware Team
 +
 
 +
        </p>
 +
        <h2 >AMBITION</h2>
 +
        <p style="font-family: 'lora';">  Aaron dreams of growing up to be a porcelain Bugatti Veyron ready to experience the quantum headspace of the vast unknown. In addition, he wants to stop being mistaken for the other Aaron.
 +
</p>
 +
        <h2>INTERESTING FACT ABOUT HIM</h2>
 +
        <p style="font-family: 'lora';">His iGEM account name is evilsexycurry. Apparently, there is a lengthy tale rivalling The Blah Story regarding how he chose these three words to describe himself. He has yet to delight us with this fascinating chapter from his personal history, and remains an evil and sexy curry of mystery.
 +
</p>
 +
      </div>
 +
    </div>
 +
  </div>
 
</div>
 
</div>
 
</div>
 
</div>
 +
</div>
 +
 +
 +
 +
 +
<script>
 +
// Get the modal
 +
var JcProfile = document.getElementById('jiacheng_profile');
 +
var NaProfile = document.getElementById('nanda_profile');
 +
var TtProfile = document.getElementById('ting2_profile');
 +
var MaProfile = document.getElementById('marcus_profile');
 +
var TvProfile = document.getElementById('rita_profile');
 +
var WaProfile = document.getElementById('walter_profile');
 +
var BeProfile = document.getElementById('beatrix_profile');
 +
var HyProfile = document.getElementById('hyhy_profile');
 +
var RuProfile = document.getElementById('russell_profile');
 +
var AaProfile = document.getElementById('aaronl_profile');
 +
var RyProfile = document.getElementById('ryan_profile');
 +
var MeProfile = document.getElementById('me_profile');
 +
var LyProfile = document.getElementById('liyana_profile');
 +
 +
// Get the hyperlink that opens the modal
 +
var JcLink = document.getElementById("jiacheng_a");
 +
var NaLink = document.getElementById('nanda_a');
 +
var TtLink = document.getElementById('ting2_a');
 +
var MaLink = document.getElementById('marcus_a');
 +
var TvLink = document.getElementById('rita_a');
 +
var WaLink = document.getElementById('walter_a');
 +
var BeLink = document.getElementById('beatrix_a');
 +
var HyLink = document.getElementById('hyhy_a');
 +
var RuLink = document.getElementById('russell_a');
 +
var AaLink = document.getElementById('aaronl_a');
 +
var RyLink = document.getElementById('ryan_a');
 +
var MeLink = document.getElementById('me_a');
 +
var LyLink = document.getElementById("liyana_a");
 +
 +
// Get the <span> element that closes the modal
 +
var span = document.getElementsByClassName("close");
 +
 +
 +
 +
// When the user clicks on the button, open the modal
 +
JcLink.onclick = function() {
 +
    JcProfile.style.display = "block";
 +
}
 +
LyLink.onclick = function() {
 +
    LyProfile.style.display = "block";
 +
}
 +
NaLink.onclick = function() {
 +
    NaProfile.style.display = "block";
 +
}
 +
TtLink.onclick = function() {
 +
    TtProfile.style.display = "block";
 +
}
 +
MaLink.onclick = function() {
 +
    MaProfile.style.display = "block";
 +
}
 +
TvLink.onclick = function() {
 +
    TvProfile.style.display = "block";
 +
}
 +
WaLink.onclick = function() {
 +
    WaProfile.style.display = "block";
 +
}
 +
AaLink.onclick = function() {
 +
    AaProfile.style.display = "block";
 +
}
 +
RuLink.onclick = function() {
 +
    RuProfile.style.display = "block";
 +
}
 +
HyLink.onclick = function() {
 +
    HyProfile.style.display = "block";
 +
}
 +
RyLink.onclick = function() {
 +
    RyProfile.style.display = "block";
 +
}
 +
BeLink.onclick = function() {
 +
    BeProfile.style.display = "block";
 +
}
 +
MeLink.onclick = function() {
 +
    MeProfile.style.display = "block";
 +
}
 +
 +
 +
// When the user clicks on <span> (x), close the modal
 +
span[0].onclick = function() {
 +
    JcProfile.style.display = "none";
 +
}
 +
span[1].onclick = function() {
 +
    NaProfile.style.display = "none";
 +
}
 +
span[2].onclick = function() {
 +
    TtProfile.style.display = "none";
 +
}
 +
span[3].onclick = function() {
 +
    MaProfile.style.display = "none";
 +
}
 +
span[4].onclick = function() {
 +
    TvProfile.style.display = "none";
 +
}
 +
span[5].onclick = function() {
 +
    WaProfile.style.display = "none";
 +
}
 +
span[6].onclick = function() {
 +
    LyProfile.style.display = "none";
 +
}
 +
span[7].onclick = function() {
 +
    AaProfile.style.display = "none";
 +
}
 +
span[8].onclick = function() {
 +
    RuProfile.style.display = "none";
 +
}
 +
span[9].onclick = function() {
 +
    HyProfile.style.display = "none";
 +
}
 +
span[10].onclick = function() {
 +
    RyProfile.style.display = "none";
 +
}
 +
span[11].onclick = function() {
 +
    BeProfile.style.display = "none";
 +
}
 +
span[12].onclick = function() {
 +
    MeProfile.style.display = "none";
 +
}
 +
 +
 +
 +
 +
// When the user clicks anywhere outside of the modal, close it
 +
window.onclick = function(event) {
 +
    if (event.target == modal) {
 +
        JcProfile.style.display = "none";
 +
        LyProfile.style.display = "none";
 +
    }
 +
}
 +
</script>
  
 
</html>
 
</html>
 +
{{:Team:NUS_Singapore-A/Templates/Footer}}

Revision as of 17:23, 15 October 2018

CONNECT WITH US

NANDA WANG NUO'EN

Biomedical Engineering

ROLE

Team Leader, Head of Wet Lab, Member of Science Team, Marketing Team, Safety Team, and Human Practices Team

AMBITION

Nanda hopes to make the world a better place in any way she can, which includes helping anyone in need of her love and support. She’s one ambitious lady; she hopes to pick up as many skills as possible and be a Jack of all trades and Master of some. She envisions her future self as someone who would not only make significant contributions to the society, but also empower others, especially the underprivileged, to pursue their dreams. Aside from these, she has also been secretly wishing to have a celestial star named after her in future.

INTERESTING FACT ABOUT HER

Usually people can't tell which country is she from because of her rather unique name - it's not very Singaporean but she's born and bred in Singapore! Perhaps because of her multilingual name, she is skilled at doing English-Chinese translation, and would probably make a career of it if she can’t find employment related to her main degree.

NUR LIYANA BINTE AYUB OW YONG

Life Sciences

ROLE

Team Leader, Head of Creative, Member of Science Team and Wet Lab Team

AMBITION

Liyana’s ultimate goal is to dedicate her life to humanitarian work, and be a powerful voice for women and children who have none. She also strives to help others recognize their own worth. As a side project, she’s working on inventing teleportation.

INTERESTING FACT ABOUT HER

She loves it when people teach her things they’re passionate about. Languages, carpentry, sewing, bring it on! (Especially quantum mechanics someone please teach her please please please she really needs it for her teleportation thing...)

WU JIACHENG

Engineering Science

ROLE

Head of Wiki, Head of Hardware

AMBITION

Jiacheng’s dream is uncomplicated. He just wants to travel around the world.

INTERESTING FACT ABOUT HIM

He loves philosophy. Thankfully, the kind of philosophy he’s inclined towards is not Sartre’s “Hell is other people” or Schopenhauer’s relentless pessimism, but more Lao Tzu’s “Simplicity, patience, compassion.” (Editor’s note: It is with deepest regret that I announce the premature demise of the editorial gerbils, Pinky and The Brian. Hegel’s Phenomenology of Spirit was too much to handle. This intellectual deficiency will be rectified in the next generation of editorial gerbils.)

ZHU TINGTING

Life Sciences

ROLE

Member of Science Team, Wet Lab Team, Safety Team, and Creative Team

AMBITION

Ting Ting has a passion for fashion, and hopes to combine this with what she’s learning as a life sciences student.

INTERESTING FACT ABOUT HER

For some incredibly odd reason, pigs stop when they meet Ting Ting. One day she may accidentally cause a traffic jam, either because all those pigs are blocking the way, or because she’s the chicest chica around.

MARCUS CHAN

Biomedical Engineering

ROLE

Head of Modelling, Member of Creative Team and Hardware Team

AMBITION

When Marcus was a wee lad, he wanted to become a reality television star so he constantly practiced throwing drinks on everyone bar complete strangers. This dream was cruelly dashed so he’s studying biomedical engineering instead, in the hopes of becoming rich enough to own a lawn. He covets this hallowed, immaculate patch of greenery solely for the pleasure of being able to yell at young humans to GET OFF HIS LAWN.

INTERESTING FACT ABOUT HIM

He loves feeling moisturized. Please send him many free samples of moisturizer.

RITA

TVARITA SHIVAKUMAR IYER

Material Science Engineering

ROLE

Head of Outreach, Member of Human Practices Team, Wet Lab Team, Hardware Team, and Creative Team

AMBITION

Tvarita is a connoisseur of ice lemon tea. She plans on starting a blog introducing plebeians such as ourselves to the finest ice lemon teas known to mankind.

INTERESTING FACT ABOUT HER

Tvarita’s a vegetarian!

LAM SZE TUNG WALTER

Medicine

ROLE

Deputy Treasurer, Head of Human Practices, Editor of the Wiki, Member of Marketing Team

AMBITION

Walter dreams of being the world's deadliest spy or becoming part of a secret intelligence organisation. He is also interested in having a dish named after him, getting crowned champion of an IKEA hotdog speed-eating contest, or defusing a bomb whilst performing open heart surgery in a war-torn country. Failing which, Walter is quite satisfied with being able to wake up on time for his lessons (which start at the eminently reasonable time of 12pm had Walter been living in Honolulu instead).

INTERESTING FACT ABOUT HIM

He is a rather cunning linguist, having attained a respectable degree of fluency in English, Chinese, Cantonese, French, Spanish, and sarcasm.

LEOW CHUNG YONG AARON

Biomedical Engineering

ROLE

Treasurer, Head of Marketing, Head of Human Practices, Member of Science Team and Wet Lab Team

AMBITION

He wants to be an academic researcher and a technopreneur. He loves all sorts of animals and admires Taylor Nicole Dean and her pets. Perhaps that is why he desires his very own pogo stick, so he can bounce and frolic alongside his furry friends like the loveliest, prettiest Disney princess there ever was.

INTERESTING FACT ABOUT HIM

He owns many pairs of broken shoes (including trainers), worn out in his never-ending quest to be a Pokémon trainer.)

RUSSELL NGO

Chemical Engineering

ROLE

Member of Modelling Team, Science Team, and Wiki Team

AMBITION

Russell strongly believes in change, and thinks that synthetic biology is one of the keys to change, which is why he’s taking part in iGEM.

INTERESTING FACT ABOUT HIM

He tried to join the previous year’s iGEM team, but was unsuccessful due to unfortunate circumstances beyond his control. However, this year he’s finally here, and raring to go! If anything else, it speaks to his tremendous passion for synthetic biology and demonstrates his sheer tenacity. Russell also enjoys taking naps at lunchtime, and feels very much at home in IKEA, especially during lunchtime. His favourite pop artiste is Norlie & KKV.

YANG HAO YUAN

Life Sciences

ROLE

Head of Science, Member of Wet Lab Team, Modelling Team, and Human Practices Team

AMBITION

Hao Yuan aspires to do something good using (surprise, surprise) synthetic biology. Other less lofty life goals include re-learning how to play the piano, watching his beloved football team in the flesh, and learning Japanese so he can finally watch anime without subtitles.

INTERESTING FACT ABOUT HIM

Besides being a science buff, he’s also physically buff! He plays tennis using tables rather than rackets. (Editor’s Note: The editorial gerbils report that something may have been lost in transcription. The editor thus warns that the accuracy of Hao Yuan’s interesting fact may have been compromised, an understandable result of salvaging the remains of Hao Yuan’s files from gerbil excrement.)

RYAN LEONG WEI REN

Architecture

ROLE

Designer-in-Residence

AMBITION

Ryan is a “design-author” who enjoys conceptualising creative products using graphic illustrations, craftwork, and creative storytelling across many topics, from architecture to fashion. He hopes to transform experiences, add value wherever he goes, and inspire purpose in others throughout his artful adventures.

INTERESTING FACT ABOUT HIM

He’s always stuck with Laurel in Blue, and is still hoping for Yanny in Gold.

BEATRIX TUNG XUE LIN

Mechanical Engineering

ROLE

Chief Editor of the Wiki, Member of Modelling Team, Human Practices Team, Hardware Team, and Safety Team

AMBITION

Beatrix wishes to infiltrate the human race, following in the footsteps of her illustrious predecessors Ford Prefect and J’onn J’onnz. She is currently working on appearing perfectly normal in public, and absorbing as much human knowledge as is alienly possible. Participating in iGEM to learn more about synthetic biology is all part of her plan for world domination.

INTERESTING FACT ABOUT HER

With the help of some good old-fashioned British sci-fi technology, she owns a hammerhead shark named Clarence whose former self currently exists alongside its present self, thus contravening the First Law of Time.

AARON RAMZEEN

Biomedical Engineering

ROLE

Member of Wiki Team, Modelling Team, Human Practices Team, and Hardware Team

AMBITION

Aaron dreams of growing up to be a porcelain Bugatti Veyron ready to experience the quantum headspace of the vast unknown. In addition, he wants to stop being mistaken for the other Aaron.

INTERESTING FACT ABOUT HIM

His iGEM account name is evilsexycurry. Apparently, there is a lengthy tale rivalling The Blah Story regarding how he chose these three words to describe himself. He has yet to delight us with this fascinating chapter from his personal history, and remains an evil and sexy curry of mystery.



HEAR OUR STORY

We’re using synthetic biology to change the way the world thinks and functions.

We’re a little disruptive, dangerous and maybe a tad too bold. But the world needs some shaking up every now and then, and we think we’re just the right people for that.

Together we’re going to engineer biology and create something awesome.

CONTACT US

nusigem@gmail.com

21 Lower Kent Ridge Rd, Singapore 119077