Difference between revisions of "Team:Kyoto"

(Undo revision 388926 by Johnny06 (talk))
 
Line 3: Line 3:
  
 
<style>
 
<style>
−
 
  
 
   #background{
 
   #background{
−
     position:fixed;
+
     background-image: url(https://static.igem.org/mediawiki/2016/c/cd/T--Kyoto--Norovirus.jpg);
−
     min-width: 1024px;
+
     background-position: center center;
−
     width:100%;
+
     background-repeat: no-repeat;
−
    z-index:-1;
+
    background-attachment: fixed;
−
  }
+
     background-size: cover;
−
  #background-image{
+
−
    width:100%;
+
−
  }
+
−
  #topbanner-wrapper{
+
−
     min-width:1024px;
+
−
    position:relative;
+
 
   }
 
   }
 
   #topbanner{
 
   #topbanner{
−
    position:absolute;
+
     width: 1024px;
−
     width: 565px;
+
 
     height: 105px;
 
     height: 105px;
−
    top:0;
+
     margin: 112px auto 113px;
−
    bottom:0;
+
     background-image: url(https://static.igem.org/mediawiki/2016/5/5a/T--Kyoto--Norocatcher.png);
−
    left:0;
+
−
    right:0;
+
−
     margin: auto;
+
−
     background-image: url(https://static.igem.org/mediawiki/2016/d/da/T--Kyoto--titlesoftware.png);
+
 
     background-position: center center;
 
     background-position: center center;
 
   }
 
   }
 
   #button_wrapper{
 
   #button_wrapper{
−
     width: 1023px;
+
     width: 1000px;
 
     height: 186px;
 
     height: 186px;
 
     margin: 0 auto;
 
     margin: 0 auto;
Line 37: Line 25:
 
     letter-spacing: -1em;
 
     letter-spacing: -1em;
 
   }
 
   }
−
   #button_left{
+
   .button{
−
     /*float: left;*/
+
     float:left;
−
    display: inline-block;
+
     width:250px;
−
     width:341px;
+
 
     height: 186px;
 
     height: 186px;
 
     letter-spacing: normal;
 
     letter-spacing: normal;
−
    border: 1px solid #000;
 
−
  }
 
−
  #button_center{
 
−
    display: inline-block;
 
−
    width:341px;
 
−
    height: 186px;
 
−
    letter-spacing: normal;
 
−
    border: 1px solid #000;
 
−
  }
 
−
  #button_right{
 
−
    display: inline-block;
 
−
    width:341px;
 
−
    height: 186px;
 
−
    letter-spacing: normal;
 
−
    border: 1px solid #000;
 
−
  }
 
−
  #contents{
 
−
    background-color:#ffffff;
 
 
   }
 
   }
 
</style>
 
</style>
  
 
<head>
 
<head>
 +
<link href="common.css" rel="stylesheet" type="text/css" media="all" />
 
<script type="text/javascript">
 
<script type="text/javascript">
 
   window.onload = function bwWidth(){
 
   window.onload = function bwWidth(){
Line 79: Line 49:
 
   }
 
   }
 
</script>
 
</script>
 +
 
</head>
 
</head>
 
<body>
 
<body>
 
   <div id="background">
 
   <div id="background">
−
    <img id="background-image" src="https://static.igem.org/mediawiki/2016/b/be/T--Kyoto--pagephoto-05.png">
 
−
  </div>
 
 
     <div id="header">
 
     <div id="header">
 
       <div id="nav-wrapper">
 
       <div id="nav-wrapper">
Line 126: Line 95:
 
       </div>
 
       </div>
 
     </div>
 
     </div>
−
     <div id="topbanner-wrapper">
+
 
−
       <div id="topbanner">
+
     <div id="topbanner">
 +
    </div>
 +
    <div id="button_wrapper">
 +
      <div class="button">
 +
        <a href="https://2016.igem.org/Team:Kyoto/Description"><img src="https://static.igem.org/mediawiki/2016/7/79/T--Kyoto--Tilefig-09.png"
 +
          onmouseover="this.src='https://static.igem.org/mediawiki/2016/e/ea/T--Kyoto--Tilefigmouseover-17.png'"
 +
          onmouseout="this.src='https://static.igem.org/mediawiki/2016/7/79/T--Kyoto--Tilefig-09.png'"></a>
 +
       </div>
 +
      <div class="button">
 +
        <a href="https://2016.igem.org/Team:Kyoto/Software"><img src="https://static.igem.org/mediawiki/2016/2/2f/T--Kyoto--Tilefig-10.png"
 +
          onmouseover="this.src='https://static.igem.org/mediawiki/2016/d/d5/T--Kyoto--Tilefigmouseover-18.png'"
 +
          onmouseout="this.src='https://static.igem.org/mediawiki/2016/2/2f/T--Kyoto--Tilefig-10.png'"></a>
 +
      </div>
 +
      <div class="button">
 +
        <a href="https://2016.igem.org/Team:Kyoto/Notebook"><img src="https://static.igem.org/mediawiki/2016/e/e9/T--Kyoto--Tilefig-11.png"
 +
          onmouseover="this.src='https://static.igem.org/mediawiki/2016/5/54/T--Kyoto--Tilefigmouseover-19.png'"
 +
          onmouseout="this.src='https://static.igem.org/mediawiki/2016/e/e9/T--Kyoto--Tilefig-11.png'"></a>
 +
      </div>
 +
      <div class="button">
 +
        <a href="https://2016.igem.org/Team:Kyoto/Achievements"><img src="https://static.igem.org/mediawiki/2016/c/c1/T--Kyoto--Tilefig-12.png"
 +
          onmouseover="this.src='https://static.igem.org/mediawiki/2016/8/86/T--Kyoto--Tilefigmouseover-20.png'"
 +
          onmouseout="this.src='https://static.igem.org/mediawiki/2016/c/c1/T--Kyoto--Tilefig-12.png'"></a>
 
       </div>
 
       </div>
 
     </div>
 
     </div>
