Difference between revisions of "Team:Tongji-Software"

 
(142 intermediate revisions by 4 users not shown)
Line 1: Line 1:
<!DOCTYPE html>
+
<html>
<html lang="en">
+
</script>
<head>
+
 
    <meta charset="UTF-8">
+
 
    <title>sideBar demo</title>
+
<style>
    <link rel="stylesheet" href="https://2018.igem.org/wiki/index.php?title=Template:Tongji-Software//lib/T--Tongji-Software--sidebar.css&action=raw&ctype=text/css">
+
/**************************************************************************************************************************************************************************************************/
    <link rel="stylesheet" href="bootstrap/dist/css/bootstrap.css">
+
 
    <link rel="stylesheet" href="bootstrap/dist/css/bootstrap-theme.css">
+
 
</head>
+
 
 +
/**************************************************************************************************************************************************************************************************/
 +
/* DEFAULT WIKI SETTINGS */
 +
/**************************************************************************************************************************************************************************************************/
 +
 
 +
#home_logo, #sideMenu { display:none; }
 +
#sideMenu, #top_title, .patrollink  {display:none;}
 +
#content { margin-left:0px; margin-top:-7px; padding:0px; width:100%;}
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 +
 
 +
.judges-will-not-evaluate { border: 4px solid #e4dede; padding: 2% !important; width: 92%!important;}
 +
 
 +
body{
 +
  margin: 0;
 +
  background-color:#fff8e9;
 +
  color : #826767;
 +
  font-family: 'Khmer MN';
 +
}
 +
#contact h3{
 +
font-family: 'Khmer MN';
 +
}
 +
@font-face {
 +
  font-family: 'Khmer MN';
 +
src: url('Khmer MN.eot');
 +
src: local('Khmer MN Regular'), 
 +
    local('Khmer MN'),     
 +
      url('Khmer MN.woff') format('woff'),     
 +
    url('Khmer MN.ttf') format('truetype'), 
 +
      url('Khmer MN.svg#Khmer MN') format('svg');
 +
}
 +
.background{
 +
position:fixed;
 +
top:-200px;
 +
z-index: -1;
 +
opacity: 0.8;
 +
}
 +
 
 +
.big hr{
 +
color:#826767;
 +
width:60%;
 +
margin:10px auto;
 +
border: 0;
 +
height: 0;
 +
border-top:1px solid  #826767;
 +
border-bottom: 0.5px solid #826767;
 +
}
 +
#contact hr{
 +
color:#826767;
 +
width:60%;
 +
margin:10px auto;
 +
border: 0;
 +
height: 0;
 +
border-top:1px solid  #826767;
 +
border-bottom: 0.5px solid #826767;
 +
}
 +
.big{
 +
  position: absolute;
 +
  display: block;
 +
  box-shadow: 3px 3px 3px rgba(0,0,0,0.4);
 +
  transition:0.4s;
 +
}
 +
.big :hover{
 +
/*position: absolute;*/
 +
/* display: block;
 +
  box-shadow: 3px 3px 3px rgba(0,0,0,0.4);*/
 +
  transition:0.4s;
 +
  transform:scale(1.2);
 +
}
 +
 
 +
.big a{
 +
  position: relative;
 +
  display: block;
 +
  text-align: center;
 +
  vertical-align: baseline;
 +
  top: 50%;
 +
  cursor: pointer;
 +
  text-decoration: none;
 +
  color: #4c4040;
 +
  transition:0.4s;
 +
  margin-top:-10px;
 +
  font-size: 20px;
 +
}
 +
 
 +
.small{
 +
  position: absolute;
 +
  display: block;
 +
  box-shadow: 3px 3px 3px rgba(0,0,0,0.4);
 +
  height: 75px;
 +
  width: 75px;
 +
}
 +
.small span{
 +
  position: relative;
 +
  display: block;
 +
  text-align: center;
 +
  vertical-align: baseline;
 +
  top: 9px;
 +
  font-size: 42px;
 +
}
 +
 
 +
#logo{
 +
  background:#ffb6bc;
 +
  height: 180px;
 +
  width: 180px;
 +
  left: 0px;
 +
  top: 0px;
 +
  z-index: 99;
 +
}
 +
