Difference between revisions of "Team:NCTU Formosa/Collaborations"

(Prototype team page)
 
Line 1: Line 1:
{{NCTU_Formosa}}
+
{{NCTU_Formosa/test}}
 +
 
 
<html>
 
<html>
 +
<head>
 +
  <meta charset="UTF-8">
 +
  <title>Education</title>
  
 +
  <style>
  
 +
  #globalWrapper{
 +
    padding-top: 0 !important;
 +
    padding-bottom: 0 !important;
 +
    margin: 0 !important;
 +
  }
  
<div class="column full_size judges-will-not-evaluate">
 
<h3>★  ALERT! </h3>
 
<p>This page is used by the judges to evaluate your team for the <a href="https://2018.igem.org/Judging/Medals">medal criterion</a> or <a href="https://2018.igem.org/Judging/Awards"> award listed below</a>. </p>
 
<p> Delete this box in order to be evaluated for this medal criterion and/or award. See more information at <a href="https://2018.igem.org/Judging/Pages_for_Awards"> Instructions for Pages for awards</a>.</p>
 
</div>
 
  
 +
body {
 +
  font-size: 0;
 +
  margin: 0 !important;
 +
  padding: 0;
 +
}
  
<div class="clear"></div>
+
.wrapper {
 +
background-color: #fff;
 +
padding: 0;
 +
font-size: 0;
 +
font-family: Levenim MT;
 +
padding-bottom: 150px;
 +
}
  
 +
.cover{
 +
position: relative;
 +
}
  
<div class="column full_size">
+
.picture {
<h1>Collaborations</h1>
+
width: 100%;
 +
height: auto;
 +
padding: 0;
 +
margin-bottom: 100px;
 +
}
  
<p>
+
.dot1,.dot2,.dot3,.dot4 {
Sharing and collaboration are core values of iGEM. We encourage you to reach out and work with other teams on difficult problems that you can more easily solve together.
+
position: absolute;
</p>
+
}
  
<h3>Silver Medal Criterion #2</h3>
+
.dot1 {
<p>
+
width: 4%;
Complete this page if you intend to compete for the silver medal criterion #2 on collaboration. Please see the <a href="https://2018.igem.org/Judging/Medals">2018 Medals Page</a> for more information.  
+
left: 7.5%;
</p>
+
top: 12vw;
</div>
+
}
  
<div class="column two_thirds_size">
+
.dot2 {
 +
width: 3.5%;
 +
left: 32.3%;
 +
top: 31.7vw;
 +
}
  
<h4> Which other teams can we work with? </h4>
+
.dot4 {
<p>
+
width: 3.5%;
You can work with any other team in the competition, including software, hardware, high school and other tracks. You can also work with non-iGEM research groups, but they do not count towards the iGEM team collaboration silver medal criterion.
+
left: 77%;
</p>
+
top: 28.7vw;
 +
}
  
<p>
+
.dot1 img,.dot2 img,.dot3 img,.dot4 img {
In order to meet the silver medal criteria on helping another team, you must complete this page and detail the nature of your collaboration with another iGEM team.
+
width: 100%;
</p>
+
position: relative;
 +
/* 淡出淡入效果0.5秒 */
 +
transition: opacity 0.5s ease-in-out;
 +
cursor: pointer;
 +
}
  
</div>
+
.dot1 img:last-child:hover {
 +
/* 滑入時第一張透明度設0 */
 +
  opacity:0;
 +
}
  
 +
.dot2 img:last-child:hover {
 +
/* 滑入時第一張透明度設0 */
 +
  opacity:0;
 +
}
  
 +
.dot3 img:last-child:hover {
 +
/* 滑入時第一張透明度設0 */
 +
  opacity:0;
 +
}
  
<div class="column third_size">
+
.dot4 img:last-child:hover {
<p>
+
/* 滑入時第一張透明度設0 */
Here are some suggestions for projects you could work on with other teams:
+
  opacity:0;
</p>
+
}
 +
 
 +
.first1 {
 +
top: -3.8vw;
 +
}
 +
 
 +
.first2 {
 +
top: -3.33vw;
 +
}
 +
 
 +
.first3 {
 +
top: -4.75vw;
 +
}
 +
 
 +
.first4 {
 +
top: -3.35vw;
 +
}
 +
 
 +
.title_title{
 +
  width: 35%;
 +
  margin-left: 32.5%;
 +
}
 +
 
 +
.explanation{
 +
  font-size: 2.5vmin;
 +
  font-weight: bold;
 +
  color: #575656;
 +
  text-align: center;
 +
  margin-top: 15px;
 +
  margin-bottom: 15px;
 +
}
 +
 
 +
.icon{
 +
  width: 20px;
 +
  vertical-align: middle;
 +
}
 +
 
 +
.edu1 {
 +
width: 85%;
 +
margin-left: 7.5%;
 +
margin-right: 7.5%;
 +
margin-bottom: 60px;
 +
margin-top: 10px;
 +
box-sizing: border-box;
 +
}
 +
 
 +
