Team:USTC-China

From 2014.igem.org

(Difference between revisions)
 
(92 intermediate revisions not shown)
Line 1: Line 1:
-
{{:Team:SDU-Denmark/core/header| }}
+
{{:Team:USTC-China/partials/indexHeader}}
-
<!doctype html>
+
<html>
-
<html class="no-js" lang="en">
+
   <head>
   <head>
-
    <meta charset="utf-8" />
+
    <link rel="stylesheet" href="https://2014.igem.org/Team:USTC-China/assets/css/index.css?action=raw&ctype=text/css" />
-
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
</head>
-
     <title>Foundation | Welcome</title>
+
<body>
-
    <link rel="stylesheet" href="css/foundation.css" />
+
<div class="row" id="content-row">
-
    <script src="js/vendor/modernizr.js"></script>
+
 
-
   </head>
+
  <div class="large-3 columns">
-
   <body>
+
 
-
   
+
     <section id="intro">
-
     <div class="row">
+
      <h1> USTC China </h1>
-
       <div class="large-12 columns">
+
      <h2 style="font-family: 'Noto Serif'"><em>C. imager</em></h2> <h4 style="color: black;font-weight: 500;font-family: 'Noto Serif'">Through Bacteria</h4> <h4 style="color: black;font-weight: 500;font-family: 'Noto Serif'">View a Colorful World!</h4><br>
-
         <h1>Welcome to Foundation</h1>
+
      <a class="button success" href="https://2014.igem.org/Team:USTC-China/project">Our Project</a>
 +
    </section>
 +
   </div>
 +
 
 +
   <!-- Right Section -->
 +
  <div class="large-9 columns">
 +
     <div class="owl-carousel">
 +
       <div class="item">
 +
         <img src="https://static.igem.org/mediawiki/2014/0/0c/%E6%9C%AA%E6%A0%87%E9%A2%98-2.jpg">
       </div>
       </div>
-
    </div>
+
       <div class="item">
-
   
+
        <img src="https://static.igem.org/mediawiki/2014/5/53/2014USTC-China_HomeV3.jpg">
-
    <div class="row">
+
      </div>
-
       <div class="large-12 columns">
+
      <div class="item">
-
      <div class="panel">
+
        <img src="https://static.igem.org/mediawiki/2014/7/74/2014USTC-China_Home.jpg">
-
        <h3>We&rsquo;re stoked you want to try Foundation! </h3>
+
      </div>
-
        <p>To get going, this file (index.html) includes some basic styles you can modify, play around with, or totally destroy to get going.</p>
+
      <div class="item">
-
        <p>Once you've exhausted the fun in this document, you should check out:</p>
+
        <img src="https://static.igem.org/mediawiki/2014/d/d1/2014USTC-China_HomeV1.jpg">
-
        <div class="row">
+
-
        <div class="large-4 medium-4 columns">
+
-
    <p><a href="http://foundation.zurb.com/docs">Foundation Documentation</a><br />Everything you need to know about using the framework.</p>
+
-
    </div>
+
-
        <div class="large-4 medium-4 columns">
+
-
        <p><a href="http://github.com/zurb/foundation">Foundation on Github</a><br />Latest code, issue reports, feature requests and more.</p>
+
-
        </div>
+
-
        <div class="large-4 medium-4 columns">
+
-
        <p><a href="http://twitter.com/foundationzurb">@foundationzurb</a><br />Ping us on Twitter if you have questions. If you build something with this we'd love to see it (and send you a totally boss sticker).</p>
+
-
        </div>       
+
-
</div>
+
-
      </div>
+
       </div>
       </div>
     </div>
     </div>
 +
  </div>
 +
</div>
 +
<!-- Footer -->
 +