#logo a{
 +
  position: relative;
 +
  top:30px;
 +
left:0px;
 +
  padding-left: 15px;
 +
  padding-top: 0px;
 +
}
 +
 
 +
#logo a:hover{
 +
  transform:scale(1.2);
 +
  transition:0.4s;
 +
}
 +
 
 +
 
 +
#igem{
 +
  background:#aadffa;
 +
  height: 90px;
 +
  width: 270px;
 +
  left: 180px;
 +
  top: 0px;
 +
  font-weight: bold;
 +
  z-index: 98;
 +
}
 +
#igem a{
 +
  letter-spacing: 3px;
 +
  font-size: 16px;
 +
}
 +
#tj{
 +
  background:#ffe389;
 +
  height:90px;
 +
  width: 360px;
 +
  left: 180px;
 +
  top: 90px;
 +
  font-weight: bold;
 +
  z-index: 97;
 +
}
 +
#tj a{
 +
  margin-top: -15px;
 +
  font-size: 24px;
 +
  font-weight:bold;
 +
  letter-spacing: 2px;
 +
}
 +
#a{
 +
  background:#ffe389;
 +
  left: 375px;
 +
  top: 0px;
 +
  font-weight: bold;
 +
  z-index:96;
 +
  color: #f4c84d;
 +
}
 +
#l{
 +
  background:#aadffa;
 +
  left: 375px;
 +
  top: 75px;
 +
  font-weight: bold;
 +
  z-index:95;
 +
  color: #7cc9e8;
 +
}
 +
 
 +
 
 +
#project{
 +
  background:#aadffa;
 +
  height: 90px;
 +
  width: 270px;
 +
  left: 0px;
 +
  top: 180px;
 +
  font-weight: bold;
 +
  z-index: 94;
 +
}
 +
#project a{
 +
  font-size: 23px;
 +
  margin-top: -14px;
 +
  }
 +
#p{
 +
  background:#ffb6bc;
 +
  left: 150px;
 +
  top: 150px;
 +
  font-weight: bold;
 +
  z-index:93;
 +
  color: #f4929e;
 +
}
 +
#h{
 +
  background:#aadffa;
 +
  left: 150px;
 +
  top: 225px;
 +
  font-weight: bold;
 +
  z-index:92;
 +
  color: #7cc9e8;
 +
}
 +
 
 +
#medal{
 +
  background:#ffb6bc;
 +
  height: 180px;
 +
  width: 225px;
 +
  left: 270px;
 +
  top: 180px;
 +
  font-weight: bold;
 +
  z-index: 91;
 +
}
 +
#medal a{
 +
  font-size: 20px;
 +
  margin-top: -60px;
 +
  margin-bottom: 110px;
 +
}
 +
 
 +
 
 +
#notebook{
 +
  background:#ffe389;
 +
  height: 90px;
 +
  width: 270px;
 +
  left: 0px;
 +
  top: 270px;
 +
  font-weight:normal;
 +
  z-index: 92;
 +
}
 +
#aa{
 +
  background:#ffb6bc;
 +
  left: 225px;
 +
  top: 300px;
 +
  font-weight: bold;
 +
  z-index:89;
 +
  color: #f4929e;
 +
}
 +
 
 +
#human{
 +
  background:#aadffa;
 +
  height: 90px;
 +
  width: 315px;
 +
  left: 0px;
 +
  top: 360px;
 +
  font-weight: bold;
 +
  z-index: 88;
 +
}
 +
#collaborations{
 +
  background:#ffe389;
 +
  height: 90px;
 +
  width: 270px;
 +
  left: 315px;
 +
  top: 360px;
 +
  /*font-weight: bold;*/
 +
  z-index: 87;
 +
}
 +
#aaa{
 +
  background:#ffb6bc;
 +
  left: 450px;
 +
  top: 375px;
 +
  font-weight: bold;
 +
  z-index:86;
 +
  color: #f4929e;
 +
}
 +
 
 +
#modeling{
 +
  background:#ffb6bc;
 +
  height: 180px;
 +
  width: 405px;
 +
  left: 0px;
 +
  top: 450px;
 +
