Difference between revisions of "Team:USTC/Spin off"

(Created page with "<html> <body> <p>In this section, we will introduce a simple calculator with a GUI when processing our experimental data. The main function of the calculator is helping us to...")
 
 
(4 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
<body>
+
  <head>
 
+
    <meta charset="utf-8">
<p>In this section, we will introduce a simple calculator with a GUI when processing our experimental data. The main function of the calculator is helping us to design the system of enzyme digestion. </p>
+
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
<p>You can find the README here:</p>
+
    <title>Modeling</title>
<p>or you can download the calculator here:</p>  
+
    <!--<link rel="stylesheet" type="text/css" class="ui" href="semantic.min.css">-->
 
+
    <link rel="stylesheet" type="text/css" href="https://2016.igem.org/Template:USTC/semantics?action=raw&ctype=text/css">
</body>
+
    <style>
</html>
+
    /********************Dealing with default Mediawiki setting*******************/
 +
    #top_title {
 +
    display:none;
 +
    position:absolute;
 +
    }
 +
    #content {
 +
    padding:0px; width:auto; margin-top:-11px; margin-left:0px;
 +
    }
 +
    #globalWrapper{
 +
    }
 +
    body {
 +
    }
 +
    #bodyContent {
 +
    }
 +
    div#top_menu_14{
 +
    height:21px;
 +
    border-bottom-color:#383838;
 +
    }
 +
    div#top_menu_under{
 +
   
 +
    }
 +
    div#globalWrapper{
 +
    padding-bottom: 0;
 +
    }
 +
    #top_menu_under{
 +
    height:0;
 +
    }
 +
    #sideMenu{
 +
    display:none;
 +
    position:fixed;
 +
    left:220px;
 +
    }
 +
    /******************************************************************************/
 +
    </style>
 +
    <style>
 +
    div.ui.inverted.vertical.sticky.basic.menu a.item{
 +
    -webkit-transition: background-color 0.6s , color 0.6s;
 +
    }
 +
    div.ui.inverted.vertical.sticky.basic.menu a.item:hover{
 +
    background-color: #FFFA99;
 +
    color:#6E47B2;
 +
    }
 +
    p{
 +
    font-family: 'Lato'!important;
 +
    font-size:16px !important;
 +
    line-height: 150%;
 +
    }
 +
    </style>
 +
   
 +
    <!--For multiple devices-->
 +
    <style>
 +
    @media only screen
 +
    and (min-width: 1025px){
 +
    div#menuForTablet{
 +
    display:none;
 +
    }
 +
    div#main_page_content{
 +
    margin-top:-13px;
 +
    left:210px;
 +
    max-width: 1070px;
 +
    }
 +
    #ui_article{
 +
    width:64%;
 +
    }
 +
    }
 +
    @media only screen
 +
    and (max-width : 1024px)
 +
    and (orientation : landscape) {
 +
    div#main_page_content{
 +
    margin-top:40px;
 +
    }
 +
    div#menuForComputer{
 +
    display:none;
 +
    width:0;
 +
    height:0;
 +
    }
 +
    #ui_article{
 +
    width:63%;
 +
    }
 +
    }
 +
    @media only screen
 +
    and (max-width : 1024px)
 +
    and (orientation : portrait) {
 +
    div#main_page_content{
 +
    margin-top:40px;
 +
    }
 +
    div#menuForComputer{
 +
    display:none;
 +
    width:0;
 +
    height:0;
 +
    }
 +
    #ui_article{
 +
    width:63%;
 +
    }
 +
    }
 +
    </style>
 +
  </head>
 +
 
 +
 
 +
  <body>
 +
   
 +
    <div class="ui inverted vertical sidebar basic menu" style="border-radius:0; background-color: #44a17d; padding-top:9px;font-size:medium;">
 +
      <div class="item">
 +
        <img class="ui image" src="https://static.igem.org/mediawiki/2016/3/36/T--USTC--a_prion%27s_life.png">
 +
      </div>
 +
      <a class="item" href="https://2016.igem.org/Team:USTC">Home </a>
 +
      <div class="item">
 +
        <div class="header">Project</div>
 +
        <div class="menu">
 +
          <a class="item" id="Description" href="https://2016.igem.org/Team:USTC/Description"> Description </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Design"> Design </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Proof"> Proof of Concept </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Demonstrate"> Demonstrate </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Results"> Results </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Notebook"> Notebook </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Spin_off"> Spin-off </a>
 +
        </div>
 +
      </div>
 +
      <div class="item">
 +
        <div class="header">Parts</div>
 +
        <div class="menu">
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Basic_Part"> Basic Parts </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Composite_Part"> Composite Parts </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Part_Collection"> Part Collection </a>
 +
        </div>
 +
      </div>
 +
      <a class="item" href="https://2016.igem.org/Team:USTC/Safety">Safety </a>
 +
      <a class="item" href="https://2016.igem.org/Team:USTC/Attributions">Attributions </a>
 +
      <div class="item">
 +
        <div class="header">Human Practices</div>
 +
        <div class="menu">
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/HP/Silver">Silver </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/HP/Gold">Gold </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Integrated_Practices"> Integrated Practices </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Engagement">Engagement </a>
 +
        </div>
 +
      </div>
 +
      <div class="item">
 +
        <div class="header">Awards</div>
 +
        <div class="menu">
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Model"> Model </a>
 +
        </div>
 +
      </div>
 +
      <div class="item">
 +
        <div class="header">Team</div>
 +
        <div class="menu">
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Team"> Members  </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Team/Sponsor"> Sponsor  </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Team/AboutUSTC"> About USTC  </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Team/Acknowledgements"> Acknowledgements  </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Team/Gallery"> Gallery  </a>
 +
          <a class="item" href="https://2016.igem.org/Team:USTC/Collaborations"> Collaborations </a>
 +
        </div>
 +
      </div>
 +
    </div>
 +
   
 +
   
 +
    <div class="pusher">
 +
      <div class="ui menu top fixed" id="menuForTablet" style="background-color: #FBBD08; top:21px;">
 +
        <div class="ui fluid container">
 +
          <a class="item" id="sidebarMenuTrigger">Navigation<i class="right arrow icon"></i></a>
 +
          <div class="right item">A Prion's Life</div>
 +
        </div>
 +
      </div>
 +
      <div class="ui basic segment" id="main_page_content" style="margin-bottom:0;padding:0 0 20px 0;">
 +
        <div class="ui left attached rail" id="menuForComputer" style=" width:210px;">
 +
          <div class="ui inverted vertical sticky basic menu" style="border-radius:0; background-color: #44a17d; padding-top:9px;font-size:medium;">
 +
            <div class="item">
 +
              <img class="ui image" src="https://static.igem.org/mediawiki/2016/3/36/T--USTC--a_prion%27s_life.png">
 +
            </div>
 +
            <a class="item" href="https://2016.igem.org/Team:USTC">Home </a>
 +
            <div class="item">
 +
              <div class="header">Project</div>
 +
              <div class="menu">
 +
                <a class="item" id="Description" href="https://2016.igem.org/Team:USTC/Description"> Description </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Design"> Design </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Proof"> Proof of Concept </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Demonstrate"> Demonstrate </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Results"> Results </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Notebook"> Notebook </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Spin_off"> Spin-off </a>
 +
              </div>
 +
            </div>
 +
            <div class="item">
 +
              <div class="header">Parts</div>
 +
              <div class="menu">
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Basic_Part"> Basic Parts </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Composite_Part"> Composite Parts </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Part_Collection"> Part Collection </a>
 +
              </div>
 +
            </div>
 +
            <a class="item" href="https://2016.igem.org/Team:USTC/Safety">Safety </a>
 +
            <a class="item" href="https://2016.igem.org/Team:USTC/Attributions">Attributions </a>
 +
            <div class="item">
 +
              <div class="header">Human Practices</div>
 +
              <div class="menu">
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/HP/Silver">Silver </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/HP/Gold">Gold </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Integrated_Practices"> Integrated Practices </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Engagement">Engagement </a>
 +
              </div>
 +
            </div>
 +
            <div class="item">
 +
              <div class="header">Awards</div>
 +
              <div class="menu">
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Model"> Model </a>
 +
              </div>
 +
            </div>
 +
            <div class="item">
 +
              <div class="header">Team</div>
 +
              <div class="menu">
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Team"> Members  </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Team/Sponsor"> Sponsor  </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Team/AboutUSTC"> About USTC  </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Team/Acknowledgements"> Acknowledgements  </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Team/Gallery"> Gallery  </a>
 +
                <a class="item" href="https://2016.igem.org/Team:USTC/Collaborations"> Collaborations </a>
 +
              </div>
 +
            </div>
 +
          </div>
 +
        </div>
 +
       
 +
        <!--Page content starts here-->
 +
        <div class="ui basic segment">
 +
          <div class="ui basic segment" style="padding-top: 20px; font-size:xx-large;">
 +
            <h1 class="ui center aligned icon header">
 +
            <i class="circular add user icon"></i>
 +
            <div class="content">Spin-off
 +
              <div class="sub header">Surprise!!!</div>
 +
            </div>
 +
            </h1>
 +
          </div>
 +
          <div class="ui basic segment">
 +
            <h3 class="ui center aligned header">Leader</h3>
 +
            <div class="ui three column grid">
 +
              <div class="column"></div>
 +
              <div class="column">
 +
                <div class="ui fluid card">
 +
                  <div class="image">
 +
                    <img src="https://static.igem.org/mediawiki/2016/c/cc/T--USTC--WenkaiHan.jpeg">
 +
                  </div>
 +
                  <div class="content">
 +
                    <div class="description">Wenkai Han</div>
 +
                  </div>
 +
                </div>
 +
              </div>
 +
              <div class="column"></div>
 +
            </div>
 +
          </div>
 +
        </div>
 +
        <div class="ui segment" id="ui_article" style="min-height:600px; margin-left: 35px;margin-top:30px;">
 +
          <div class="ui orange ribbon label header">Spin-off</div>
 +
          <p>In this section, we will introduce a simple calculator with a GUI when processing our experimental data. The main function of the calculator is helping us to design the system of enzyme digestion.</p>
 +
          <p>You can find the README here:<a href="https://2016.igem.org/File:README.txt">README</a></p>
 +
          <p>or you can download the calculator here:<a href="https://2016.igem.org/File:Deda-spin_off.zip">D.E.D.A</a></p>
 +
        </div>
 +
        </div><!--End of ui basic segment id="main_page_content"-->
 +
       
 +
        <div style="background-color:#44a17d; color:rgba(255, 255, 255, 0.9);">
 +
          <div class="ui grid">
 +
           
 +
            <div class="ui three wide column">
 +
            </div>
 +
            <div class="ui five wide column">
 +
              <h3 class="ui header" style="color:rgba(255, 255, 255, 0.9);">Contact us</h3>
 +
              <div class="ui massive link list" style="color:rgba(255, 255, 255, 0.9);">
 +
                <a class="item" href="mailto:yukae@mail.ustc.edu.cn">
 +
                  <i class="mail icon" style="color:rgba(255, 255, 255, 0.9);"></i>
 +
                  <div class="content" style="color:rgba(255, 255, 255, 0.9);">e-mail</div>
 +
                </a>
 +
                <a class="item" href="https://www.facebook.com/ustcigem">
 +
                  <i class="facebook icon" style="color:rgba(255, 255, 255, 0.9);"></i>
 +
                  <div class="content" style="color:rgba(255, 255, 255, 0.9);">Facebook</div>
 +
                </a>
 +
                <a class="item" href="http://weibo.com/3929719655/fans?topnav=1&amp;wvr=6&amp;mod=message&amp;need_filter=1">
 +
                  <i class="weibo icon" style="color:rgba(255, 255, 255, 0.9);"></i>
 +
                  <div class="content" style="color:rgba(255, 255, 255, 0.9);">Weibo</div>
 +
                </a>
 +
              </div>
 +
            </div>
 +
            <div class="ui two wide column">
 +
            </div>
 +
            <div class="ui five wide column">
 +
              <h3 class="ui header" style="color:rgba(255, 255, 255, 0.9);">Sponsors</h3>
 +
              <img class="ui small image" src="https://static.igem.org/mediawiki/2016/c/cc/T--USTC--DeutscheBank.png">
 +
              <img class="ui small image" src="https://static.igem.org/mediawiki/2016/1/18/T--USTC--USTCXiaohui.png">
 +
              <img class="ui small image" src="https://static.igem.org/mediawiki/2016/4/45/T--USTC--USTCJiaowuchu.png">
 +
            </div>
 +
           
 +
          </div>
 +
          <div class="ui divider"></div>
 +
          <div class="center aligned container">
 +
            <img class="ui centered tiny image" src="https://static.igem.org/mediawiki/2016/6/6b/T--USTC--MascotLogo.png">
 +
            <div class="ui list">
 +
              <div class="item">Designed by 2016 iGEM Team:USTC<br>Under CC License<br>Based on Semantic-UI</div>
 +
            </div>
 +
          </div>
 +
         
 +
        </div>
 +
        </div><!--end of pusher-->
 +
        <script src="https://2015.igem.org/common/MathJax-2.5-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
 +
        <script type="text/javascript" src="https://2016.igem.org/Template:USTC/semanticsjs?action=raw&ctype=text/javascript"></script>
 +
        <script type="text/javascript" src="https://2016.igem.org/Template:USTC/SpinOff_right_menu_js?action=raw&ctype=text/javascript"></script>
 +
        <script type="text/javascript">
 +
        </script>
 +
        <script>
 +
        $(document).ready(function(){
 +
        $('.ui.sticky.basic.menu').sticky({
 +
        context: '#main_page_content'
 +
        });
 +
        $("a.item#Description").mouseenter(function(){
 +
        $(".sticky.note.outline.icon").transition({
 +
        animation : 'fly right',
 +
        duration : '0.5s'
 +
        });
 +
        });
 +
        $("a.item#Description").mouseleave(function(){
 +
        $(".sticky.note.outline.icon").transition({
 +
        animation : 'fly right',
 +
        duration : '0.5s'
 +
        });
 +
        //$(this).css({"background-color":"inherit","color":"inherit"});
 +
        });
 +
        $container.find('img').css('max-width','100%');
 +
        createMenu();
 +
        });//End of $(document).ready(function())
 +
       
 +
        $(window).load(function(){
 +
        createWayPoints();
 +
        $("div.pusher").prependTo("body");
 +
        $("div.sidebar").prependTo("body");
 +
        $("div#sideMenu").prependTo("div.pusher");
 +
        $("#ui_article").find("span").css("border-style","none");
 +
        });
 +
        $("#sidebarMenuTrigger").click(function(){
 +
        $(".ui.sidebar.menu")
 +
        .sidebar('setting', 'transition', 'overlay')
 +
        .sidebar('setting', 'mobileTransition', 'overlay')
 +
        .sidebar('toggle');
 +
        });
 +
        </script>
 +
      </body>
 +
    </html>

Latest revision as of 17:16, 19 October 2016

Modeling

Spin-off
Surprise!!!

Leader

Wenkai Han
Spin-off

In this section, we will introduce a simple calculator with a GUI when processing our experimental data. The main function of the calculator is helping us to design the system of enzyme digestion.

You can find the README here:README

or you can download the calculator here:D.E.D.A

Sponsors

Designed by 2016 iGEM Team:USTC
Under CC License
Based on Semantic-UI