Difference between revisions of "Team:SKLMT-China"

 
(64 intermediate revisions by 2 users not shown)
Line 1: Line 1:
−
<!DOCTYPE html>
 
 
<html>
 
<html>
−
<head>
+
    <section class="index-banner" style="background-image: url(https://static.igem.org/mediawiki/2018/0/0c/T--SKLMT-China--index-banner-1.jpg)">
−
<title>:SDU-CHINA</title>
+
        <div class="inner">
−
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
+
            <header>
−
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+
                <h2>P.P.P</h2>
−
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
+
            </header>
−
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
+
            <p>Planet Protect Plan</p>
−
    <style type="text/css" media="screen">
+
            <footer>
−
.navbar {
+
                <ul class="buttons stacked">
−
  background-color: #6e7e98;
+
                    <li><a href="#section2" class="actions scrolly">Learn More</a></li>
−
  color:#fff;
+
                </ul>
 +
            </footer>
 +
        </div>
 +
    </section>
 +
 
 +
 
 +
    <div class="tiles" id="section2">
 +
 
 +
        <article style="background-image: url(https://static.igem.org/mediawiki/2018/6/6b/T--SKLMT-China--team-banner-1.jpg)">
 +
            <a href="https://2018.igem.org/Team:SKLMT-China/Team"></a>
 +
            <header class="major">
 +
                <h2>Team</h2>
 +
                <p>Members</p>
 +
<p>Attributions</p>
 +
<p>Sponsors</p>
 +
<p>Judging</p>
 +
            </header>
 +
        </article>
 +
 
 +
        <article style="background-image: url(https://static.igem.org/mediawiki/2018/a/a5/T--SKLMT-China--prj-banner-1.jpg)">
 +
            <a href="https://2018.igem.org/Team:SKLMT-China/Project"></a>
 +
            <header class="major">
 +
                <h2>Project</h2>
 +
                <p>Overview</p>
 +
<p>Design</p>
 +
<p>Red/ET</p>
 +
<p>Results&Demonstration</p>
 +
<p>Safety</p>
 +
            </header>
 +
        </article>
 +
 
 +
        <article style="background-image: url(https://static.igem.org/mediawiki/2018/e/eb/T--SKLMT-China--art-banner4.jpg)">
 +
            <a href="https://2018.igem.org/Team:SKLMT-China/InterLab"></a>
 +
            <header class="major">
 +
                <h2>InterLab</h2>
 +
               
 +
            </header>
 +
        </article>
 +
 
 +
        <article style="background-image: url(https://static.igem.org/mediawiki/2018/0/00/T--SKLMT-China--parts-banner.jpg)">
 +
            <a href="https://2018.igem.org/Team:SKLMT-China/Parts"></a>
 +
            <header class="major">
 +
                <h2>Parts</h2>
 +
                <p>Basic parts</p>
 +
                <p>Composite Parts</p>
 +
<p>Part Collection</p>
 +
<p>Improved Part</p>
 +
 
 +
            </header>
 +
        </article>
 +
 
 +
        <article style="background-image: url(https://static.igem.org/mediawiki/2018/0/0b/T--SKLMT-China--mod-ban-1.jpg)">
 +
            <a href="https://2018.igem.org/Team:SKLMT-China/Model"></a>
 +
            <header class="major">
 +
                <h2>Model</h2>
 +
                <p>Overview</p>
 +
<p>Process</p>
 +
<p>Resyults</p>
 +
 
 +
            </header>
 +
        </article>
 +
 
 +
        <article style="background-image: url(https://static.igem.org/mediawiki/2018/c/ce/T--SKLMT-China--sw-ban-2.jpg)">
 +
            <a href="https://2018.igem.org/Team:SKLMT-China/Software"></a>
 +
            <header class="major">
 +
                <h2>Software</h2>
 +
                <p>Introduction</p>
 +
<p>Principle</p>
 +
 
 +
            </header>
 +
        </article>
 +
 
 +
        <article style="background-image: url(https://static.igem.org/mediawiki/2018/c/c7/T--SKLMT-China--hp-banner-1.jpg)">
 +
            <a href="https://2018.igem.org/Team:SKLMT-China/Human_Practices"></a>
 +
            <header class="major">
 +
                <h2>Human Practices</h2>
 +
                <p>Overview</p>
 +
<p>Integrated&Gold</p>
 +
<p>Collaborations</p>
 +
            </header>
 +
        </article>
 +
 
 +
        <article style="background-image: url(https://static.igem.org/mediawiki/2018/3/33/T--SKLMT-China--nb-ban-1.jpg)">
 +
            <a href="https://2018.igem.org/Team:SKLMT-China/Notebook"></a>
 +
            <header class="major">
 +
                <h2>Notebook</h2>
 +
                <p>Overview</p>
 +
<p>Protocol</p>
 +
<p>Material</p>
 +
 
 +
            </header>
 +
        </article>
 +
 
 +
    </div>
 +
</html>
 +
 
 +
{{SKLMT-China/none-footer}}
 +
 
 +
<html>
 +
<style>
 +
nav.navbar.bootsnav.navbar-fixed {
 +
    background-color: rgba(0, 0, 0, 0.4);
 
}
 
}
−
.navbar .nav > li .dropdown-menu { 
+
nav.navbar.bootsnav ul.nav > li > a {
−
            margin: 0; 
+
    color: #fff;
−
        } 
+
−
.navbar .nav > li:hover .dropdown-menu { 
+
−
            display: block; }
+
−
li a{
+
−
    color: #fff;
+
−
      }
+
−
a:hover{
+
−
color: red;
+
 
}
 
}
−
footer
+
 
