Team:USTC-China

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
 +
<!doctype html>
<html class="no-js" lang="en">
<html class="no-js" lang="en">
-
<head>
+
  <head>
     <meta charset="utf-8" />
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-
     <title>USTC-Software | Welcome</title>
+
     <title>Foundation | Welcome</title>
-
     <link rel="icon" href="http://huodong.ustc.edu.cn/Web/igem2014-website/img/favicons/favicon.ico" type="image/x-icon">
+
     <link rel="stylesheet" href="css/foundation.css" />
-
     <!-- For third-generation iPad with high-resolution Retina display: -->
+
     <script src="js/vendor/modernizr.js"></script>
-
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="http://huodong.ustc.edu.cn/Web/igem2014-website/img/favicons/apple-touch-icon-144x144-precomposed.png">
+
  </head>
-
    <!-- For iPhone with high-resolution Retina display: -->
+
  <body>
-
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="http://huodong.ustc.edu.cn/Web/igem2014-website/img/favicons/apple-touch-icon-114x114-precomposed.png">
+
-
    <!-- For first- and second-generation iPad: -->
+
-
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="http://huodong.ustc.edu.cn/Web/igem2014-website/img/favicons/apple-touch-icon-72x72-precomposed.png">
+
-
    <!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
+
-
    <link rel="apple-touch-icon-precomposed" href="http://huodong.ustc.edu.cn/Web/igem2014-website/img/favicons/apple-touch-icon-precomposed.png">
+
-
 
+
-
    <meta name="description" content="iGEM">
+
-
    <meta name="author" content="Taixing Lin">
+
-
    <meta name="copyright" content="USTC-Software, inc. Copyright (c) 2014">
+
      
      
-
     <link rel="stylesheet" href="http://huodong.ustc.edu.cn/Web/igem2014-website/css/foundation.css" />
+
     <div class="row">
-
    <link href="http://huodong.ustc.edu.cn/Web/igem2014-website/css/fixed-positioning.css" rel="stylesheet" type="text/css" />
+
      <div class="large-12 columns">
-
     <link href="http://huodong.ustc.edu.cn/Web/igem2014-website/css/fixed-igemHead.css" rel="stylesheet" type="text/css" />
+
        <h1>Welcome to Foundation</h1>
 +
      </div>
 +
     </div>
      
      
-
     <link rel="stylesheet" href="http://huodong.ustc.edu.cn/Web/igem2014-website/css/main.css" />
+
     <div class="row">
-
    <script src="http://huodong.ustc.edu.cn/Web/igem2014-website/js/vendor/modernizr.js"></script>
+
      <div class="large-12 columns">
-
    <!--[if lt IE 9]>
+
      <div class="panel">
-
    <link href="http://huodong.ustc.edu.cn/Web/igem2014-website/css/ie.css" media="screen" rel="stylesheet" />
+
        <h3>We&rsquo;re stoked you want to try Foundation! </h3>
-
     <![endif]-->
+
        <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>
 +
        <p>Once you've exhausted the fun in this document, you should check out:</p>
 +
        <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>
-
     <!-- IE Fix for HTML5 Tags -->
+
     <div class="row">
-
    <!--[if lt IE 9]>
+
       <div class="large-8 medium-8 columns">
-
    <script src="http://huodong.ustc.edu.cn/Web/igem2014-website/js/html5.js"></script>
+
        <h5>Here&rsquo;s your basic grid:</h5>
-
    <![endif]-->
+
        <!-- Grid Example -->
-
</head>
+
-
  <body class="off-canvas hide-extras " style="">
+
-
<div class="off-canvas-wrap">
+
-
       <div class="inner-wrap">
+
-
<aside class="left-off-canvas-menu">
+
-
  <ul class="off-canvas-list">
+
-
    <li><label class="first" style="font-family:'Open Sans','Seoge UI','Ubuntu',sans-serif; font-weight:700">USTC-Software</label></li>
+
-
    <li><a href="#">Home</a></li>
+
-
  </ul>
+
-
  <hr>
+
         <div class="row">
-
<!--
+
          <div class="large-12 columns">
-
  <ul class="off-canvas-list">
+
            <div class="callout panel">
-
    <li><label class="first">About</label></li>
+
               <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>
-
    <li><a href="learn/features.html">Overall</a></li>
+
            </div>
-
    <li><a href="learn/faq.html">Software</a></li>
+
          </div>
-
    <li><a href="learn/faq.html">Method</a></li>
+
-
    <li><a href="learn/faq.html">Examples</a></li>
+
-
    <li><a href="learn/faq.html">Future Work</a></li>
+
-
  </ul>