−
     <div id="contents-wrapper">
+
     <div id="button_wrapper">
−
  <div id="contents">
+
      <div class="button">
−
    <div>
+
        <a href="https://2016.igem.org/Team:Kyoto/Integrated_Practices"><img src="https://static.igem.org/mediawiki/2016/5/50/T--Kyoto--Tilefig-13.png"
−
<h6>Contents</h6>
+
          onmouseover="this.src='https://static.igem.org/mediawiki/2016/7/7c/T--Kyoto--Tilefigmouseover-21.png'"
−
<ul id="cont">
+
           onmouseout="this.src='https://static.igem.org/mediawiki/2016/5/50/T--Kyoto--Tilefig-13.png'"></a>
−
  <li><a href="#overview">1 Overview</a></li>
+
−
  <li><a href="#background story">2 Background story</a></li>
+
−
  <li><a href="#improvements">3 Improvements</a></li>
+
−
  <li><a href="#user's voice">4 User's voice</a></li>
+
−
  <li><a href="#how to use">5 How to use</a></li>
+
−
  <li><a href="#additional features">6 Additional features</a></li>
+
−
  <li><a href="#customize for your team">7 Customize for your team</a></li>
+
−
  <li><a href="#downloads">8 Downloads</a></li>
+
−
</ul>
+
−
 
+
−
 
+
−
            <h1 id="overview">Overview</h1>
+
−
 
+
−
          <p>We developed a software named "KELN": Kyoto-team Electronic Lab Note.
+
−
 
+
−
        Ever felt it difficult to write tables in html documents? KELN is the solution! KELN provides user-friendly graphical user interface so that those who don't know html tags can make tables in html documents very easily!</p>
+
−
 
+
−
        </div>
+
−
 
+
−
 
+
−
 
+
−
        <div>
+
−
 
+
−
          <h1 id="background story">Background story</h1>
+
−
 
+
−
          <p>Before we developed this software, it took a long time to write HTML documents such as tables of our lab notes. Because not all of us are good at HTML works, it was a heavy burden on HTML experts to do all the work. How wonderful would it would be if we could assign this work to all the members in our team? </p>
+
−
 
+
−
        </div>
+
−
 
+
−
 
+
−
 
+
−
        <div>
+
−
 
+
−
          <h1 id="improvements">Improvements</h1>
+
−
 
+
−
          <h2>Speed</h2>
+
−
 
+
−
          <p>KELN improved writing speed dramatically.</p>
+
−
 
+
−
          <h2>Consistency</h2>
+
−
 
+
−
          <p>You don't have to worry about syntax errors. All files generated by KELN are formatted in the same way, including class tags for customizing their appearance.</p>
+
−
 
+
−
        </div>
+
−
 
+
−
 
+
−
 
+
−
        <div>
+
−
 
+
−
          <h1 id="user's voice">User's voice</h1>
+
−
          <p><q>The user interface was very natural, and the time-consuming work of writing HTML codes were significantly shortened</q> --Gifu</p>
+
−
          <p><q>It was very easy to use.</q> --Hokkaido-U</p>
+
−
        </div>
+
−
 
+
−
 
+
−
 
+
−
        <div>
+
−
 
+
−
          <h1 id="how to use">How to use</h1>
+
−
 
+
−
          <ul>
+
−
 
+
−
            <li>Enter the date of an experiment</li>
+
−
 
+
−
            <img src="https://static.igem.org/mediawiki/2016/c/c2/T--Kyoto--kelnmanual_1.png" width="388" height="336">
+
−
 
+
−
            <li>Select the author</li>
+
−
 
+
−
            <img src="https://static.igem.org/mediawiki/2016/5/53/T--Kyoto--kelnmanual_2.png" width="388" height="336">
+
−
 
+
−
            <li>Check your teammates who conducted the experiment</li>
+
−
 
