Difference between revisions of "Team:Hong Kong HKU"

(Implement the new UI)
Line 1: Line 1:
{{Hong_Kong_HKU/UI}}
 
 
<html>
 
<html>
 +
<style>
 +
        #sideMenu
 +
        {
 +
        display:none; /* Disable the display of the side main menu*/
 +
        }
 +
       
 +
        #top_title
 +
        {
 +
        display:none;
 +
        }
 +
 +
#content { padding:0px; width:90%; margin-left:5%; margin-right:5%;}
 +
</style>
 +
 
<head>
 
<head>
 +
<meta charset="utf-8">
 
<meta http-equiv="X-UA-Compatible" content="IE=edge">
 
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
+
<meta name="viewport" content="width=device-width, initial-scale=1">
 +
 
 +
<!-- Bootstrap -->
 
<link href="https://2016.igem.org/Team:Hong_Kong_HKU/css/default?action=raw&ctype=text/css" type="text/css" rel="stylesheet">
 
<link href="https://2016.igem.org/Team:Hong_Kong_HKU/css/default?action=raw&ctype=text/css" type="text/css" rel="stylesheet">
 +
<script src="https://2016.igem.org/Template:Hong_Kong_HKU/js/script?action=raw&ctype=text/javascript"></script>
 +
 +
<nav class="navbar navbar-default">
 +
  <div class="container-fluid">
 +
    <!-- Brand and toggle get grouped for better mobile display -->
 +
    <div class="navbar-header">
 +
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
 +
      <a class="navbar-brand" href="#">HKU iGEM Team</a>
 +
      </div>
 +
     
 +
   
 +
    <!-- Collect the nav links, forms, and other content for toggling -->
 +
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
 +
      <ul class="nav navbar-nav">
 +
        <li class="active"><a href="https://2016.igem.org/Team:Hong_Kong_HKU">Homepage<span class="sr-only">(current)</span></a> </li>
 +
        <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" aria-haspopup="true">Project<span class="caret"></span></a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2016.igem.org/Team:Hong_Kong_HKU/Description">Description</a> </li>
 +
            <li><a href="https://2016.igem.org/Team:Hong_Kong_HKU/Design">Design</a> </li>
 +
            <li role="separator" class="divider"></li>
 +
            <li><a href="https://2016.igem.org/Team:Hong_Kong_HKU/Proof">Proof of concept</a> </li>
 +
            <li><a href="https://2016.igem.org/Team:Hong_Kong_HKU/Demostrate">Demostrate</a> </li>
 +
          </ul>
 +
        </li>
 +
        <li class="dropdown"> <a href="https://2016.igem.org/Team:Hong_Kong_HKU/Notebook" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" aria-haspopup="true">Notebook<span class="caret"></span></a>
 +
          <ul class="dropdown-menu">
 +
            <li><a href="https://2016.igem.org/Team:Hong_Kong_HKU/Protocol">Protocol</a> </li>
 +
            <li role="separator" class="divider"></li>
 +
            <li><a href="https://2016.igem.org/Team:Hong_Kong_HKU/Result">Result</a> </li>
 +
          </ul>
 +
        </li>
 +
        <li><a href="https://2016.igem.org/Team:Hong_Kong_HKU/Parts">Parts</a></li>
 +
        <li><a href="https://2016.igem.org/Team:Hong_Kong_HKU/Human_Practices">Human Practices</a></li>
 +
        <li><a href="https://2016.igem.org/Team:Hong_Kong_HKU/Attributions">Attributions</a></li>
 +
      </ul>
 +
      <form class="navbar-form navbar-right" role="search">
 +
        <div class="form-group">
 +
          <input type="text" class="form-control" placeholder="Search">
 +
        </div>
 +
        <button type="submit" class="btn btn-default">Submit</button>
 +
      </form>
 +
      <ul class="nav navbar-nav navbar-right">
 +
      </ul>
 +
    </div>
 +
    <span class="dropdown"></span>    <!-- /.navbar-collapse -->
 +
  </div>
 +
  <!-- /.container-fluid -->
 +
</nav>
 +
<!-- nav ended -->
 
</head>
 
</head>
  
<body>
+
<link href="https://2016.igem.org/Team:Hong_Kong_HKU/css/default?action=raw&ctype=text/css" type="text/css" rel="stylesheet">
 
<script src="https://2016.igem.org/Template:Hong_Kong_HKU/js/script?action=raw&ctype=text/javascript"></script>
 
<script src="https://2016.igem.org/Template:Hong_Kong_HKU/js/script?action=raw&ctype=text/javascript"></script>
 +
<body>
 
<div class="container">
 
<div class="container">
 
   <div class="row">
 
   <div class="row">
    <div class="col-xs-12">
 
    <a class="left carousel-control" href="#carousel1" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span><span class="sr-only">Previous</span></a><a class="right carousel-control" href="#carousel1" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span><span class="sr-only">Next</span></a></div>
 
 
<img class="img-responsive center-block" alt="256x256" style="width: 256px; height: 256px;" src="https://static.igem.org/mediawiki/2016/2/24/Logo_HKU_256x256.jpg" data-holder-rendered="true">
 
<img class="img-responsive center-block" alt="256x256" style="width: 256px; height: 256px;" src="https://static.igem.org/mediawiki/2016/2/24/Logo_HKU_256x256.jpg" data-holder-rendered="true">
 
       <h1 class="text-center">Welcome</h1>
 
       <h1 class="text-center">Welcome</h1>
Line 18: Line 82:
 
           <p>&nbsp;</p>
 
           <p>&nbsp;</p>
 
           <p class="text-center"><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a> </p>
 
           <p class="text-center"><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a> </p>
   </div>
+
   </div>  
      <div id="carousel1" class="carousel slide" data-ride="carousel">
+
</div>
        <ol class="carousel-indicators">
+
 
          <li data-target="#carousel1" data-slide-to="0" class="active"></li>
+
<!-- footer -->
          <li data-target="#carousel1" data-slide-to="1"></li>
+
<footer class="text-center">
          <li data-target="#carousel1" data-slide-to="2"></li>
+
  <div class="container">
        </ol>
+
    <div class="row">
        <div class="carousel-inner" role="listbox">
+
      <div class="col-xs-12">
          <div class="item active"><img src="images/Carousel_Placeholder.png" alt="First slide image" class="center-block">
+
        <p>Copyright © 2016 HKU iGEM. All rights reserved.</p>
            <div class="carousel-caption">
+
      </div>
              <h3>First slide Heading</h3>
+
              <p>First slide Caption</p>
+
            </div>
+
          </div>
+
          <div class="item"><img src="images/Carousel_Placeholder.png" alt="Second slide image" class="center-block">
+
            <div class="carousel-caption">
+
              <h3>Second slide Heading</h3>
+
              <p>Second slide Caption</p>
+
            </div>
+
          </div>
+
          <div class="item"><img src="images/Carousel_Placeholder.png" alt="Third slide image" class="center-block">
+
            <div class="carousel-caption">
+
              <h3>Third slide Heading</h3>
+
              <p>Third slide Caption</p>
+
            </div>
+
          </div>
+
        </div>
+
 
     </div>
 
     </div>
</div>
+
  </div>
 +
</footer>
 
</body>
 
</body>
 
</html>
 
</html>
{{Hong_Kong_HKU/footer}}
 

Revision as of 06:53, 19 July 2016

256x256

Welcome

We are launching our new UI soon

 

Learn more

Copyright © 2016 HKU iGEM. All rights reserved.