Difference between revisions of "Template:NCKU Tainan/Header"

 
(32 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
{{NCKU_Tainan/bootstrap_min_css}}
 
{{NCKU_Tainan/bootstrap_min_css}}
 +
{{NCKU_Tainan/font-awesome_min_css}}
 
{{NCKU_Tainan/Style}}
 
{{NCKU_Tainan/Style}}
 
<html>
 
<html>
 
<head>
 
<head>
 +
<meta name="viewport" content="width=device-width, initial-scale=1">
 +
 
<style>
 
<style>
  
  
 
/* NavigationBar */
 
/* NavigationBar */
−
@import url("https://fonts.googleapis.com/css?family=Roboto|Open+Sans|Raleway|Montserrat:300|Noto+Sans|Noto+Serif|Kalam");
+
@import url("https://fonts.googleapis.com/css?family=Roboto|Open+Sans|Raleway|Montserrat");
  
  
 
.navbar{
 
.navbar{
−
   /*background-color: transparent;*/
+
   background-color: rgba(255,255,255,0.8);
 
   border: 0px;
 
   border: 0px;
−
   margin-top: 16px;
+
   padding-top: 10px;
 
}
 
}
 
@media (min-width: 992px) {
 
@media (min-width: 992px) {
Line 38: Line 41:
  
 
.dropdown-li{
 
.dropdown-li{
−
   font-size: 24px;
+
   font-size: 22px;
 +
}
 +
.dropdown-menu {
 +
  background-color: rgba(255, 255, 255, 0.8);
 +
  box-shadow: none;
 
}
 
}
  
−
span {
+
.navbar span {
−
   font-family: 'Kalam', cursive;
+
   font-family: 'Montserrat', sans-serif;
−
   font-size: 28px;
+
   font-size: 22px;
−
   font-weight: bold;
+
   font-weight: normal;
 
   color: #333;
 
   color: #333;
 
}
 
}
  
−
.brand {
+
 
−
   font-size: 36px;
+
.navbar .brand {
−
   line-height: 60px;
+
   font-size: 32px;
 +
  font-weight: normal;
 +
   margin-top: 16px;
 
}
 
}
  
 
.logo {
 
.logo {
−
   height: 30px;
+
   height: 40px;
−
   width: 30px;
+
   width: auto;
 
   display: inline-block;
 
   display: inline-block;
−
   margin-top: 10px;
+
   margin-top: -9px;
−
  margin-left: 10px;
+
−
}
+
−
 
+
−
i {
+
−
  font-size: 18px;
+
−
  vertical-align: middle;
+
−
  margin-bottom: 5px;
+
−
}
+
−
 
+
−
.dropdown-main:hover .dropdown-sub{
+
−
  display: block;
+
−
}
+
−
.dropdown-sub {
+
−
  padding-left: 40px;
+
−
  display: none;
+
−
}
+
−
.dropdown-sub:hover {
+
−
  background-color: #f5f5f5;
+
−
}
+
−
.dropdown-sub a {
+
−
  text-decoration: none;
+
 
}
 
}
−
.dropdown-sub .dropdown-li {
+
@media (min-width:992px) {
−
  color: #00b3ea;
+
  .dropdown-toggle::after {
−
   opacity: 0.75;
+
    content: '';
−
}
+
    position: absolute;
−
@media (max-width:992px) {
+
    width: 30px;
−
   .dropdown-sub {
+
    height: 0px;
−
     display: block;
+
    left: 35%;
 +
    bottom: 9px;
 +
    border-bottom: 3px solid #f9cb8f;
 +
   }
 +
  .dropdown-toggle {
 +
    position: relative;
 +
  }
 +
  .dropdown-toggle:hover::after {
 +
    border: none;
 +
  }
 +
   .dropdown-hp::after {
 +
     left: 42%;
 
   }
 
   }
−
   .dropdown-sub:hover {
+
   .navbar-default .navbar-nav>.open>a::after, .navbar-default .navbar-nav>.open>a:hover::after, .navbar-default .navbar-nav>.open>a:focus::after {
−
     background-color: none;
+
     border: none;
 
   }
 
   }
 
}
 
}
Line 109: Line 108:
 
         <!-- <img src="#" alt="NCKU_Tainan logo" class="logo">--!>
 
         <!-- <img src="#" alt="NCKU_Tainan logo" class="logo">--!>
 
       </a>
 
       </a>
−
       <a><span class="pull-left brand">&nbsp;NCKU Tainan</span></a>
+
       <a href="https://2017.igem.org/Team:NCKU_Tainan"><span class="pull-left brand">&nbsp;NCKU Tainan</span></a>
 
     </div>
 
     </div>
 
     <div id="navbar" class="collapse navbar-collapse">
 
     <div id="navbar" class="collapse navbar-collapse">
Line 116: Line 115:
 
           <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span>Project</span></a>
 
           <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span>Project</span></a>
 
           <ul class="dropdown-menu">
 
           <ul class="dropdown-menu">
−
             <li><a [routerLink]="['/background']"><span class="dropdown-li">Description</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Description"><span class="dropdown-li">Description</span></a></li>
−
             <li><a [routerLink]="['/project']"><span class="dropdown-li">Design</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Design"><span class="dropdown-li">Design</span></a></li>
−
             <li><a [routerLink]="['/result']"><span class="dropdown-li">Results</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Results"><span class="dropdown-li">Results</span></a></li>
−
             <li><a [routerLink]="['/contribution']"><span class="dropdown-li">Contribution</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Model"><span class="dropdown-li">Model</span></a></li>
−
             <li><a [routerLink]="['/improve']"><span class="dropdown-li">Improve</span></a></li>
+
            <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Contribution"><span class="dropdown-li">Contribution</span></a></li>
 +
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Improve"><span class="dropdown-li">Improve</span></a></li>
 +
            <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Safety"><span class="dropdown-li">Safety</span></a></li>
 +
            <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Notebook"><span class="dropdown-li">Notebook</span></a></li>
 +
            <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Protocol"><span class="dropdown-li">Protocol</span></a></li>
 +
            <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Parts"><span class="dropdown-li">Parts</span></a></li>
 
           </ul>
 
           </ul>
 
         </li>
 
         </li>
Line 126: Line 130:
 
           <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span>Device</span></a>
 
           <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span>Device</span></a>
 
           <ul class="dropdown-menu">
 
           <ul class="dropdown-menu">
−
             <li><a [routerLink]="['/device']"><span class="dropdown-li">Hardware</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Hardware"><span class="dropdown-li">Hardware</span></a></li>
−
             <li><a [routerLink]="['/demonstrate']"><span class="dropdown-li">Demonstrate</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Demonstrate"><span class="dropdown-li">Demonstrate</span></a></li>
−
             <li><a [routerLink]="['/software']"><span class="dropdown-li">Software</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Software"><span class="dropdown-li">Software</span></a></li>
 
           </ul>
 
           </ul>
 
         </li>
 
         </li>
Line 134: Line 138:
 
           <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span>Team</span></a>
 
           <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span>Team</span></a>
 
           <ul class="dropdown-menu">
 
           <ul class="dropdown-menu">
−
             <li><a [routerLink]="['/team']"><span class="dropdown-li">Team</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Team"><span class="dropdown-li">Team</span></a></li>
−
             <li><a [routerLink]="['/attribution']"><span class="dropdown-li">Attributions</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Attributions"><span class="dropdown-li">Attributions</span></a></li>
−
             <li><a><span class="dropdown-li">Sponsors</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Collaborations"><span class="dropdown-li">Collaboration</span></a></li>
−
            <li><a [routerLink]="['/collaboration']"><span class="dropdown-li">Collaboration</span></a></li>
+
 
           </ul>
 
           </ul>
 
         </li>
 
         </li>
 
         <li class="dropdown">
 
         <li class="dropdown">
−
           <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span>Human Practice</span></a>
+
           <a class="dropdown-toggle dropdown-hp" data-toggle="dropdown" href="#"><span>Human Practice</span></a>
 
           <ul class="dropdown-menu">
 
           <ul class="dropdown-menu">
−
             <li><a [routerLink]="['/hp1']"><span class="dropdown-li">Overview</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Overview"><span class="dropdown-li">Overview</span></a></li>
−
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/HP/Silver"><span class="dropdown-li">Silver</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/HP/Silver"><span class="dropdown-li">Human Practice</span></a></li>
−
             <li><a [routerLink]="['/hpgold']"><span class="dropdown-li">Gold</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/HP/Gold_Integrated"><span class="dropdown-li">Integrated Practice</span></a></li>
−
             <li><a [routerLink]="['/engagement']"><span class="dropdown-li">Engagement</span></a></li>
+
             <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Engagement"><span class="dropdown-li">Public Engagement</span></a></li>
 
           </ul>
 
           </ul>
 
         </li>
 
         </li>
 +
        <li class="dropdown">
 +
          <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span>Awards</span></a>
 +
          <ul class="dropdown-menu">
 +
           
 +
            <li><a href="https://2017.igem.org/Team:NCKU_Tainan/Measurement"><span class="dropdown-li">Measurement</span></a></li>
 +
 +
          </ul>
 +
        </li>
 +
  
 
       </ul>
 
       </ul>
Line 155: Line 167:
 
   </div>
 
   </div>
 
</nav>
 
</nav>
 +
 +
  
 
<script src="https://2017.igem.org/Team:NCKU_Tainan/js/frame/T--NCKU_Tainan--jquery-1_12_4_min_js?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2017.igem.org/Team:NCKU_Tainan/js/frame/T--NCKU_Tainan--jquery-1_12_4_min_js?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2017.igem.org/Team:NCKU_Tainan/js/frame/T--NCKU_Tainan--bootstrap_min_js?action=raw&amp;ctype=text/javascript"></script>
 
<script src="https://2017.igem.org/Team:NCKU_Tainan/js/frame/T--NCKU_Tainan--bootstrap_min_js?action=raw&amp;ctype=text/javascript"></script>
 +
<script src="https://2017.igem.org/Template:NCKU_Tainan/js/main_js?action=raw&amp;ctype=text/javascript"></script>
  
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 19:16, 1 November 2017