Difference between revisions of "Team:Mingdao/InterLab"

(Replaced content with "{{:Team:Mingdao/test3}}")
Line 1: Line 1:
{{:Team:Mingdao/test3}}
+
{{:Team:Mingdao/test}}
 +
<html lang="en">
 +
  <head>
 +
    <meta charset="UTF-8">
 +
    <link href='https://fonts.googleapis.com/css?family=Arizonia' rel='stylesheet'>
 +
    <link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet'>
 +
    <title>Inter Lab</title>
 +
  </head>
 +
  <style type="text/css">
 +
 
 +
* {
 +
  margin: 0;
 +
  padding: 0;
 +
  box-sizing: border-box; }
 +
 
 +
body {
 +
  width: 100%;
 +
  margin: 0;
 +
  padding: 0;
 +
  font-family: 'Ubuntu' !important; }
 +
 
 +
 
 +
.bg-container {
 +
  overflow: hidden;
 +
  position: relative;
 +
  background-color: #c5d7d9;
 +
  background-image: url(https://static.igem.org/mediawiki/2017/2/20/T--CSMU_NCHU_Taiwan--inter_lab.png);
 +
  background-repeat: repeat-y;
 +
  background-size: 100%;
 +
}
 +
 
 +
.my-main-container {
 +
  width: 100%;
 +
  padding: 50px 7%;
 +
}
 +
 
 +
.main-content {
 +
  background-color: white;
 +
  width: 80%;
 +
  margin-left: 10%;
 +
  padding: 50px;
 +
  min-height: 180vh;
 +
  z-index: 10; }
 +
 
 +
.text-area {
 +
  margin-bottom: 80px; }
 +
  .text-area h1 {
 +
    font-size: 60px;
 +
    font-weight: 700;
 +
    font-family: 'Arizonia' !important;
 +
    text-align: center; }
 +
  .text-area p {
 +
    font-size: 22px;
 +
    font-weight: 500; }
 +
 
 +
.pdfbtn {
 +
  width: 100%;
 +
  margin: 20px 0 10px 0;
 +
  padding: 10px 20px;
 +
  border-radius: 5px;
 +
  background-color: #556b7e;
 +
  color: white;
 +
  display: block;
 +
  position: relative; }
 +
  .pdfbtn i {
 +
    position: absolute;
 +
    right: 50px;
 +
    top: 50%;
 +
    transform: translateY(-50%); }
 +
 
 +
.pdf-container {
 +
  width: 100%;
 +
  text-align: center;
 +
  height: 90vh;
 +
  display: none; }
 +
 
 +
.ul-container {
 +
  width: 100%;
 +
  text-align: center;
 +
  height: auto;
 +
  }
 +
 
 +
.ul-container ul.medal li {
 +
  list-style: none; }
 +
  .ul-container ul.medal li:before {
 +
    content: '';
 +
    display: inline-block;
 +
    height: 1em;
 +
    width: 2em;
 +
    background-size: 1em;
 +
    background-image: url(../img/circle.png);
 +
    background-repeat: no-repeat; }
 +
 
 +
.ul-container ul {
 +
  text-align: left;
 +
  padding: 20px 50px;
 +
  margin-left: 0;
 +
 
 +
  border: #556b7e solid 2px;
 +
  font-size: 22px; }
 +
  .ul-container ul li {
 +
    padding: 10px;
 +
    list-style: disc; }
 +
    .ul-container ul li a {
 +
      text-decoration: none;
 +
      color: #000; }
 +
      .ul-container ul li a:visited, .ul-container ul li a:hover, .ul-container ul li a:focus {
 +
        color: #000;
 +
        text-decoration: none; }
 +
    .ul-container ul li span {
 +
      background-color: #fadd3a;
 +
      padding: 1px 10px;
 +
      border-radius: 5px;
 +
      margin-left: 20px;
 +
      cursor: pointer; }
 +
    .ul-container ul li i {
 +
      padding-left: 10px; }
 +
 
 +
#HQ_page .text-area p {
 +
  font-size: 22px;
 +
  font-family: 'Ubuntu';
 +
  font-weight: 500; }
 +
.top {
 +
  position: fixed;
 +
  right: 50px;
 +
  bottom: 50px;
 +
  height: 50px;
 +
  width: 50px;
 +
  cursor: pointer; }
 +
  .top img {
 +
    width: 100%; }
 +
h2 {
 +
font-family: 'Ubuntu';
 +
font-size: 30px;
 +
text-align: center;
 +
color: #000000 !important;
 +
}
 +
 
 +
</style>
 +
 
 +
  <body>
 +
    <div class="bg-container">
 +
      <div class="my-main-container">
 +
        <div class="main-content">
 +
          <div class="text-area">
 +
            <h1>Inter Lab</h1>
 +
         
 +
         
 +
 
 +
 
 +
 
 +
          <div class="pdf-area">
 +
<div class="img-container" id="lab-1">
 +
<embed src="https://static.igem.org/mediawiki/2018/7/7d/T--Mingdao--Interlab_note.pdf" style="width:100%; height:1000px" frameborder="0"></embed>
 +
            </div>
 +
          </div>
 +
 
 +
  <script type="text/javascript">
 +
    $('#interlab-btn-1').on('click', function(){
 +
      $('#interlab-1').css('height','250vh')
 +
      $('#interlab-1').slideToggle("slow");
 +
      $('.bg-container').css('max-height','500vh')
 +
      $('.main-content').css('min-height','200vh')
 +
    });
 +
    $('#interlab-btn-2').on('click', function(){
 +
      $('#interlab-2').slideToggle("slow");
 +
      $('.bg-container').css('max-height','500vh')
 +
      $('.main-content').css('min-height','200vh')
 +
    });
 +
    $('.top').on('click', function(){
 +
      $('html, body').animate({scrollTop: '0px'}, 500);
 +
    });
 +
</script>
 +
</html>

Revision as of 05:14, 10 September 2018

Inter Lab

Inter Lab