Difference between revisions of "Template:Team:NCTU Formosa"

 
(94 intermediate revisions by 2 users not shown)
Line 2: Line 2:
 
<head>
 
<head>
 
<link rel="shortcut icon" href="https://static.igem.org/mediawiki/2016/b/bf/NCTU_icon.png" type="image/x-icon">
 
<link rel="shortcut icon" href="https://static.igem.org/mediawiki/2016/b/bf/NCTU_icon.png" type="image/x-icon">
−
<link rel="icon" href="https://static.igem.org/mediawiki/2016/b/bf/NCTU_icon.png" type="image/x-icon">
 
 
<meta charset="UTF-8">
 
<meta charset="UTF-8">
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
Line 23: Line 22:
 
         margin:0;
 
         margin:0;
 
     }
 
     }
 +
 +
 
      
 
      
 
     .main-container{
 
     .main-container{
Line 32: Line 33:
 
                     }
 
                     }
  
−
  .NCTU_Formosa{
+
 
−
                left:30px;
+
    .dropbtn{
−
                position:relative;
+
                  margin-top:5px;
−
                top:0.8vh;
+
 
}
 
}
−
   
 
−
    .main-menu{
 
−
      position:relative;
 
−
      list-style-type: none !important;
 
−
      margin:2px;
 
−
      padding:10px !important;
 
−
      display:block;
 
−
      float:right;
 
−
      font-size:12pt;
 
−
      font-family:"Open Sans",serif,sans-serif;
 
−
      }
 
  
−
    .container{
+
 
−
            display:none;
+
−
    }
+
 
      
 
      
 
     .dropbtn span:after{
 
     .dropbtn span:after{
Line 70: Line 57:
 
   .dropdown{
 
   .dropdown{
 
       float:left;
 
       float:left;
−
      margin-left:5px;
 
 
       text-decoration:none !important;
 
       text-decoration:none !important;
 
       list-style-type:none !important;
 
       list-style-type:none !important;
Line 78: Line 64:
 
                 list-style-type:none !important;
 
                 list-style-type:none !important;
 
                 text-decoration:none !important;
 
                 text-decoration:none !important;
 +
                text-align:left;
 
               }
 
               }
 
     li .dropdown{
 
     li .dropdown{
Line 91: Line 78:
 
                       text-decoration:none !important;     
 
                       text-decoration:none !important;     
 
                     }
 
                     }
 +
 +
.main-menu{
 +
      position:relative;
 +
      list-style-type: none !important;
 +
      margin-right:1px;
 +
      display:block;
 +
      float:right !important;
 +
      font-weight:400 !important;
 +
      font-size:15px;
 +
      font-family:"Open Sans",serif,sans-serif;
 +
      }
  
 
                 /*下拉式menu*/
 
                 /*下拉式menu*/
Line 102: Line 100:
 
                       background:#E8E3E8;
 
                       background:#E8E3E8;
 
                       position:absolute;
 
                       position:absolute;
−
                       width:auto;
+
                       width:auto !important;
 
                        
 
                        
 
                     }
 
                     }
 
     .dropdown-content a{
 
     .dropdown-content a{
 
                         color: black;
 
                         color: black;
−
                         padding:10px;
+
                         padding:15px;
 
                         text-decoration: none;
 
                         text-decoration: none;
 
                         display: block;
 
                         display: block;
−
                         text-align:left;
+
                         text-align:left !important;
 
                         size:1em;
 
                         size:1em;
 
                         }
 
                         }
Line 122: Line 120:
 
   
 
   
  
−
/*screen change*/
 
−
    @media screen and (max-width: 768px) {
 
−
    /*menu icon*/
 
−
 
−
   
 
−
    .bar1, .bar2, .bar3 {
 
−
    width: 35px;
 
−
    height: 5px;
 
−
    background-color: #333;
 
−
    margin: 6px 0 0 6px;
 
−
    transition: 0.4s;
 
−
    }
 
  
−
    .change .bar1 {
 
−
    -webkit-transform: rotate(-45deg) translate(-9px, 6px) ;
 
−
    transform: rotate(-45deg) translate(-9px, 6px) ;
 
−
    }
 
−
 
−
    .change .bar2 {opacity: 0;}
 
−
 
−
    .change .bar3 {
 
−
    -webkit-transform: rotate(45deg) translate(-8px, -8px) ;
 
−
    transform: rotate(45deg) translate(-8px, -8px) ;
 
−
    }
 
  
 
/*manu*/
 
/*manu*/
 +
@media screen and (min-width: 768px) {
 
.main-container{
 
.main-container{
 
                     background:white !important;
 
                     background:white !important;
 
                     position:fixed;
 
                     position:fixed;
 
                     width:100vw;
 
                     width:100vw;
−
                     height:8vh;
+
                     height:10.5vh;
 
                     display:block important;  
 
                     display:block important;  
 
                     }
 
                     }
 +
  .NCTU_Formosa{
 +
                left:1.5vw;
 +
                position:relative;
 +
                top:25px;
 +
}
 +
}
 +
@media screen and (orientation: portrait) {
 +
  .main-container{
 +
                    background:white !important;
 +
                    position:fixed;
 +
                    width:100vw;
 +
                    height:4vh;
 +
                    display:block important;
 +
                    }
 +
  .NCTU_Formosa{
 +
                left:1.5vw;
 +
                position:relative;
 +
                top:35px;
 +
}
 +
}
 +
 
.menu_sign:after
 
.menu_sign:after
 
{
 
{
Line 169: Line 166:
 
                                  
 
                                  
 
}
 
}
−
.main-menu{
+
 
−
      display:none;
+
−
      }
+
 
.active_menu{display:none;}
 
.active_menu{display:none;}
 
      
 
      
Line 193: Line 188:
 
                       text-align: center !important;
 
                       text-align: center !important;
 
                       text-color:black !important;
 
                       text-color:black !important;
−
                       padding: 14px 16px !important;
+
                       padding: 12px 12px !important;
 
                       text-decoration:none !important;     
 
                       text-decoration:none !important;     
 
                     }
 
                     }
