Difference between revisions of "Team:Hong Kong-CUHK/Team"

Line 112: Line 112:
 
             }
 
             }
  
−
.popup {
+
.right {
−
     position: relative;
+
     float: right;
−
     display: inline-block;
+
     width: 300px;
−
     cursor: pointer;
+
     padding: 10px;
−
    -webkit-user-select: none;
+
−
    -moz-user-select: none;
+
−
    -ms-user-select: none;
+
−
    user-select: none;
+
 
}
 
}
  
−
/* The actual popup */
+
.left {
−
.popup .popuptext {
+
     float: left;
−
     visibility: hidden;
+
     width: 300px;
−
     width: 160px;
+
     padding: 10px;
−
    background-color: #555;
+
−
    color: #fff;
+
−
    text-align: center;
+
−
    border-radius: 6px;
+
−
     padding: 8px 0;
+
−
    position: absolute;
+
−
    z-index: 1;
+
−
    bottom: 125%;
+
−
    left: 50%;
+
−
    margin-left: -80px;
+
 
}
 
}
  
−
/* Popup arrow */
+
 
−
.popup .popuptext::after {
+
.round {
−
    content: "";
+
                border-radius: 50%;
−
    position: absolute;
+
                overflow: hidden;
−
    top: 100%;
+
                width: 400px;
−
    left: 50%;
+
                height: 400px;
−
    margin-left: -5px;
+
            }
−
    border-width: 5px;
+
            .round img {
−
    border-style: solid;
+
                display: block;
−
    border-color: #555 transparent transparent transparent;
+
            /* Stretch
 +
                  height: 100%;
 +
                  width: 100%; */
 +
            min-width: 100%;
 +
            min-height: 100%;
 +
            }
 +
 
 +
.rightcontainer {
 +
  clear: both;
 +
  position: relative;
 +
}
 +
 
 +
.rightcontainer .rightarrow {
 +
  width: 12px;
 +
  height: 20px;
 +
  overflow: hidden;
 +
  position: relative;
 +
  float: left;
 +
  top: 6px;
 +
  right: -1px;
 +
}
 +
 
 +
.rightcontainer .rightarrow .rightouter {
 +
  width: 0;
 +
  height: 0;
 +
  border-right: 20px solid #000000;
 +
  border-top: 10px solid transparent;
 +
  border-bottom: 10px solid transparent;
 +
  position: absolute;
 +
  top: 0;
 +
  left: 0;
 +
}
 +
 
 +
.rightcontainer .rightarrow .rightinner {
 +
  width: 0;
 +
  height: 0;
 +
  border-right: 20px solid #ffffff;
 +
  border-top: 10px solid transparent;
 +
  border-bottom: 10px solid transparent;
 +
  position: absolute;
 +
  top: 0;
 +
  left: 2px;
 +
}
 +
 
 +
.rightcontainer .rightmessage-body {
 +
  float: left;
 +
  width: 300px;
 +
  height: auto;
 +
  border: 1px solid #CCC;
 +
  background-color: #ffffff;
 +
  border: 1px solid #000000;
 +
  padding: 6px 8px;
 +
  -webkit-border-radius: 5px;
 +
  -moz-border-radius: 5px;
 +
  -o-border-radius: 5px;
 +
  border-radius: 5px;
 +
}
 +
 
 +
 
 +
.leftcontainer {
 +
  clear: both;
 +
  position: relative;
 +
}
 +
 
 +
.leftcontainer .leftarrow {
 +
  width: 12px;
 +
  height: 20px;
 +
  overflow: hidden;
 +
  position: relative;
 +
  float: right;
 +
  top: 6px;
 +
  right: 3px;
 
}
 
}
  
−
/* Toggle this class - hide and show the popup */
+
.leftcontainer .leftarrow .leftouter {
−
.popup .show {
+
  width: 0;
−
    visibility: visible;
+
  height: 0;
−
    -webkit-animation: fadeIn 1s;
+
  border-left: 20px solid #000000;
−
    animation: fadeIn 1s;
+
  border-top: 10px solid transparent;
 +
  border-bottom: 10px solid transparent;
 +
  position: absolute;
 +
  top: 0;
 +
  left: 0;
 
}
 
}
  
−
/* Add animation (fade in the popup) */
+
.leftcontainer .leftarrow .leftinner {
−
@-webkit-keyframes fadeIn {
+
  width: 0;
−
    from {opacity: 0;}
+
  height: 0;
−
    to {opacity: 1;}
+
  border-left: 20px solid #ffffff;
 +
  border-top: 10px solid transparent;
 +
  border-bottom: 10px solid transparent;
 +
  position: absolute;
 +
  top: 0;
 +
  left: -2px;
 
}
 
}
  
−
@keyframes fadeIn {
+
.leftcontainer .leftmessage-body {
−
    from {opacity: 0;}
+
  float: right;
−
    to {opacity:1 ;}
+
  width: 300px;
 +
  height: auto;
 +
  border: 1px solid #CCC;
 +
  background-color: #ffffff;
 +
  border: 1px solid #000000;
 +
  padding: 6px 8px;
 +
  -webkit-border-radius: 5px;
 +
  -moz-border-radius: 5px;
 +
  -o-border-radius: 5px;
 +
  border-radius: 5px;
 
}
 
}
  
Line 249: Line 324:
 
<br>
 
<br>
  
−
 
+
<div class="left">
−
<div class="right">
+
<div class="leftcontainer">
−
<div class="popup" onclick="myFunction()">
+
   <div class="leftarrow">
−
   <div class="round">
+
    <div class="leftouter"></div>
−
            <img src="https://static.igem.org/mediawiki/2017/2/26/Andrew.PNG" alt=""/>
+
    <div class="leftinner"></div>