/*  font-weight: bold;*/
 +
  z-index: 85;
 +
}
 +
#modeling a{
 +
  font-size: 23px;
 +
  letter-spacing: 2px;
 +
  margin-top: -65px;
 +
  margin-bottom: 110px;
 +
}
 +
#n{
 +
  background:#ffe389;
 +
  left: 375px;
 +
  top: 450px;
 +
  font-weight: bold;
 +
  z-index:84;
 +
  color: #f4c84d;
 +
}
 +
#t{
 +
  background:#ffb6bc;
 +
  left: 375px;
 +
  top: 525px;
 +
  font-weight: bold;
 +
  z-index:83;
 +
  color: #f4929e;
 +
}
 +
 
 +
.bottom{
 +
  position: absolute;
 +
  display: block;
 +
  top: 500px;
 +
  width: 790px;
 +
  left:550px;
 +
  font-size: 19px;
 +
  font-weight: bold;
 +
}
 +
.bottom span{
 +
line-height:29px;
 +
color : #5b3d3d;
 +
word-spacing: 2px;
 +
}
 +
 
 +
.bottom a{
 +
font-size:32px;
 +
color:#e5838f;
 +
}
 +
 
 +
#contact{
 +
  position: absolute;
 +
  top:660px;
 +
  left:60px;
 +
  border-radius: 15px;
 +
  width: 90%;
 +
  height:auto;
 +
  background:rgba(255,255,255,0.4);
 +
/* border: 2.5px solid rgba(0,0,0,0.7);*/
 +
  z-index: 5;
 +
  text-align: center;
 +
  display: block;
 +
  margin-bottom: 100px;
 +
}
 +
 
 +
#contact h3{
 +
  font-size: 22px;
 +
  margin-top:35px;
 +
  margin-bottom:10px;
 +
  color : #5b3d3d;
 +
}
 +
 
 +
#contact span{
 +
  margin-top: 15px;
 +
  font-size: 19px;
 +
  color : #826767;
 +
}
 +
 
 +
#contact img{
 +
  margin-top: 10px;
 +
  transition: all 0.4s;
 +
  margin-bottom: 30px;
 +
}
 +
 
 +
#contact img:hover{
 +
  transform: scale(1.15);
 +
  transition: all 0.4s;
 +
}
 +
 
 +
.ant {
 +
  position: absolute;
 +
  top:620px;
 +
  left:990px;
 +
  z-index: 9;
 +
  transform: rotate(-90deg);
 +
}
 +
.video{
 +
  position: absolute;
 +
  left:0px;
 +
  top:0px;
 +
}
 +
 
 +
 
 +
</style>
 +
 
 +
 
 +
 
 
<body>
 
<body>
    <div id = "sidebar">
+
<div class="background">
        <ul>
+
    <img src="https://static.igem.org/mediawiki/2018/5/57/T--Tongji-Software--background.png" width="100%" >
            <li id="prof" class="item">
+
</div>
                <span class="glyphicon glyphicon-user"></span>
+
  <div id="logo" class="big">  
                <div>我</div>
+
  <a href="http://118.31.56.237:8099/Alpha%20ant/"><img src="https://static.igem.org/mediawiki/2018/9/9d/T--Tongji-Software--logo4.png" width="80%"></a>
            </li>
+
</div>
            <li id="asset" class="item">
+
<div id="igem" class="big">
                <span class="glyphicon glyphicon-user"></span>
+
<a href="">2018 iGEM</a>
                <div>资产</div>
+
</div>
            </li>
+
<div id="tj" class="big">
            <li id="brand" class="item">
+
<a href="">Tongji-Software</a>
                <span class="glyphicon glyphicon-user"></span>
+
</div>
                <div>商品</div>
+
<div id="project" class="big">
            </li>
+
<a href="https://2018.igem.org/Team:Tongji-Software/Project"><b>PROJECT</b></a>
            <li id="foot" class="item">
+
</div>
                <span class="glyphicon glyphicon-user"></span>
+
<div id="medal" class="big">
                <div>足迹</div>
+
<a href="https://2018.igem.org/Team:Tongji-Software/Model">MODEL</a>
            </li>
+
<hr/>
            <li id="calender" class="item">