+
-
 
+
-
  <hr>
+
-
-->
+
-
  <ul class="off-canvas-list">
+
-
    <li><label>Teams</label></li>
+
-
  </ul>
+
-
 
+
-
  <hr>
+
-
 
+
-
  <ul class="off-canvas-list">
+
-
    <li><a href="https://2014.igem.org/Meetups:August_USTC_software/schedule.html">Schedule</a></li>
+
-
  </ul>
+
-
  <hr>
+
-
  <ul class="off-canvas-list">
+
-
    <li><label>Sponsors</label></li>
+
-
  </ul>
+
-
  <hr>
+
-
  <ul class="off-canvas-list">
+
-
    <li><a href="#contactus">Contact</a></li>
+
-
  </ul>
+
-
  <hr>
+
-
 
+
-
</aside>
+
-
 
+
-
 
+
-
 
+
-
<!-- -------------------------------------->
+
-
 
+
-
+
-
<nav class="tab-bar show-for-small">
+
-
  <a class="left-off-canvas-toggle menu-icon" style="line-height: 1.0625rem;">
+
-
   
+
-
    <span style="font-family:'Open Sans','Seoge UI','Ubuntu',sans-serif; font-weight:700">USTC_Software</span>
+
-
 
+
-
  </a>
+
-
</nav>
+
-
 
+
-
<nav class="top-bar hide-for-small" data-topbar>
+
-
  <ul class="title-area">
+
-
    <li class="name" >
+
-
      <h1><a href="#" style="font-family:'Open Sans','Seoge UI','Ubuntu',sans-serif; font-weight: 700;">USTC-Software</a></h1>
+
-
    </li>
+
-
  </ul>
+
-
<!-- -------------------------------------->
+
-
  <section class="top-bar-section">
+
-
    <ul class="right">
+
-
    <li class="divider"></li>
+
-
      <li>
+
-
         <a href="#" class="">Home</a>
+
-
      </li>
+
-
<!--
+
-
      <li class="divider"></li>
+
-
      <li class="has-dropdown">
+
-
        <a href="learn/features.html" class="">About</a>
+
-
        <ul class="dropdown">
+
-
            <li><a href="learn/features.html">Overall</a></li>
+
-
            <li><a href="learn/faq.html">Software</a></li>
+
-
            <li><a href="learn/faq.html">Method</a></li>
+
-
            <li><a href="learn/faq.html">Examples</a></li>
+
-
            <li><a href="learn/faq.html">Future Work</a></li>
+
-
        </ul>
+
-
      </li>
+
-
-->
+
-
      <li class="divider"></li>
+
-
      <li>
+
-
        <a href="/docs" class="">Teams</a>
+
-
      </li>
+
-
      <li class="divider"></li>
+
-
      <li>
+
-
        <a href="https://2014.igem.org/Meetups:August_USTC_software/schedule.html" class="">Schedule</a>
+
-
      </li>
+
-
    <li class="divider"></li>
+
-
      <li>
+
-
        <a href="/docs" class="">Sponsors</a>
+
-
      </li>
+
-
      <li class="divider"></li>
+
-
      <li>
+
-
        <a href="#contactus" class="">Contact</a>
+
-
      </li>
+
-
    </ul>
+
-
  </section>
+
-
 
+
-
</nav>
+
-
<div id="container">
+
-
    <div class="slide-box">
+
-
    <div class="row large-12 columns large-centered">
+
-
      <div class="orbit-container boxshadow">
+
-
       
+
-
     
+
-
      <ul data-orbit data-options="timer_speed:2500; bullets:false;">
+
-
               <li>
+
-
                <img src="http://huodong.ustc.edu.cn/Web/igem2014-website/img/slide1.jpg" />
+
-
                <div class="orbit-caption">...</div>
+
-
              </li>
+
-
              <li>
+
-
                <img src="http://huodong.ustc.edu.cn/Web/igem2014-website/img/slide5.jpg" />
+
-
                <div class="orbit-caption">Working together</div>
+
-
              </li> 
+
-
              <li>
+
-
                <img src="http://huodong.ustc.edu.cn/Web/igem2014-website/img/slide2.jpg" />
+
-
                <div class="orbit-caption">...</div>
+
-
              </li>
+
-
           
+
-
              <li>
+
-
                <img src="http://huodong.ustc.edu.cn/Web/igem2014-website/img/slide3.jpg" />
+
-
                <div class="orbit-caption">...</div>
+
-
              </li>   
+
-
        </ul>
+
-
     
+
         </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>
-
    </div>
+
        <div class="row">
-
      <div class="main-content">
