Difference between revisions of "Team:UPF CRG Barcelona/WetLab"

Line 4: Line 4:
 
  <link rel="stylesheet" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/styles?action=raw&ctype=text/css" type='text/css'>
 
  <link rel="stylesheet" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/styles?action=raw&ctype=text/css" type='text/css'>
  
 +
<body>
 +
  <div class="sticky-top">
  
 +
 +
      <nav class="navbar has-shadow" role="navigation" aria-label="main navigation" id="navbar">
 +
          <div class="container">
 +
   
 +
            <div class="navbar-brand">
 +
              <a class="navbar-logo" href="index.html">
 +
                <img src="https://static.igem.org/mediawiki/2018/3/37/T--UPF_CRG_Barcelona--logosensebarcelona.svg" alt="iGEM Barcelona team 2018">
 +
              </a>
 +
   
 +
              <div class="navbar-burger" data-target="navbar-menu">
 +
                <span></span>
 +
                <span></span>
 +
                <span></span>
 +
              </div>
 +
            </div>
 +
   
 +
            <!-- children of navbar-menu must be navbar-start and/or navbar-end -->
 +
            <div class="navbar-menu" id="navbar-menu">
 +
              <!-- navbar items -->
 +
              <div class="navbar-grid">
 +
                <!--class is-active for showing active menu-->
 +
                <a style="color: rgb(242, 242, 242)" class="navbar-item" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Description">Project</a>
 +
                <a style="color: rgb(242, 242, 242)" class="navbar-item" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/DryLab">DryLab</a>
 +
                <a style="color: rgb(242, 242, 242)" class="navbar-item" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Parts">Parts</a>
 +
                <a class="navbar-item is-active" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Deliverables">Deliverables</a>
 +
                <a style="color: rgb(242, 242, 242)" class="navbar-item" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/WetLab">WetLab</a>
 +
                <a style="color: rgb(242, 242, 242)" class="navbar-item" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Intro_HP">Human Practices</a>
 +
                <a style="color: rgb(242, 242, 242)" class="navbar-item" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Aboutteam">Team</a>
 +
              </div>
 +
            </div>
 +
          </div>
 +
        </nav>
 +
<header id="header">
 +
      <div id="blur"></div>
 +
      <!-- Swiper -->
 +
      <div class="swiper-container" id="sw-container">
 +
          <div class="swiper-wrapper">
 +
            <a class="swiper-slide swiper-slide-menu" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Background">
 +
              <embed src="https://static.igem.org/mediawiki/2018/d/d5/T--UPF_CRG_Barcelona--background.svg" alt="Description">
 +
              <p>Background<br>and design</p>
 +
            </a>
 +
            <a class="swiper-slide swiper-slide-menu" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Overexpression">
 +
              <embed src="https://static.igem.org/mediawiki/2018/6/6d/T--UPF_CRG_Barcelona--fads.svg" alt="">
 +
              <p>Overexpression</p>
 +
            </a>
 +
            <a class="swiper-slide swiper-slide-menu" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Biosensor">
 +
              <embed src="https://static.igem.org/mediawiki/2018/c/c8/T--UPF_CRG_Barcelona--biosensor.svg" alt="">
 +
              <p>Biosensor</p>
 +
            </a>
 +
            <a class="swiper-slide swiper-slide-menu" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Integration">
 +
              <embed src="https://static.igem.org/mediawiki/2018/c/c3/T--UPF_CRG_Barcelona--mage.svg" alt="">
 +
              <p>Integration</p>
 +
            </a>
 +
            <a class="swiper-slide swiper-slide-menu" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Simulation">
 +
              <embed src="https://static.igem.org/mediawiki/2018/9/95/T--UPF_CRG_Barcelona--demonstration.svg" alt="">
 +
              <p>Simulation</p>
 +
            </a>
 +
            <a class="swiper-slide swiper-slide-menu" href="https://2018.igem.org/Team:UPF_CRG_Barcelona/Results">
 +
              <embed src="https://static.igem.org/mediawiki/2018/9/9c/T--UPF_CRG_Barcelona--results.svg" alt="">
 +
              <p>Results</p>
 +
            </a> 
 +
        </div>
 +
        <!-- Add Arrows -->
 +
        <div class="swiper-button-next"></div>
 +
        <div class="swiper-button-prev"></div>
 +
      </div>
 +
    </header>
 +
  </div>
 +
 +
  <main>
 +
 +
    <section class="container">
 +
 +
      <div>
 +
</div>
 +
 +
    </section>
 +
 +
  </main>
  
 
  <div class="spacer"></div>
 
  <div class="spacer"></div>
Line 14: Line 95:
  
 
<script src="https://2018.igem.org/Team:UPF_CRG_Barcelona/scripts?action=raw&ctype=text/javascript" charset="utf-8" type="text/javascript"></script>
 
<script src="https://2018.igem.org/Team:UPF_CRG_Barcelona/scripts?action=raw&ctype=text/javascript" charset="utf-8" type="text/javascript"></script>
 +
<script>
 +
    // Initialize Swiper
 +
    var swiper = new Swiper('.swiper-container', {
 +
      slidesPerView: 6,
 +
      slidesPerGroup: 1,
 +
      loop: true,
 +
      freeMode: true,
 +
      observer: true,
 +
      watchOverflow: true,
 +
      navigation: {
 +
        nextEl: '.swiper-button-next',
 +
        prevEl: '.swiper-button-prev',
 +
      },
 +
      keyboard: {
 +
        enabled: true,
 +
      },
 +
      watchOverflow: true,
 +
      freeModeSticky: true,
 +
      mousewheel: {
 +
        forceToAxis: true,
 +
      },
 +
      preventClicks: true,
 +
      iOSEdgeSwipeDetection: true,
 +
      observeParents: true,
 +
      breakpoints: {
 +
1024: {
 +
          slidesPerView: 5,
 +
        },
 +
        768: {
 +
          slidesPerView: 4,
 +
        },       
 +
640: {
 +
          slidesPerView: 3,
 +
        },
 +
        500: {
 +
          slidesPerView: 2,
 +
        },
 +
        320: {
 +
          slidesPerView: 1,
 +
        }
 +
      },
 +
    });
 +
  </script>
 +
</body>
  
 
</html>
 
</html>

Revision as of 23:39, 16 October 2018

Wiki