Difference between revisions of "Team:TUDelft/Head"

 
(70 intermediate revisions by 3 users not shown)
Line 5: Line 5:
 
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
 
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
 
     <meta charset="utf-8" />
 
     <meta charset="utf-8" />
−
     <title>Case13a</title>
+
     <title>ADOPE</title>
 
     <meta name="description" content="An iGEM project" />
 
     <meta name="description" content="An iGEM project" />
 
     <meta name="author" content="Lisbeth Schmidtchen" />
 
     <meta name="author" content="Lisbeth Schmidtchen" />
Line 11: Line 11:
 
     <!-- Mobile Specific Metas
 
     <!-- Mobile Specific Metas
 
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
 
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
−
    <meta name="viewport" content="width=device-width, initial-scale=1" />
+
<!--    <meta name="viewport" content="width=device-width, initial-scale=1" /> -->
 +
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
  
 
     <!-- FONT
 
     <!-- FONT
Line 17: Line 18:
 
     <link href="http://fonts.googleapis.com/css?family=Comfortaa|Lato|Raleway:400,300,600" rel="stylesheet" type="text/css" />
 
     <link href="http://fonts.googleapis.com/css?family=Comfortaa|Lato|Raleway:400,300,600" rel="stylesheet" type="text/css" />
 
     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 
     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 +
 +
 
  
 
     <!-- CSS
 
     <!-- CSS
 
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
 
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
−
 
 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.css" integrity="sha384-wITovz90syo1dJWVh32uuETPVEtGigN07tkttEqPv+uR2SE/mbQcG7ATL28aI9H0" crossorigin="anonymous">
 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.css" integrity="sha384-wITovz90syo1dJWVh32uuETPVEtGigN07tkttEqPv+uR2SE/mbQcG7ATL28aI9H0" crossorigin="anonymous">
 
     <link rel="stylesheet" href="https://2018.igem.org/Team:TUDelft/css/custom/test2?action=raw&ctype=text/css" />
 
     <link rel="stylesheet" href="https://2018.igem.org/Team:TUDelft/css/custom/test2?action=raw&ctype=text/css" />
 +
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous">
  
 
     <!-- JS
 
     <!-- JS
Line 30: Line 33:
 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 
     <script src="https://use.fontawesome.com/b31c04f526.js"></script>
 
     <script src="https://use.fontawesome.com/b31c04f526.js"></script>
 +
  
 
     <!-- KATEX
 
     <!-- KATEX
 
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
 
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.js" integrity="sha384-/y1Nn9+QQAipbNQWU65krzJralCnuOasHncUFXGkdwntGeSvQicrYkiUBwsgUqc1" crossorigin="anonymous"></script>
 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.js" integrity="sha384-/y1Nn9+QQAipbNQWU65krzJralCnuOasHncUFXGkdwntGeSvQicrYkiUBwsgUqc1" crossorigin="anonymous"></script>
−
     <script src="https://2017.igem.org/Team:TUDelft/js/auto-render?action=raw&ctype=text/javascript" type="text/javascript"></script>