+
          <div class="large-4 medium-4 small-4 columns">
-
      <div class="row large-12 columns large-centered">
+
            <div class="callout panel">
-
        <p style="font-size:32px">iGEM meets USTC-Software</p>
+
              <p>Four columns</p>
-
        <div class="underline-large"></div>
+
            </div>
-
      </div>
+
          </div>
-
      <div class="row large-12 columns large-centered">
+
          <div class="large-4 medium-4 small-4 columns">
-
        <p>The USTC Software team will organize a worldwide team meet up on August 15th, which will be held at University of Science and Technology of China and planed to last about three days. This meeting is mainly for software tracks.
+
            <div class="callout panel">
-
        </p>
+
              <p>Four columns</p>
-
        <h3>Why?</h3>
+
            </div>
-
        <div class="underline-small"></div>
+
          </div>
-
        <p>Because most of the meet-ups are among wet tracks, the meeting could be a great opportunity to enhance communication between software teams. Teams will present a brief overview of their project along with their specific summer goals, then discuss alternative ways to approach their projects, and end the meeting with brainstorming ways for the teams to collaborate on either coding or human practices. !
+
          <div class="large-4 medium-4 small-4 columns">
-
        </p>
+
            <div class="callout panel">
-
      </div>
+
              <p>Four columns</p>
-
      <div class="row">
+
            </div>
-
        <div class="large-6 columns">
+
          </div>
-
          <h3>When?</h3>
+
-
          <div class="underline-small"></div>
+
-
          <p>August 15 - August 17, 2014</p>
+
-
          <a href="https://2014.igem.org/Meetups:August_USTC_software/schedule.html">Meetup schedule</a>
+
         </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-6 columns">
+
      <div class="large-4 medium-4 columns">
-
          <h3>Where?</h3>
+
  <h5>Try one of these buttons:</h5>
-
          <div class="underline-small"></div>
+
  <p><a href="#" class="small button">Simple Button</a><br/>
-
           <ul>
+
        <a href="#" class="small radius button">Radius Button</a><br/>
-
            <li>University of Science and Technology of China</li>
+
        <a href="#" class="small round button">Round Button</a><br/>           
-
            <li>USTC-Software</li>
+
        <a href="#" class="medium success button">Success Btn</a><br/>
-
          </ul>
+
        <a href="#" class="medium alert button">Alert Btn</a><br/>
 +
        <a href="#" class="medium secondary button">Secondary Btn</a></p>            
 +
<div class="panel">
 +
        <h5>So many components, girl!</h5>
 +
        <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>
 +
        <a href="http://foundation.zurb.com/docs/" class="small button">Go to Foundation Docs</a>        
         </div>
         </div>
-
 
-
 
       </div>
       </div>
-
      <div class="row">
 
-
      <div class="large-12 columns large-centered">       
 
-
          <h3>Who?</h3>       
 
-
          <div class="underline-small"></div>     
 
-
          <p>Members from iGEM teams will attend our meetup </p>
 
-
      </div>
 
-
      </div>
 
-
 
-
      <div class="row">
 
-
      <div class="large-12 columns large-centered">       
 
-
          <h3>Notice</h3>       
 
-
          <div class="underline-small"></div>     
 
-
          <ol>
 
-
            <li>It’s suggested that arriving at hotel on Aug. 14 (the day before meetup start)</li>
 
-
            <li>You needn’t pay fee to us but your accommodation issues need to be resolved by yourself.</li>
 
-
            <li>If you are not familiar with Hefei, we can book hotel for you. If you need that, please email us</li>
 
-
            <li>If you wanna join us, please register by sending email to us, which have information about:
 
-
                <ul>
 
-
                  <li>Team Name</li>
 
-
                  <li>Primary Contact in this Meetup</li>
 
-
                  <li>How many people will come</li>
 
-
                  <li>A whole team photo</li>
 
-
                  <li>A brief of your college and your team</li>
 
-
                  <li>Need we book a hotel for you?</li>
 
-
                </ul>
 
-
            </li>
 
-
            <li>Please prepare the presentation about your project in both Chinese and English (if you are a foreigner team, you don’t need prepare Chinese version)</li>
 
-
            <li>To be continued…</li>
 
-
          </ol>
 
-
      </div>
 
-
      </div>
 
-
 
-
      <div class="row">
 
-
      <div class="large-12 columns large-centered">       
 
-
          <h3>About us</h3>       
 
-
          <div class="underline-small"></div>     
 