Line 213: Line 208:
 
     .dropdown-content a{
 
     .dropdown-content a{
 
                         color: black;
 
                         color: black;
−
                         padding:5px;
+
                         padding-top:5px;        
 
                         text-decoration: none;
 
                         text-decoration: none;
 
                         text-align:center;
 
                         text-align:center;
−
                         size:1em;
+
                         size:1.3em;
 +
                       
 
                         }
 
                         }
  
Line 236: Line 232:
 
         <!--隊徽-->
 
         <!--隊徽-->
 
   <a href="https://2016.igem.org/Team:NCTU_Formosa">
 
   <a href="https://2016.igem.org/Team:NCTU_Formosa">
−
<img src="https://static.igem.org/mediawiki/2016/7/7f/NCTU_pantide.png" class="NCTU_Formosa" width="10%">
+
<img src="https://static.igem.org/mediawiki/2016/4/40/2016NCTU_FORMOSA_YA.png" class="NCTU_Formosa" width="10%">
 
</a>
 
</a>
−
        <!--下拉選單-->
+
 
−
<div class="container" id="icon_menu"  onclick="myFunction(this)"onclick="Function(this)">
+
−
  <div class="bar1"></div>
+
−
  <div class="bar2"></div>
+
−
  <div class="bar3"></div>
+
−
</div>
+
 
     <ul class="main-menu" id="menu"  style="list-style-image: none;">
 
     <ul class="main-menu" id="menu"  style="list-style-image: none;">
 
         <li class="dropdown"><a href="https://2016.igem.org/Team:NCTU_Formosa"  class="dropbtn">Home</a></li>
 
         <li class="dropdown"><a href="https://2016.igem.org/Team:NCTU_Formosa"  class="dropbtn">Home</a></li>
Line 252: Line 243:
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Description">Description</a></div>
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Description">Description</a></div>
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Design">Design</a></div>
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Design">Design</a></div>
−
                      <div><a href="https://2016.igem.org/Team:NCTU_Formosa/PANTIDE">PANTIDE</a></div>
 
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Demonstrate">Device</a></div>
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Demonstrate">Device</a></div>
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Proof">Results</a></div>
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Proof">Results</a></div>
Line 295: Line 285:
 
                   <div class="dropdown-content">
 
                   <div class="dropdown-content">
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Notebook">Lab Note</a></div>
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Notebook">Lab Note</a></div>
−
                       <div><a href="#">Protocol</a></div>
+
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/Protocol">Protocol</a></div>
 
                   </div>
 
                   </div>
 
         </li>
 
         </li>
Line 302: Line 292:
 
          
 
          
 
         <li class="dropdown">
 
         <li class="dropdown">
−
             <a href="https://2016.igem.org/Team:NCTU_Formosa/Attributions">Team</a>
+
             <a href="https://2016.igem.org/Team:NCTU_Formosa/Attributions" class="dropbtn">Team</a>
 
         </li>
 
         </li>
 
          
 
          
 
         <li class="dropdown">
 
         <li class="dropdown">
−
             <a href="https://2016.igem.org/Team:NCTU_Formosa/Achievement">Achievement</a>
+
             <a href="https://2016.igem.org/Team:NCTU_Formosa/Achievement" class="dropbtn">Achievement</a>
 
                   <div class="dropdown-content">
 
                   <div class="dropdown-content">
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/HP/Gold">HP Gold</a></div>
 
                       <div><a href="https://2016.igem.org/Team:NCTU_Formosa/HP/Gold">HP Gold</a></div>
Line 315: Line 305:
 
      
 
      
  
−
 
+
</div>
  
 
<script>
 
<script>

Latest revision as of 18:32, 19 October 2016