−
{
+
 
−
background-color: black;
+
.tiles {
 +
    display: flex;
 +
    flex-wrap: wrap;
 +
    border-top: 0;
 
}
 
}
−
#Call{
+
 
−
font-size: 1.5em;
+
.tiles article {
 +
    display: flex;
 +
    height: 40vh;
 +
    max-height: 40em;
 +
    min-height: 25em;
 +
    overflow: hidden;
 +
    width: 40%;
 +
 
 +
    background-repeat: no-repeat;
 +
    background-position: center;
 +
    background-size: cover;
 +
    transition: all 1s ease;
 
}
 
}
−
li a:hover{
+
 
−
color:#fff;
+
.tiles article:nth-child(4n - 1), .tiles article:nth-child(4n - 2) {
−
background:#999E9F;
+
    width: 60%;
−
-moz-transition: background 0.3s ease-in-out, color 0.3s ease-in-out;
+
−
-webkit-transition: background 0.3s ease-in-out, color 0.3s ease-in-out;
+
−
}
+
−
.cardbox{
+
−
  width: 60px;
+
−
  height:60px;
+
−
  font-size: 20px;
+
 
}
 
}
−
#shanda{
+
 
−
width: 320px;
+
.tiles article header {
−
height:120px;
+
    padding: 1em 0 1em 5em;
 +
    margin: auto auto;
 +
    width: 100%;
 +
    display: inline-block;
 +
    vertical-align: middle;
 +
    position: relative;
 +
    z-index: 1;
 +
    transition: all 1s ease;
 +
 
 
}
 
}
−
#mathworks{
+
 
−
width: 240px;
+
.tiles article a {
−
height:90px;
+
    position: absolute;
 +
    width: 100%;
 +
    height: 100%;
 +
    z-index: 4;
 
}
 
}
−
</style>
 
−
</head>
 
  
−
<body>
+
.tiles article header h2 {
−
<header class="container-fluid">
+
    color: #fff;
−
<nav class="nav navbar">
+
    font-size: 3em;
−
<div class="col-xs-3 col-md-2">
+
    transform: translateY(100px);
−
<ul class="nav">
+
    transition: all 1s ease;
−
<li><a class="dropdown-toggle" data-toggle="dropdown" href="#"><b>Project</b></a><span class="caret"></span>
+
}
−
            <ul class="dropdown-menu">
+
 
−
              <li><a href="Description.html" target="_self">Description</a></li>
+
.tiles article header p {
−
              <li><a href="Design.html">Design</a></li>
+
    color: #fff;
−
              <li><a href="Results.html">Results</a></li>
+
    margin-top: 1em;
−
              <li><a href="Model.html">Model</a></li>
+
    font-style: normal;
−
              <li><a href="Demonstrate.html">Demonstrate</a></li>
+
    font-size: 1.4em;
−
            </ul>
+
    opacity: 0;
−
            </li>
+
 
−
</ul>
+
    transition: all 1s ease;
−
</div>
+
    transform: translateY(100px);
−
<div class="col-xs-3 col-md-2">
+
}
−
<ul class="nav">
+
 
−
  <li><a href="Attributions.html"><b>Attributions</b></a></li>
+
.tiles article:hover header p {
−
            </ul>
+
    transform: translateY(0);
−
</div>
+
    opacity: 1;
−
<div class="col-xs-3 col-md-2">
+
}
−
<ul class="nav">
+
 
−
<li><a class="dropdown-toggle" data-toggle="dropdown" href="#"><b>Human pactice</b></a><span class="caret"></span>
+
.tiles article:hover header h2 {
−
            <ul class="dropdown-menu">
+
    transform: translateY(0);
−
              <li><a href="Human_Practices.html#Silver">Silver</a></li>
+
    font-size: 3.5em;
−
              <li><a href="Human_Practices.html#Gold_Integrated">Gold Integrated</a></li>
+
}
−
              <li><a href="Public_Engagement.html">Public Engagement</a></li>