.block {
 +
box-sizing: border-box;
 +
margin: 0px;
 +
}
 +
 
 +
.title_1 {
 +
width: 85%;
 +
position: relative;
 +
left: 7.5%;
 +
margin-bottom: -1.5vw;
 +
font-size: 3vw;
 +
}
 +
 
 +
.title_2 {
 +
width: 80%;
 +
position: relative;
 +
left: 10%;
 +
margin-bottom: -2.5vw;
 +
font-size: 2vw;
 +
}
 +
 
 +
.photo_1 {
 +
width: 60%;
 +
margin-top: 20px;
 +
position: relative;
 +
left: 20%;
 +
}
 +
 
 +
.content_1 {
 +
width: 75%;
 +
height: auto;
 +
font-size: 3vmin;
 +
text-align: justify;
 +
padding: 20px;
 +
padding-top: 10px;
 +
position: relative;
 +
left: 12.5%;
 +
}
 +
 
 +
.team {
 +
  color: #060b58;
 +
  transition-duration: 0.4s;
 +
  text-decoration: none;
 +
}
 +
 
 +
.team:hover {
 +
  color: #fbdd29;
 +
}
 +
 
 +
</style>
 +
 
 +
 
 +
 
 +
 
 +
</head>
 +
 
 +
<body>
 +
 
 +
 
 +
<div class="wrapper">
 +
  <div class="cover">
 +
      <img class="picture" src="https://static.igem.org/mediawiki/2018/d/d4/T--NCTU_Formosa--HP_inside_cover.png"/>
 +
      <div class="dot1"><img src="https://static.igem.org/mediawiki/2018/9/9d/T--NCTU_Formosa--HP_inside_cover_dot2.png"/><a href="https://2018.igem.org/Team:NCTU_Formosa/Public_Engagement"><img class="first1" src="https://static.igem.org/mediawiki/2018/0/03/T--NCTU_Formosa--HP_inside_cover_dot.png"/></a></div>
 +
      <div class="dot2"><img src="https://static.igem.org/mediawiki/2018/9/9d/T--NCTU_Formosa--HP_inside_cover_dot2.png"/><a href="https://2018.igem.org/Team:NCTU_Formosa/Human_Practices/Integrated"><img class="first2" src="https://static.igem.org/mediawiki/2018/0/03/T--NCTU_Formosa--HP_inside_cover_dot.png"/></a></div>
 +
      <div class="dot4"><img src="https://static.igem.org/mediawiki/2018/9/9d/T--NCTU_Formosa--HP_inside_cover_dot2.png"/><a href="https://2018.igem.org/Team:NCTU_Formosa/Collaborations"><img class="first4" src="https://static.igem.org/mediawiki/2018/0/03/T--NCTU_Formosa--HP_inside_cover_dot.png"/></a></div>
 +
  </div>
 +
  <img src="https://static.igem.org/mediawiki/2018/5/57/T--NCTU_Formosa--collaboration_title.png" class="title_title">
 +
  <div class="edu1">
 +
    <div class="block title_1"><p>Team: <a href="" class="team">NTHU_Formosa</a></p></div>
 +
    <div class="block title_2"><p>Troubleshooting -- Wiki course</p></div>
 +
    <div class="block content_1"><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;On August 23<sup>th</sup>, we prepared a wiki course for NTHU_Formosa, helping them to troubleshoot on their difficulties of writing their wiki. First of all, we taught them the concept and process of designing a website as an introduction.  Second, we introduced how to use HTML, CSS, as well as  JavaScript. Third, we helped them to build up a simple RWD website step by step to make them more familiar with the web languages. Finally, we gave them some tips and advices on editing their wiki. We’re really happy about having such a chance to share our knowledge with other iGEM teams! Hope the course could help them in a meaningful way. We’re looking forward to have further collaboration with NTHU_Formosa.</p></div>
 +
    <img src="https://static.igem.org/mediawiki/2018/9/9f/T--NCTU_Formosa--NTHU_3.png" class="photo_1">
 +
    <div class="explanation">
 +
      <svg class="icon" aria-hidden="true" data-prefix="fas" data-icon="arrow-circle-up" class="svg-inline--fa fa-arrow-circle-up fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M8 256C8 119 119 8 256 8s248 111 248 248-111 248-248 248S8 393 8 256zm143.6 28.9l72.4-75.5V392c0 13.3 10.7 24 24 24h16c13.3 0 24-10.7 24-24V209.4l72.4 75.5c9.3 9.7 24.8 9.9 34.3.4l10.9-11c9.4-9.4 9.4-24.6 0-33.9L273 107.7c-9.4-9.4-24.6-9.4-33.9 0L106.3 240.4c-9.4 9.4-9.4 24.6 0 33.9l10.9 11c9.6 9.5 25.1 9.3 34.4-.4z"></path></svg>
 +
      Figure 1: The wiki course (when talking about CSS)
 +
    </div>
 +
    <img src="https://static.igem.org/mediawiki/2018/e/e1/T--NCTU_Formosa--NTHU_1.png" class="photo_1">
 +
    <div class="explanation"  style="margin-bottom: 7vw;">
 +
      <svg class="icon" aria-hidden="true" data-prefix="fas" data-icon="arrow-circle-up" class="svg-inline--fa fa-arrow-circle-up fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M8 256C8 119 119 8 256 8s248 111 248 248-111 248-248 248S8 393 8 256zm143.6 28.9l72.4-75.5V392c0 13.3 10.7 24 24 24h16c13.3 0 24-10.7 24-24V209.4l72.4 75.5c9.3 9.7 24.8 9.9 34.3.4l10.9-11c9.4-9.4 9.4-24.6 0-33.9L273 107.7c-9.4-9.4-24.6-9.4-33.9 0L106.3 240.4c-9.4 9.4-9.4 24.6 0 33.9l10.9 11c9.6 9.5 25.1 9.3 34.4-.4z"></path></svg>
 +
      Figure 2: NCTU_Formosa and NTHU_Formosa team members
 +
    </div>
 +
 
 +
    <div class="block title_2"><p>Bidirectional collaboration with NTHU_Formosa</p></div>
 +
    <div class="block content_1"><p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;On August 23<sup>th</sup>, we prepared a wiki course for NTHU_Formosa, helping them to troubleshoot on their difficulties of writing their wiki. First of all, we taught them the concept and process of designing a website as an introduction.  Second, we introduced how to use HTML, CSS, as well as  JavaScript. Third, we helped them to build up a simple RWD website step by step to make them more familiar with the web languages. Finally, we gave them some tips and advices on editing their wiki. We’re really happy about having such a chance to share our knowledge with other iGEM teams! Hope the course could help them in a meaningful way. We’re looking forward to have further collaboration with NTHU_Formosa.</p></div>
 +
    <img src="" class="photo_1">
 +
    <div class="explanation">
 +
      <svg class="icon" aria-hidden="true" data-prefix="fas" data-icon="arrow-circle-up" class="svg-inline--fa fa-arrow-circle-up fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M8 256C8 119 119 8 256 8s248 111 248 248-111 248-248 248S8 393 8 256zm143.6 28.9l72.4-75.5V392c0 13.3 10.7 24 24 24h16c13.3 0 24-10.7 24-24V209.4l72.4 75.5c9.3 9.7 24.8 9.9 34.3.4l10.9-11c9.4-9.4 9.4-24.6 0-33.9L273 107.7c-9.4-9.4-24.6-9.4-33.9 0L106.3 240.4c-9.4 9.4-9.4 24.6 0 33.9l10.9 11c9.6 9.5 25.1 9.3 34.4-.4z"></path></svg>
 +
      Figure 3: The wiki course (when talking about CSS)
 +
    </div>
 +
 
 +
    <div class="block title_2"><p>Validation</p></div>
 +
  </div>
  