<div class="footer-ustc">
 +
  <div class="row">
 +
    <p>Lots of thanks to <a href="https://2014.igem.org/Team:USTC-China/acknowledgement">our sponsors</a>, who help us to achieve what we have today</p>
 +
    <p>© 2014 USTC-iGEM Design. Distributed under <a href="http://creativecommons.org/licenses/by-sa/3.0/">BY-SA 3.0</a></p>
 +
    <a href="https://2014.igem.org/Team:USTC-China/GitHub" target="_blank"><img src="https://static.igem.org/mediawiki/2014/3/3a/GitHub.png"></a>
 +
    <a href="http://page.renren.com/601464045" target="_blank"><img src="https://static.igem.org/mediawiki/2014/4/41/Renren.png"></a>
 +
    <a href="http://weibo.com/u/3929719655" target="_blank"><img src="https://static.igem.org/mediawiki/2014/5/57/Weibo.png"></a>
 +
    <span data-tooltip aria-haspopup="true" class="has-tip" title="ustc.igem.2014@gmail.com"><img src="https://static.igem.org/mediawiki/2014/f/fe/Mail.png"></span>
 +
    <a href="https://www.facebook.com/2014ustcchinaigem" target="_blank"><img src="https://static.igem.org/mediawiki/2014/d/d8/Ustc-facebook.png"></a>
 +
  </div>
 +
</div>
 +
<script src="https://2014.igem.org/Team:USTC-China/assets/js/vendor/jquery.js?action=raw&ctype=text/javascript"></script>
 +
<script src="https://2014.igem.org/Team:USTC-China/assets/js/foundation.min.js?action=raw&ctype=text/javascript"></script>
 +
<script>$(document).foundation();</script>
 +
<script src="https://2014.igem.org/Team:USTC-China/assets/js/owl.carousel.min.js?action=raw&ctype=text/javascript"></script>
 +
<script>
 +
$(document).ready(function() {
 +
  $('.owl-carousel').owlCarousel({
 +
    animateOut: 'slideOutDown',
 +
    animateIn: 'flipInX',
 +
    items:1,
 +
    margin:30,
 +
    stagePadding:30,
 +
    smartSpeed:450,
 +
    loop: true,
 +
    autoplay: true,
 +
    autoplayTimeout: 2500
 +
  });
 +
})
 +
</script>
 +
<script>
 +
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
 +
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
 +
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
 +
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
-
    <div class="row">
+
  ga('create', 'UA-52654271-1', 'auto');
-
      <div class="large-8 medium-8 columns">
+
  ga('send', 'pageview');
-
        <h5>Here&rsquo;s your basic grid:</h5>
+
-
        <!-- Grid Example -->
+
-
        <div class="row">
+
</script>
-
          <div class="large-12 columns">
+
-
            <div class="callout panel">
+
-
              <p><strong>This is a twelve column section in a row.</strong> Each of these includes a div.panel element so you can see where the columns are - it's not required at all for the grid.</p>
+
-
            </div>
+
-
          </div>
+
-
        </div>
+
-
        <div class="row">
+
-
          <div class="large-6 medium-6 columns">
+
-
            <div class="callout panel">
+
-
              <p>Six columns</p>
+
-
            </div>
+
-
          </div>
+
-
          <div class="large-6 medium-6 columns">
+
-
            <div class="callout panel">
+
-
              <p>Six columns</p>
+
-
            </div>
+
-
          </div>
+
-
        </div>
+
-
        <div class="row">
+
-
          <div class="large-4 medium-4 small-4 columns">
+
-
            <div class="callout panel">
+
-
              <p>Four columns</p>
+
-
            </div>
+
-
          </div>
+
-
          <div class="large-4 medium-4 small-4 columns">
+
-
            <div class="callout panel">
+
-
              <p>Four columns</p>
+
-
            </div>
+
-
          </div>
+
-
          <div class="large-4 medium-4 small-4 columns">
+
-
            <div class="callout panel">
+
-
              <p>Four columns</p>
+
-
            </div>
+
-
          </div>
+
-
        </div>
+
-
       
+
-
        <hr />
+
-
               
+
-
        <h5>We bet you&rsquo;ll need a form somewhere:</h5>
+
-
        <form>
+
-
  <div class="row">
+
-
    <div class="large-12 columns">
+
-
      <label>Input Label</label>
+
-
      <input type="text" placeholder="large-12.columns" />
+
-
    </div>