+
<a href="https://2018.igem.org/Team:Tongji-Software/Team">TEAM</a>
                <span class="glyphicon glyphicon-user"></span>
+
</div>
                <div>日历</div>
+
<div id="human" class="big">
            </li>
+
<a href="https://2018.igem.org/Team:Tongji-Software/Human_Practices">HUMAN PRACTICES</a>
        </ul>
+
</div>
        <div id="closeBar">
+
<div id="collaborations" class="big">
            <span class="glyphicon glyphicon-remove"></span>
+
<a href="https://2018.igem.org/Team:Tongji-Software/Collaborations">COLLABORATIONS</a>
        </div>
+
</div>
    </div>
+
<div id="notebook" class="big">
    <div class="nav-content" id="prof-content">
+
<a href="https://2018.igem.org/Team:Tongji-Software/Requirements">REQUIRMENTS</a>
        <div class="nav-con-close">
+
</div>
            <span class="glyphicon glyphicon-chevron-left"></span>
+
 
        </div>
+
<div id="modeling" class="big">
        <div></div>
+
        <a href="https://2018.igem.org/Team:Tongji-Software/Medal">MEDAL</a>
    </div>
+
         <hr/>
    <div class="nav-content" id="asset-content">
+
<a href="https://2018.igem.org/Team:Tongji-Software/Attributions">ATTRIBUTIONS</a>
        <div class="nav-con-close">
+
</div>
            <span class="glyphicon glyphicon-chevron-left"></span>
+
 
         </div>
+
 
        <div>资产</div>
+
<div class="video">
    </div>
+
<video  muted  src="https://static.igem.org/mediawiki/2018/archive/a/ad/20181016164940%21T--Tongji-Software--background-video2.mp4" type="video/mp4"width="100%" height="auto" autoplay="autoplay"  loop="loop">  
    <div class="nav-content" id="brand-content">
+
</video>
        <div class="nav-con-close">
+
</div>
            <span class="glyphicon glyphicon-chevron-left"></span>
+
<div class="bottom">
        </div>
+
<span><font style="font-size:37px">Alpha ant</font> is a computational tool for <b>pathway design</b> and <b>reconstruction</b>. With full consideration of metabolic burden and some useful functions, we provide an efficient and powerful pathway design guide.</br><a href="http://118.31.56.237:8099/Alpha%20ant/">Click HERE to use!</a></span>
        <div>商标</div>
+
</div>
    </div>
+
<div id="contact">
    <div class="nav-content" id="foot-content">
+
<h3>CONTACT</h3>
        <div class="nav-con-close">
+
<span>annecao@tongji.edu.cn</span><hr/>
            <span class="glyphicon glyphicon-chevron-left"></span>
+
<h3>ADDRESS</h3>  
        </div>
+
<span>1239# Siping Road</br>Tongji University,Shanghai China</span><hr/>
        <div>足迹</div>
+
<h3>GET IN TOUCH</h3>
    </div>
+
<a href="https://www.facebook.com/tongjiIGEMer/?ref=bookmarks"><img src="https://static.igem.org/mediawiki/2018/8/8c/T--Tongji-Software--facebook.png" width="5%"></a>
    <div class="nav-content" id="calender-content">
+
</div>
        <div class="nav-con-close">
+
<img class="ant" src="https://static.igem.org/mediawiki/2018/d/de/T--Tongji-Software--ant2.png" width="8%">
            <span class="glyphicon glyphicon-chevron-left"></span>
+
 
        </div>
+
        <div>日历</div>
+
    </div>
+
    <script src="https://2018.igem.org/wiki/index.php?title=Template:Tongji-Software//lib/T--Tongji-Software--sidebar.js&action=raw&ctype=text/javascript"></script>
+
 
</body>
 
</body>
</html>
 

Latest revision as of 02:56, 18 October 2018

Alpha ant is a computational tool for pathway design and reconstruction. With full consideration of metabolic burden and some useful functions, we provide an efficient and powerful pathway design guide.
Click HERE to use!

CONTACT

annecao@tongji.edu.cn

ADDRESS

1239# Siping Road
Tongji University,Shanghai China

GET IN TOUCH