-
          <p>Consists of 17 highly motivated undergraduates who are from different fields and highly interested in programming and synthetic biology, we, the iGEM team of USTC, are coming for this year's competition! We are advised by three experienced professors, Prof. Hong Jiong, Prof. Liu Haiyan and Prof. Jin Fan. We are looking forward to this meet up and the Jamboree that follows.</p>
 
-
      </div>
 
-
      </div>
 
-
 
-
      <div class="row">
 
-
      <div class="large-12 columns large-centered">       
 
-
          <h3 id="contactus">Contact us</h3>       
 
-
          <div class="underline-small"></div>     
 
-
          <p>
 
-
            <ul>
 
-
            <li>
 
-
                <b>Team Leader:</b> Xue Yuechuan
 
-
                &nbsp;&nbsp;&nbsp;
 
-
                <b>Email: </b><a href="mailto:xueyuechuan@gmail.com">xueyuechuan@gmail.com</a><br/>
 
-
            </li>
 
-
           
 
-
            <li>
 
-
              <b>Team Vice-leader:</b>Zhao Shensen
 
-
              &nbsp;&nbsp;&nbsp;
 
-
              <b>Email: </b><a href="mailto:xueyuechuan@gmail.com">beibeihome88@gmail.com</a>
 
-
            </li>
 
-
            <li><b>Group Email: </b>
 
-
              <a href="https://groups.google.com/forum/#!forum/ustc-software-2014">ustc-software-2014@googlegroups.com
 
-
              </a>
 
-
            </li>
 
-
          </ul>
 
-
           
 
-
           
 
-
           
 
-
           
 
-
           
 
-
          </p>
 
-
      </div>
 
-
      </div>
 
-
   
 
     </div>
     </div>
-
</div>
+
      
-
 
+
     <script src="js/vendor/jquery.js"></script>
-
<div class="ltx-footer-bottom">
+
     <script src="js/foundation.min.js"></script>
-
<div class="row" >
+
-
  <div class="medium-4 medium-4 push-8 columns">
+
-
     <ul class="home-social">
+
-
    <li><a href="http://www.twitter.com/USTC-Software" class="twitter"></a></li>
+
-
    <li><a href="http://www.facebook.com/USTC-Software" class="facebook"></a></li>
+
-
    <li><a href="#contactus" class="mail"></a></li>
+
-
    </ul>
+
-
  </div>
+
-
  <div class="medium-8 medium-8 pull-4 columns">
+
-
    <span style="color:#bbb;margin: 0 auto;">
+
-
      <span style="font-family:'Open Sans','Seoge UI','Ubuntu',sans-serif; font-size:32px; font-weight:400">USTC-Software
+
-
      </span>
+
-
      <span style="font-family:'Open Sans','Seoge UI','Ubuntu',sans-serif; font-size:32px; font-weight:100">@USTC</span>
+
-
    </span>
+
-
 
+
-
    <ul class="ltx-links">
+
-
    <li><a href="#contactus">Contact</a></li>
+
-
    <li><a href="/sitemap">Sitemap</a></li>
+
-
    </ul>
+
-
    <p class="copyright">© 2014 USTC-Software,University of Science and Technology of China. All rights reserved.</p>
+
-
  </div>
+
-
</div>
+
-
</div>
+
-
 
+
-
 
+
-
 
+
-
     <script src="http://huodong.ustc.edu.cn/Web/igem2014-website/js/vendor/jquery.js"></script>
+
-
     <script src="http://huodong.ustc.edu.cn/Web/igem2014-website/js/foundation.min.js"></script>
+
     <script>
     <script>
       $(document).foundation();
       $(document).foundation();
     </script>
     </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');
 
-
 
-
  ga('create', 'UA-35866682-3', 'igem.org');
 
-
  ga('send', 'pageview');
 
-
 
-
</script>
 
   </body>
   </body>
</html>
</html>

Revision as of 03:02, 5 July 2014

<!doctype html> Foundation | Welcome

Welcome to Foundation

We’re stoked you want to try Foundation!

To get going, this file (index.html) includes some basic styles you can modify, play around with, or totally destroy to get going.

Once you've exhausted the fun in this document, you should check out:

Foundation Documentation
Everything you need to know about using the framework.

Foundation on Github
Latest code, issue reports, feature requests and more.

@foundationzurb
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).

Here’s your basic grid:

This is a twelve column section in a row. 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.

Six columns

Six columns

Four columns

Four columns

Four columns


We bet you’ll need a form somewhere:
.com
Try one of these buttons:

Simple Button
Radius Button
Round Button
Success Btn
Alert Btn
Secondary Btn

So many components, girl!

A whole kitchen sink of goodies comes with Foundation. Checkout the docs to see them all, along with details on making them your own.

Go to Foundation Docs