−
</div>
+
  </div>
−
<span class="popuptext" id="myPopup">Hello World</span>
+
  <div class="leftmessage-body">
−
</div>
+
    <p align="justify">  
−
</div>
+
−
 
+
−
 
+
−
<script>
+
−
// When the user clicks on div, open the popup
+
−
function myFunction() {
+
−
    var popup = document.getElementById("myPopup");
+
−
    popup.classList.toggle("show");
+
−
}
+
−
</script>
+
−
 
+
−
 
+
−
 
+
−
 
+
−
<div class="flip-container" ontouchstart="this.classList.toggle('hover');">
+
−
<div class="flipper">
+
−
<div class="back"><p align="justify">  
+
 
<br>
 
<br>
 
<font color="#8A0808" size="5" ><b>Name: Ching Yuet To</b></font>
 
<font color="#8A0808" size="5" ><b>Name: Ching Yuet To</b></font>
Line 297: Line 355:
 
I am looking most forward to meet all the interesting people in Jamboree! I believe that I can learn a lot and make many international friends in Boston!</font>
 
I am looking most forward to meet all the interesting people in Jamboree! I believe that I can learn a lot and make many international friends in Boston!</font>
 
</p>
 
</p>
 +
 +
  </div>
 +
</div>
 +
 +
</div>
 +
 +
 +
 +
 +
 +
<div class="right">
 +
 +
  <div class="round">
 +
            <img src="https://static.igem.org/mediawiki/2017/2/26/Andrew.PNG" alt=""/>
 +
</div>
 +
</div>
 +
 +
 +
<script>
 +
// When the user clicks on div, open the popup
 +
function myFunction() {
 +
    var popup = document.getElementById("myPopup");
 +
    popup.classList.toggle("show");
 +
}
 +
</script>
 +
 +
 +
 +
 +
<div class="flip-container" ontouchstart="this.classList.toggle('hover');">
 +
<div class="flipper">
 +
<div class="back">
 
</div>
 
</div>
 
</div>
 
</div>

Revision as of 17:28, 24 July 2017

    • Home
    Description Experiments Results Parts Hardware
    Modelling Software InterLab
    Notebook Protocols Medal Criteria
    Engagement and Education Human Practices Collaboration
    Safety
    Team Attributions



    Meet the team


    Name: Ching Yuet To

    Nickname:Andrew

    Major/Year: Cell and Molecular Biology/3

    Hobby: Hiking, Watching movie

    Why did you join iGEM:
    I joined CUHK iGEM team this year because I believe that it would be fun that we can carry out research study independently. I think it is meaningful to participate and promote synthetic biology research.

    What are you looking most forward to in Boston:
    I am looking most forward to meet all the interesting people in Jamboree! I believe that I can learn a lot and make many international friends in Boston!




    [[File:Venus.PNG|400px|left]]


    Name: Venus Lin

    Nickname:Venus

    Major/Year: Cell and Molecular Biology/3

    Hobby: Reading books

    Favourite Food: Bread

    Why did you join iGEM:
    I joined IGEM because doing lab is fun.

    What are you looking most forward to in Boston:
    I am looking forward to meet people in Boston.






    [[File:Cathy.PNG|420px|left]]


    Name: Cathy Wong

    Nickname:Cathy

    Major/Year: Cell and Molecular Biology/3

    Hobby: Swimming

    Favourite Food: Ice-cream, tea

    Why did you join iGEM:
    Learn more differently. For example, in igem, we initiate, propose, handle the project by ourselves, which is different in what we have learned in the teaching laboratory, which is a good challenge.

    What are you looking most forward to in Boston:
    Apart from the jamboree, the attraction visiting and food tasting are the must of course !!!.






    [[File:Angela.PNG|400px|left]]


    Name: Ruo Ning Wang

    Nickname:Angela

    Major/Year: Cell and Molecular Biology/3

    Hobby: Film

    Favourite Food: Fish

    Why did you join iGEM:
    iGEM offers me an opportunity to explore new knowledge and techniques. Here we meet friends from different disciplines and have freedom to do various kinds if experiments. I learnt a lot through iGEM.

    What are you looking most forward to in Boston:
    Have communication with students all over the world and exchange each other's idea !!!.






    [[File:Jade.PNG|400px|left]]


    Name: Chui Shan Tsang

    Nickname:Jade

    Major/Year: Biology/3

    Hobby: Make handcraft

    Favourite Food: McDonald's chicken wings

    What are you looking most forward to in Boston:
    Meet more passionate science people and share our joy in research .






    [[File:Sammi.PNG|400px|left]]


    Name: Lo Sum Yi Sammi

    Nickname:Sammi

    Major/Year: Cell and Molecular Biology/3

    Hobby: Eating, Playing Guitar, Watching movies

    Favourite Food: Steak

    Why did you join iGEM:
    To work together with my friends on our own project.

    What are you looking most forward to in Boston:
    Trying nice food and meet new friends.






    [[File:Cynthia.PNG|400px|left]]


    Name: Cynthia Lam

    Nickname:Cyn

    Major/Year: Biochemistry/2

    Hobby: Dancing, Vlogging about food and finding good restaurants

    Favourite Food: Just any seafood

    Why did you join iGEM:
    I thought it would be fun.

    What are you looking most forward to in Boston:
    Meeting everyone! And of course the food.

    Inspiration

    You can look at what other teams did to get some inspiration!
    Here are a few examples:

    https://2014.igem.org/Team:METU_Turkey_team">METU Turkey

    https://2014.igem.org/Team:Colombia/Members">Colombia

    https://2014.igem.org/Team:Stony_Brook/Team">Stony Brook

    https://2014.igem.org/Team:OUC-China/Team">OUC-China