+
     <script src="https://2018.igem.org/Team:TUDelft/js/auto-render?action=raw&ctype=text/javascript" type="text/javascript"></script>
 
     <script>
 
     <script>
 
         document.addEventListener("DOMContentLoaded", function() {
 
         document.addEventListener("DOMContentLoaded", function() {
Line 83: Line 87:
 
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
 
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
 
     <link rel="icon" type="image/png" href="https://static.igem.org/mediawiki/2018/7/75/T--TUDelft--2018_adope_logo.png" />
 
     <link rel="icon" type="image/png" href="https://static.igem.org/mediawiki/2018/7/75/T--TUDelft--2018_adope_logo.png" />
 +
 +
<style>
 +
    @media screen and (min-width: 768px){
 +
    CSS
 +
}
 +
    #custom-nav {
 +
    background-color: rgba(255,255,255,0.7);
 +
    border: 0;
 +
    box-shadow: none;
 +
    z-index: 999;
 +
    -webkit-transition: background .5s ease-in-out, opacity .5s ease;
 +
    -moz-transition: background .5s ease-in-out, opacity .5s ease;
 +
    transition: background .5s ease-in-out, opacity .5s ease;
 +
    margin-right: -15px;
 +
}
 +
    #custom-nav .dropdown-menu {
 +
    border-radius: 0;
 +
    border: none;
 +
    border-top: 5px solid transparent;
 +
    background-color: rgba(255,255,255,0.7);
 +
    -webkit-box-shadow: none;
 +
    box-shadow: none;
 +
    padding-top: 0;
 +
}
 +
    #custom-nav .container {
 +
    padding-top: 25px;
 +
    padding-bottom: 25px;
 +
    -webkit-transition: padding-top .5s ease, padding-bottom .5s ease;
 +
    -moz-transition: padding-top .5s ease, padding-bottom .5s ease;
 +
    transition: padding-top .5s ease, padding-top .5s ease, padding-bottom .5s ease;
 +
}
 +
    #custom-nav.affix {
 +
    top: 0;
 +
    min-width: 100%;
 +
    background-color: #f8f8f8;
 +
    opacity: 0.9;
 +
    -webkit-transition: background .5s ease-in-out, opacity .5s ease;
 +
    -moz-transition: background .5s ease-in-out, opacity .5s ease;
 +
    transition: background .5s ease-in-out, opacity .5s ease;
 +
margin-right: 15px;
 +
}
 +
    @media screen and (max-width: 767px){
 +
    #wrapwrap {
 +
        padding-top: 50px;
 +
    }
 +
    .navbar-fixed-top {
 +
        z-index: 999;
 +
    }
 +
}
 +
 +
.pull-left {
 +
  margin-left: 10px;
 +
}
 +
</style>   
 +
<script>
 +
$(window).scroll(function() {
 +
    if ($(".navbar").offset().top > 50) {
 +
        $('#custom-nav').addClass('affix');
 +
        $(".navbar-fixed-top").addClass("top-nav-collapse");
 +
    } else {
 +
        $('#custom-nav').removeClass('affix');
 +
        $(".navbar-fixed-top").removeClass("top-nav-collapse");
 +
    } 
 +
});
 +
</script>
  
 
</head>
 
</head>
 
<body>
 
<body>
−
<!-- .navbar-fixed-top, or .navbar-fixed-bottom can be added to keep the nav bar fixed on the screen -->
+
 
−
<nav class="navbar navbar-default">
+
<header>
−
  <div class="container-fluid">
+
 
−
+
<nav class="navbar navbar-default navbar-fixed-top" id="custom-nav" style="margin:15px;">
−
    <!-- Brand and toggle get grouped for better mobile display -->
+
<div class="container-fuid">
−
    <div class="navbar-header">
+
 
−
+
<!-- Brand and toggle get grouped for better mobile display -->
−
      <!-- Button that toggles the navbar on and off on small screens -->
+
<div class="navbar-header">
−
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
+
 
−
+
<!-- Button that toggles the navbar on and off on small screens -->
−
      <!-- Hides information from screen readers -->
+
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#adopenav" aria-expanded="false">
−
        <span class="sr-only"></span>
+
 
−
+
<!-- Hides information from screen readers -->
−
        <!-- Draws 3 bars in navbar button when in small mode -->
+
<span class="sr-only"></span>
−
        <span class="icon-bar"></span>
+
 
−
        <span class="icon-bar"></span>
+
<!-- Draws 3 bars in navbar button when in small mode -->
−
        <span class="icon-bar"></span>
+
<span class="icon-bar"></span>
−
      </button>
+
<span class="icon-bar"></span>
−
+
<span class="icon-bar"></span>
−
      <!-- You'll have to add padding in your image on the top and right of a few pixels (CSS Styling will break the navbar) -->
+
</button>
−
      <a class="pull-left" href="2018.igem.org/Team:TUDelft"><img src="https://static.igem.org/mediawiki/2018/0/09/T--TUDelft--2018_adope_logo_white.png" style="height:50px;width:auto;" ></a>
+
 
−
    </div>
+
<!-- You'll have to add padding in your image on the top and right of a few pixels (CSS Styling will break the navbar) -->
−
+
<a class="pull-left" href="https://2018.igem.org/Team:TUDelft"><img class="adopeicon" src="https://static.igem.org/mediawiki/2018/7/75/T--TUDelft--2018_adope_logo.png"></a>
−
    <!-- 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="#">Home <span class="sr-only">(current)</span></a></li>