+
-
  </div>
+
-
  <div class="row">
+
-
    <div class="large-4 medium-4 columns">
+
-
      <label>Input Label</label>
+
-
      <input type="text" placeholder="large-4.columns" />
+
-
    </div>
+
-
    <div class="large-4 medium-4 columns">
+
-
      <label>Input Label</label>
+
-
      <input type="text" placeholder="large-4.columns" />
+
-
    </div>
+
-
    <div class="large-4 medium-4 columns">
+
-
      <div class="row collapse">
+
-
        <label>Input Label</label>
+
-
        <div class="small-9 columns">
+
-
          <input type="text" placeholder="small-9.columns" />
+
-
        </div>
+
-
        <div class="small-3 columns">
+
-
          <span class="postfix">.com</span>
+
-
        </div>
+
-
      </div>
+
-
    </div>
+
-
  </div>
+
-
  <div class="row">
+
-
    <div class="large-12 columns">
+
-
      <label>Select Box</label>
+
-
      <select>
+
-
        <option value="husker">Husker</option>
+
-
        <option value="starbuck">Starbuck</option>
+
-
        <option value="hotdog">Hot Dog</option>
+
-
        <option value="apollo">Apollo</option>
+
-
      </select>
+
-
    </div>
+
-
  </div>
+
-
  <div class="row">
+
-
    <div class="large-6 medium-6 columns">
+
-
      <label>Choose Your Favorite</label>
+
-
      <input type="radio" name="pokemon" value="Red" id="pokemonRed"><label for="pokemonRed">Radio 1</label>
+
-
      <input type="radio" name="pokemon" value="Blue" id="pokemonBlue"><label for="pokemonBlue">Radio 2</label>
+
-
    </div>
+
-
    <div class="large-6 medium-6 columns">
+
-
      <label>Check these out</label>
+
-
      <input id="checkbox1" type="checkbox"><label for="checkbox1">Checkbox 1</label>
+
-
      <input id="checkbox2" type="checkbox"><label for="checkbox2">Checkbox 2</label>
+
-
    </div>
+
-
  </div>
+
-
  <div class="row">
+
-
    <div class="large-12 columns">
+
-
      <label>Textarea Label</label>
+
-
      <textarea placeholder="small-12.columns"></textarea>
+
-
    </div>
+
-
  </div>
+
-
</form>
+
-
      </div>    
+
-
      <div class="large-4 medium-4 columns">
+
<script>  
-
  <h5>Try one of these buttons:</h5>
+
var $buoop = {c:2};
-
  <p><a href="#" class="small button">Simple Button</a><br/>
+
function $buo_f(){
-
        <a href="#" class="small radius button">Radius Button</a><br/>
+
var e = document.createElement("script");
-
        <a href="#" class="small round button">Round Button</a><br/>           
+
e.src = "//browser-update.org/update.js";
-
        <a href="#" class="medium success button">Success Btn</a><br/>
+
document.body.appendChild(e);
-
        <a href="#" class="medium alert button">Alert Btn</a><br/>
+
};
-
        <a href="#" class="medium secondary button">Secondary Btn</a></p>         
+
try {document.addEventListener("DOMContentLoaded", $buo_f,false)}
-
<div class="panel">
+
catch(e){window.attachEvent("onload", $buo_f)}
-
        <h5>So many components, girl!</h5>
+
</script>  
-
        <p>A whole kitchen sink of goodies comes with Foundation. Checkout the docs to see them all, along with details on making them your own.</p>
+
</body>
-
        <a href="http://foundation.zurb.com/docs/" class="small button">Go to Foundation Docs</a>         
+
-
        </div>
+
-
      </div>
+
-
    </div>
+
-
   
+
-
    <script src="js/vendor/jquery.js"></script>
+
-
    <script src="js/foundation.min.js"></script>
+
-
    <script>
+
-
      $(document).foundation();
+
-
    </script>
+
-
  </body>
+
</html>
</html>

Latest revision as of 02:59, 18 October 2014

USTC China

C. imager

Through Bacteria

View a Colorful World!


Our Project