+
 
−
            </ul>
+
.tiles article:hover {
−
            </li>
+
    transform: scale(1.1);
−
</ul>
+
    z-index:4;
−
</div>
+
}
−
<div class="col-xs-3 col-md-2">
+
 
−
<ul class="nav">
+
article:after {
−
<li><a class="dropdown-toggle" data-toggle="dropdown" href="#"><b>In Lab</b></a><span class="caret"></span>
+
    position:absolute;
−
            <ul class="dropdown-menu">
+
    left: 0;
−
              <li><a href="Experiments.html">Experiment</a></li>
+
    top:0;
−
              <li><a href="Notebook.html">Notebook</a></li>
+
    display: block;
−
              <li><a href="InterLab.html">Safety</a></li>
+
    width:100%;
−
            </ul>
+
    height: 100%;
−
            </li>
+
    background-color: rgba(0, 0, 0, 0.88);
−
</ul>
+
    content: attr(data-text);
−
</div>
+
    transition:all 1s ease;
−
<div class="col-xs-3 col-md-2">
+
    transform: translateY(0);
−
<ul class="nav">
+
}
−
<li><a class="dropdown-toggle" data-toggle="dropdown" href="#"><b>Parts</b></a><span class="caret"></span>
+
 
−
            <ul class="dropdown-menu">
+
article:hover:after{
−
              <li><a href="Parts.html">Parts Overview</a></li>
+
    transform: translateY(100%);
−
              <li><a href="Basic_Part.html">Basic Part</a></li>
+
}
−
              <li><a href="Composite_Part.html">Composite Part</a></li>
+
</style>
−
              <li><a href="Part_Collection.html">Parts Collection</a></li>
+
−
              <li><a href="Improve.html">Improve</a></li>
+
−
            </ul>
+
−
            </li>
+
−
</ul>
+
−
</div>
+
−
<div class="col-xs-3 col-md-2">
+
−
<ul class="nav">
+
−
<li><a class="dropdown-toggle" data-toggle="dropdown" href="#"><b>Team</b></a><span class="caret"></span>
+
−
            <ul class="dropdown-menu">
+
−
              <li><a href="Team.html">Team Members</a></li>
+
−
              <li><a href="Attributions.html">Attributions</a></li>
+
−
              <li><a href="Collaborations.html">Collaborations</a></li>
+
−
            </ul>
+
−
            </li>
+
−
</ul>
+
−
</div>
+
−
</nav>
+
−
</header>
+
−
<footer class="container-fluid">
+
−
<div class="row">
+
−
<div class="col-xs-6 col-md-10">
+
−
<p style="color: white" id="Call">Sponsers</p>
+
−
<!-- <img class="cardbox" src="https://static.igem.org/mediawiki/2018/e/ee/T--SDU-CHINA--index--snapgene.png" >&nbsp;&nbsp;&nbsp;-->
+
−
<img id="shanda" src="https://static.igem.org/mediawiki/2018/e/e2/T--SDU-CHINA--index--shanda.png">&nbsp;&nbsp;&nbsp;
+
−
<img id="mathworks" src="https://static.igem.org/mediawiki/2018/7/7e/T--SDU-CHINA--index--mathworks.png">
+
−
</div>
+
−
<div class="col-xs-6 col-md-2" id="footer_social">
+
−
        <p style="color: white" id="Call">Contact us</p>
+
−
        <a href="mailto:sdubioigem@163.com"><img class="cardbox" src="https://static.igem.org/mediawiki/2018/5/5b/T--SDU-CHINA--index--mailbox.png" ></a>
+
−
        <br>
+
−
        <a href="https://www.instagram.com/sdubiochina_2018/"><img class="cardbox" src="https://static.igem.org/mediawiki/2018/f/fa/T--SDU-CHINA--index--ins.png"></a></p>
+
−
      </div>
+
−
</div>
+
−
+
−
</footer>
+
−
</body>
+
 
</html>
 
</html>

Latest revision as of 22:10, 1 November 2018

P.P.P

Planet Protect Plan

Team

Members

Attributions

Sponsors

Judging

Project

Overview

Design

Red/ET

Results&Demonstration

Safety

InterLab

Parts

Basic parts

Composite Parts

Part Collection

Improved Part

Model

Overview

Process

Resyults

Software

Introduction

Principle

Human Practices

Overview

Integrated&Gold

Collaborations

Notebook

Overview

Protocol

Material