+
−
        <li><a href="#">About</a></li>
+
−
        <li class="dropdown">
+
−
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Contact Us <span class="caret"></span></a>
+
−
          <ul class="dropdown-menu">
+
−
            <li><a href="#">Email</a></li>
+
−
            <li><a href="#">Phone</a></li>
+
−
            <li role="separator" class="divider"></li>
+
−
            <li><a href="#">Set Appointment</a></li>
+
−
          </ul>
+
−
        </li>
+
−
      </ul>
+
−
      <!-- navbar-left will move the search to the left -->
+
−
      <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>
+
−
    </div><!-- /.navbar-collapse -->
+
−
  </div><!-- /.container-fluid -->
+
−
</nav>
+
 
</div>
 
</div>
 +
 +
<!-- Collect the nav links, forms, and other content for toggling -->
 +
<div class="collapse navbar-collapse" id="adopenav">
 +
<ul class="nav navbar-nav">
 +
  <!-- Project -->
 +
<li class="dropdown">
 +
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Project<span class="caret"></span></a>
 +
  <ul class="dropdown-menu">
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Description">Description</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Design">Design</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Results">Results</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Demonstrate">Demonstration</a></li>
 +
</ul>
 +
</li>
 +
<!-- Wetlab -->
 +
<li class="dropdown">
 +
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Wetlab<span class="caret"></span></a>
 +
  <ul class="dropdown-menu">
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Experiments">Experiments (Protocols)</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Notebook">Notebook</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/InterLab">InterLab</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Safety">Safety</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Measurement">Measurement</a></li> 
 +
</ul>
 +
</li>
 +
<!-- Parts -->
 +
<li class="dropdown">
 +
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Parts<span class="caret"></span></a>
 +
  <ul class="dropdown-menu">
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Parts">Parts Overview</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Basic_Part">Basic Parts</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Composite_Parts">Composite Parts</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Part_Collection">Part Collection</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Primers">Sequences</a></li>
 +
  </ul>
 +
</li> 
 +
  <!-- Modeling -->
 +
<li class="dropdown">
 +
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Modeling<span class="caret"></span></a>
 +
  <ul class="dropdown-menu">
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Model">Model</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Software">Software Tool</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Improve">Improvement</a></li>
 +
  </ul>
 +
</li>
 +
<!-- Human Practices -->
 +
<li class="dropdown">
 +
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Human Practices<span class="caret"></span></a>
 +
  <ul class="dropdown-menu">
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Human_Practices">Integrated Human Practices</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Public_Engagement">Education and Engagement</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Entrepreneurship">Entrepreneurship</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Applied_Design">Applied Design</a></li>
 +
  </ul>
 +
</li>
 +
<!-- EurAsian Meetup -->
 +
<li><a href="https://2018.igem.org/Team:TUDelft/EurAsianMeetup">EurAsian Meetup</a></li>
 +
      <!-- Team -->
 +
<li class="dropdown">
 +
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Team<span class="caret"></span></a>
 +
  <ul class="dropdown-menu">
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Team">Team Members</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Collaborations">Collaborations</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Contributions">Contributions</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Team_Building">Team Building</a></li>
 +
  </ul>
 +
</li>
 +
<!-- Acknowledgements -->
 +
<li class="dropdown">
 +
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Acknowledgements<span class="caret"></span></a>
 +
  <ul class="dropdown-menu">
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Attributions">Attributions</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Sponsors">Sponsors</a></li>
 +
  </ul>
 +
</li>
 +
    <!-- awards -->
 +
<li class="dropdown">
 +
    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fa fa-trophy"></i><span class="caret"></span></a>
 +
  <ul class="dropdown-menu">
 +
    <li><a href="https://igem.org/2018_Judging_Form?team=TUDelft">Judging form</a></li> 
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Medals">Medal Requirements</a></li>
 +
    <li><a href="https://2018.igem.org/Team:TUDelft/Awards">Awards</a></li>
 +
  </ul>
 +
</li>
 +
</ul>
 +
</div><!-- /.navbar-collapse -->
 +
</div><!-- /.container-fluid -->
 +
</nav>
 +
</header>
 +
  
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 11:52, 28 November 2018

ADOPE