+
−
            <img src="https://static.igem.org/mediawiki/2016/4/45/T--Kyoto--kelnmanual_3.png" width="388" height="336">
+
−
 
+
−
            <li>Choose a template</li>
+
−
 
+
−
            <img src="https://static.igem.org/mediawiki/2016/0/0b/T--Kyoto--kelnmanual_4.png" width="388" height="336">
+
−
 
+
−
            <li>Edit the table</li>
+
−
 
+
−
            <img src="https://static.igem.org/mediawiki/2016/2/2c/T--Kyoto--kelnmanual_5.png" width="388" height="336">
+
−
 
+
−
            <li>Push convert button</li>
+
−
 
+
−
            <img src="https://static.igem.org/mediawiki/2016/b/b5/T--Kyoto--kelnmanual_6.png" width="388" height="336">
+
−
 
+
−
           </ul>
+
−
 
+
−
        </div>
+
−
 
+
−
 
+
−
 
+
−
        <div>
+
−
 
+
−
          <h1 id="additional features">Additional features</h1>
+
−
 
+
−
          <p>You can add descriptions of the table here</p>
+
−
 
+
−
          <img src="https://static.igem.org/mediawiki/2016/d/dd/T--Kyoto--kelnmanual_7.png" width="388" height="336">
+
−
 
+
−
          <p>You can also make custom tables. Please enter the numbers of colmns and table titel here, then push "apply" button.</p>
+
−
 
+
−
          <img src="https://static.igem.org/mediawiki/2016/4/49/T--Kyoto--kelnmanual_8.png" width="388" height="336">
+
−
 
+
−
          <p>Note: first row of the table will be titles of columns.</p>
+
−
 
+
−
        </div>
+
−
 
+
−
 
+
−
 
+
−
        <div>
+
−
 
+
−
          <h1 id="customize for your team">Customize for your team</h1>
+
−
 
+
−
          <p>You can customize the checkboxes of teammates in KELN by editing settings.txt.</p>
+
−
 
+
−
          <p>note: Please write names separated by comma. If KELN says "Syntax error", please confirm that settings.txt is correct.</p>
+
−
 
+
−
          <p>Because KELN is a open source, everyone can modify this software. Please add functions you need, and start writing electronic lab notes today! </p>
+
−
 
+
−
        </div>
+
−
 
+
−
 
+
−
 
+
−
        <div>
+
−
 
+
−
          <h1 id="downloads">Downloads</h1>
+
−
 
+
−
          <p>KELN is now available on <a href="https://github.com/iGEMKyoto/KELN/releases">https://github.com/iGEMKyoto/KELN/releases</a>.</p>
+
−
 
+
−
        </div>    
+
−
 
+
−
          </div>
+
 
       </div>
 
       </div>
 +
      <div class="button">
 +
        <a href="https://2016.igem.org/Team:Kyoto/Experiments"><img src="https://static.igem.org/mediawiki/2016/5/57/T--Kyoto--Tilefig-14.png"
 +
          onmouseover="this.src='https://static.igem.org/mediawiki/2016/3/35/T--Kyoto--Tilefigmouseover-22.png'"
 +
          onmouseout="this.src='https://static.igem.org/mediawiki/2016/5/57/T--Kyoto--Tilefig-14.png'"</a>
 +
      </div>
 +
      <div class="button">
 +
        <a href="https://2016.igem.org/Team:Kyoto/Team"><img src="https://static.igem.org/mediawiki/2016/0/09/T--Kyoto--Tilefig-15.png"
 +
          onmouseover="this.src='https://static.igem.org/mediawiki/2016/5/57/T--Kyoto--Tilefigmouseover-23.png'"
 +
          onmouseout="this.src='https://static.igem.org/mediawiki/2016/0/09/T--Kyoto--Tilefig-15.png'"></a>
 +
      </div>
 +
      <div class="button">
 +
        <a href="https://2016.igem.org/Team:Kyoto/Safety"><img src="https://static.igem.org/mediawiki/2016/2/2a/T--Kyoto--Tilefig-16.png"
 +
          onmouseover="this.src='https://static.igem.org/mediawiki/2016/a/ac/T--Kyoto--Tilefigmouseover-24.png'"
 +
          onmouseout="this.src='https://static.igem.org/mediawiki/2016/2/2a/T--Kyoto--Tilefig-16.png'"></a>
 +
      </div>
 +
    </div>
 
   </div>
 
   </div>
−
    <div id="footer">
+
  <div id="footer">
 
     <div id="footer_logos">
 
     <div id="footer_logos">
 
       <img src="https://static.igem.org/mediawiki/2016/e/e6/T--Kyoto--Footer-24.png" width="874" height="95">
 
       <img src="https://static.igem.org/mediawiki/2016/e/e6/T--Kyoto--Footer-24.png" width="874" height="95">
Line 283: Line 156:
 
     </div>
 
     </div>
 
   </div>
 
   </div>
 +
 +
  
 
</html>
 
</html>

Latest revision as of 17:19, 19 October 2016