|
|
Line 1: |
Line 1: |
− | <html>
| |
| | | |
− | <!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
| |
− | <!--- THIS IS WHERE THE HTML BEGINS --->
| |
− | <!------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------->
| |
− |
| |
− | <head>
| |
− | <meta charset="utf-8">
| |
− | <meta name="viewport" content="width=device-width, initial-scale=1">
| |
− | <!-- bootstrap -->
| |
− | <link rel="stylesheet" href="https://2019.igem.org/Template:CSU_CHINA/CSS/Bootstrap?action=raw&ctype=text/css" type="text/css">
| |
− | <!-- Font-Awesome-Icons-CSS -->
| |
− | <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/5.10.2/css/all.css" type="text/css">
| |
− | <!-- jquery.min.js -->
| |
− | <script src="https://2019.igem.org/Template:CSU_CHINA/JS/jquery?action=raw&ctype=text/javascript"></script>
| |
− | <!-- Bootstrap.min.js -->
| |
− | <script src="https://2019.igem.org/Template:CSU_CHINA/JS/bootstrapminjs?action=raw&ctype=text/javascript"></script>
| |
− | <!-- Bootstrap.bundle.js -->
| |
− | <script src="https://2019.igem.org/Template:CSU_CHINA/JS/bootstrapbundleminjs?action=raw&ctype=text/javascript"></script>
| |
− | </head>
| |
− |
| |
− | <style>
| |
− | body{
| |
− | padding:0;
| |
− | margin:0;
| |
− | }
| |
− | body a{
| |
− | transition:0.5s all;
| |
− | -webkit-transition:0.5s all;
| |
− | -moz-transition:0.5s all;
| |
− | -o-transition:0.5s all;
| |
− | -ms-transition:0.5s all;
| |
− | }
| |
− | a:hover{
| |
− | text-decoration:none;
| |
− | }
| |
− | h1,h2,h3,h4,h5,h6{
| |
− | margin:0;
| |
− | }
| |
− | p{
| |
− | margin:0;
| |
− | }
| |
− | ul{
| |
− | margin:0;
| |
− | padding:0;
| |
− | }
| |
− | div#top_title{
| |
− | display:none;
| |
− | }
| |
− | /*--/navbar--*/
| |
− | .navbar {
| |
− | height: 110px;
| |
− | margin-top: 16px;
| |
− | padding-top: 0px;
| |
− | padding-bottom: 0px;
| |
− | font-size:17px;
| |
− | }
| |
− | #navbarSupportedContent{
| |
− | height: 100px;
| |
− | }
| |
− | nav.navbar{
| |
− | width: 100%;
| |
− | background-color: rgba(17, 17, 17, 0.70) !important;
| |
− | transition: all 0.3s ease;
| |
− | -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
| |
− | -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
| |
− | }
| |
− | nav.shrink{
| |
− | width: 100%;
| |
− | background-color: rgba(17, 17, 17, 0.80) !important;
| |
− | transition: all 0.3s ease;
| |
− | -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
| |
− | -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
| |
− | }
| |
− | a.navbar-brand {
| |
− | font-size: 1em;
| |
− | text-shadow: 0 1px 2px rgba(0, 0, 0, 0.37);
| |
− | color: #fff;
| |
− | }
| |
− |
| |
− | .navlink{
| |
− | padding: 8px 8px 8px 8px;
| |
− | }
| |
− |
| |
− | .navbar-light .navbar-brand {
| |
− | margin-right: 0px;
| |
− | color: #fff;
| |
− | font-weight: 100;
| |
− | }
| |
− | .navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {
| |
− | color: #fff;
| |
− | }
| |
− | li.nav-item {
| |
− | margin: 10px;
| |
− | }
| |
− |
| |
− | .navbar-light .navbar-nav .nav-link{
| |
− | background: -webkit-linear-gradient(left bottom, #cccccc, #ffffff); /* Safari 5.1 - 6.0 */
| |
− | background: -o-linear-gradient(top right, #cccccc, #ffffff); /* Opera 11.1 - 12.0 */
| |
− | background: -moz-linear-gradient(top right, #cccccc, #ffffff); /* Firefox 3.6 - 15 */
| |
− | background: linear-gradient(to top right, #cccccc, #ffffff); /* Standard */
| |
− | -webkit-background-clip: text; /* Safari 5.1 - 6.0 */
| |
− | -o-background-clip: text; /* Opera 11.1 - 12.0 */
| |
− | -moz-background-clip: text; /* Firefox 3.6 - 15 */
| |
− | background-clip: text; /* Standard */
| |
− | color: transparent;
| |
− | }
| |
− |
| |
− | .dropdown-toggle::after{
| |
− | color: #bfbfbf;
| |
− | }
| |
− |
| |
− | .nav-item:hover .dropdown-toggle::after{
| |
− | color: rgba(0, 0, 0, 0);
| |
− | transition: color 0.15s;
| |
− | -webkit-transition: color 0.15s; /* Safari */
| |
− | }
| |
− |
| |
− | .navbar-light .navbar-nav .show > .nav-link,
| |
− | .navbar-light .navbar-nav .active > .nav-link,
| |
− | .navbar-light .navbar-nav .nav-link:hover,
| |
− | .navbar-light .navbar-nav .nav-link:focus {
| |
− | color: white;
| |
− | }
| |
− |
| |
− | .nav-item:hover .nav-link{
| |
− | color: white;
| |
− | }
| |
− |
| |
− | .dropdown-item {
| |
− | padding: 0.5em 1.5rem;
| |
− | margin: 0;
| |
− | }
| |
− |
| |
− | .dropdown-menu {
| |
− | margin: -1px;
| |
− | padding: 0;
| |
− | }
| |
− |
| |
− | li.nav-item.active,li.nav-item:hover {
| |
− | border-bottom: 2px solid #7070db;
| |
− | display: inline-block;
| |
− | }
| |
− |
| |
− | .dropdown-item:hover .navbar-nav .nav-link,
| |
− | .dropdown-item:focus .navbar-nav .nav-link{
| |
− | color: #ffffff;
| |
− | }
| |
− |
| |
− | .dropdown-item:hover,
| |
− | .dropdown-item:focus {
| |
− | color: #4c6ef5;
| |
− | text-decoration: none;
| |
− | background-color: #f0f0f1;
| |
− | }
| |
− |
| |
− | #content{
| |
− | width: 100%;
| |
− | padding: 0;
| |
− | border: 0;
| |
− | margin: 0;
| |
− | }
| |
− | #bodyContent a[href ^="https://"], .link-https{
| |
− | padding: 8px 8px 8px 8px;
| |
− | }
| |
− |
| |
− | /*-- //header --*/
| |
− | </style>
| |
− |
| |
− | <body>
| |
− | <nav class="navbar navbar-expand-lg navbar-light fixed-top">
| |
− | <a class="navbar-brand" href="index.html">
| |
− | <img src="https://static.igem.org/mediawiki/2019/c/ca/T--CSU_CHINA--LOGOWITHWORDS.png" alt="logo" style="height: 75px">
| |
− | </a>
| |
− | <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent">
| |
− | <span class="navbar-toggler-icon"></span>
| |
− | </button>
| |
− | <div class="collapse navbar-collapse" id="navbarSupportedContent">
| |
− | <ul class="navbar-nav ml-lg-auto text-center">
| |
− | <li class="nav-item active">
| |
− | <a class="nav-link" href="https://2019.igem.org/Team:CSU_CHINA">HOME</a>
| |
− | </li>
| |
− | <li class="nav-item dropdown">
| |
− | <a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">TEAM</a>
| |
− | <div class="dropdown-menu" aria-labelledby="navbarDropdown">
| |
− | <a class="dropdown-item" href="#" title="">TEAM1</a>
| |
− | <a class="dropdown-item" href="#" title="">TEAM2</a>
| |
− | </div>
| |
− | </li>
| |
− | <li class="nav-item">
| |
− | <a class="nav-link" href="features.html">MODEL</a>
| |
− | </li>
| |
− | <li class="nav-item dropdown">
| |
− | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">HP</a>
| |
− | <div class="dropdown-menu" aria-labelledby="navbarDropdown">
| |
− | <a class="dropdown-item" href="#">INTERGRATED</a>
| |
− | <a class="dropdown-item" href="#">EDUCATION</a>
| |
− | <a class="dropdown-item" href="#">GOVERMENT</a>
| |
− | <a class="dropdown-item" href="#">PHILOSOPHY</a>
| |
− | </div>
| |
− | </li>
| |
− | <li class="nav-item">
| |
− | <a class="nav-link" href="contact.html">LAB</a>
| |
− | </li>
| |
− | <li class="nav-item dropdown">
| |
− | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">PARTS</a>
| |
− | <div class="dropdown-menu" aria-labelledby="navbarDropdown">
| |
− | <a class="dropdown-item" href="#">PART1</a>
| |
− | <a class="dropdown-item" href="#">PART2</a>
| |
− | <a class="dropdown-item" href="#">PART3</a>
| |
− | </div>
| |
− | </li>
| |
− | <li class="nav-item">
| |
− | <a class="nav-link" href="contact.html">SAFETY</a>
| |
− | </li>
| |
− | <li class="nav-item dropdown">
| |
− | <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">PROJECT</a>
| |
− | <div class="dropdown-menu" aria-labelledby="navbarDropdown">
| |
− | <a class="dropdown-item" href="#">DESCRIPTION</a>
| |
− | <a class="dropdown-item" href="#">DESIGN</a>
| |
− | <a class="dropdown-item" href="#">RESULTS</a>
| |
− | </div>
| |
− | </li>
| |
− | <li class="nav-item">
| |
− | <a class="nav-link" href="#">JUDGING</a>
| |
− | </li>
| |
− | </ul>
| |
− | </div>
| |
− | </nav>
| |
− | <script>
| |
− | $(document).ready(function() {
| |
− | $(".dropdown").hover(
| |
− | function() {
| |
− | $('.dropdown-menu', this).stop(true, true).slideDown("fast");
| |
− | $(this).toggleClass('open');
| |
− | },
| |
− | function() {
| |
− | $('.dropdown-menu', this).stop(true, true).slideUp("fast");
| |
− | $(this).toggleClass('open');
| |
− | }
| |
− | );
| |
− | });
| |
− | </script>
| |
− | <!-- //dropdown nav -->
| |
− | <!-- fixed nav -->
| |
− | <script>
| |
− | $(window).scroll(function () {
| |
− | if ($(document).scrollTop() > 50) {
| |
− | $('nav').addClass('shrink');
| |
− | } else {
| |
− | $('nav').removeClass('shrink');
| |
− | }
| |
− | });
| |
− | </script>
| |
− | <!-- //fixed nav -->
| |
− | <script type="text/javascript">
| |
− | $(document).ready(function () {
| |
− | $('#horizontalTab').easyResponsiveTabs({
| |
− | type: 'default', //Types: default, vertical, accordion
| |
− | width: 'auto', //auto or any width like 600px
| |
− | fit: true // 100% fit in a container
| |
− | });
| |
− | });
| |
− | </script>
| |
− | </body>
| |
− | </html>
| |