<ul>
 
<li> Improve the function of another team's BioBrick Part or Device</li>
 
<li> Characterize another team's part </li>
 
<li> Debug a construct </li>
 
<li> Model or simulate another team's system </li>
 
<li> Test another team's software</li>
 
<li> Help build and test another team's hardware project</li>
 
<li> Mentor a high-school team</li>
 
</ul>
 
 
</div>
 
</div>
  
 +
</body>
  
 
</html>
 
</html>
 +
 +
{{NCTU_Formosa/Top_button}}
 +
{{NCTU_Formosa/Footer}}

Revision as of 16:19, 10 October 2018

Navigation Bar

Education

Troubleshooting -- Wiki course

     On August 23th, we prepared a wiki course for NTHU_Formosa, helping them to troubleshoot on their difficulties of writing their wiki. First of all, we taught them the concept and process of designing a website as an introduction. Second, we introduced how to use HTML, CSS, as well as JavaScript. Third, we helped them to build up a simple RWD website step by step to make them more familiar with the web languages. Finally, we gave them some tips and advices on editing their wiki. We’re really happy about having such a chance to share our knowledge with other iGEM teams! Hope the course could help them in a meaningful way. We’re looking forward to have further collaboration with NTHU_Formosa.

Figure 1: The wiki course (when talking about CSS)
Figure 2: NCTU_Formosa and NTHU_Formosa team members

Bidirectional collaboration with NTHU_Formosa

     On August 23th, we prepared a wiki course for NTHU_Formosa, helping them to troubleshoot on their difficulties of writing their wiki. First of all, we taught them the concept and process of designing a website as an introduction. Second, we introduced how to use HTML, CSS, as well as JavaScript. Third, we helped them to build up a simple RWD website step by step to make them more familiar with the web languages. Finally, we gave them some tips and advices on editing their wiki. We’re really happy about having such a chance to share our knowledge with other iGEM teams! Hope the course could help them in a meaningful way. We’re looking forward to have further collaboration with NTHU_Formosa.

Figure 3: The wiki course (when talking about CSS)

Validation

Template