Difference between revisions of "Template:DTU-Denmark"

Line 44: Line 44:
 
$(window).on('scroll',function(){
 
$(window).on('scroll',function(){
 
         if($(window).scrollTop()){
 
         if($(window).scrollTop()){
−
           $('nav').addClass('black');
+
           $('.igem_2019_team_menu').addClass('black');
 
         }else {
 
         }else {
−
           $('nav').removeClass('black');
+
           $('.igem_2019_team_menu').removeClass('black');
 
         }
 
         }
 
       })
 
       })
Line 79: Line 79:
 
/**************************************************************************************************************************************************************************************************/
 
/**************************************************************************************************************************************************************************************************/
  
−
/*wrapping for the menu*/
 
−
.igem_2019_team_menu {
 
−
background-color:#cecece;
 
−
border-left: 1px solid #635d5d;
 
−
float:right;
 
−
height:100vh;
 
−
max-width: 270px;
 
−
overflow-y: auto;
 
−
overflow-x: hidden;
 
−
padding:0px;
 
−
position:fixed;
 
−
right:0%;
 
−
text-align:left;
 
−
width: 15%;
 
−
}
 
−
 
−
/*controlling menu visibility*/
 
−
.igem_2019_team_menu.displaying_menu{
 
−
display:block;
 
−
}
 
−
 
−
/*links in the menu*/
 
−
.igem_2019_team_menu  a {
 
−
color: #484848;
 
−
text-decoration:none;
 
−
}
 
−
 
−
/*images in the menu*/
 
−
.igem_2019_team_menu img {
 
−
width:100%;
 
−
}
 
−
 
−
/*level 1 menu items*/
 
−
.igem_2019_team_menu .menu_item {
 
−
    background-color: #cecece;
 
−
    border-bottom: 1px solid #635d5d;
 
−
    clear: both;
 
−
color: #484848;
 
−
    cursor: pointer;
 
−
float: left;
 
−
    font-size: 120%;
 
−
    font-weight: bold;
 
−
    padding: 15px 0px 15px 5%;
 
−
  width: 100%;
 
−
}
 
−
 
−
/*level 1 menu items without submenus*/
 
−
.igem_2019_team_menu .menu_item.direct_link {
 
−
color: #484848;
 
−
padding-left: 15%;
 
−
}
 
 
 
−
/*level 1 menu items on hover*/
 
−
.igem_2019_team_menu .menu_item:hover {
 
−
background-color: #ecb656 !important;
 
−
}
 
−
 
−
/*icon for expanding and collapsing level 1 menut items*/
 
−
.igem_2019_team_menu .menu_item .submenu_control_icon {
 
−
color: #484848;
 
−
float: left;
 
−
width: 10%;
 
−
}
 
−
 
−
/* submenu icon  "-"*/
 
−
.igem_2019_team_menu .menu_item .submenu_control_icon::before {
 
−
content: "+";
 
−
}
 
−
 
−
/* submenu icon  "-"*/
 
−
.igem_2019_team_menu .menu_item .submenu_control_icon.open::before {
 
−
content: "-";
 
−
}
 
−
 
−
 
−
/*level 2 menu (submenu) wrapper*/
 
−
.igem_2019_team_menu .submenu{
 
−
background-color: #ececec;
 
−
clear:both;
 
−
display:none;
 
−
float: left; 
 
−
width:100%;
 
−
}
 
−
 
−
/*level 2 menu (submenu) item*/
 
−
.igem_2019_team_menu .submenu .submenu_item {
 
−
border-bottom: 1px solid #cecece;
 
−
  color: #635d5d;
 
−
    height: 30px;
 
−
  float: left;
 
−
    font-size: 110%;
 
−
font-weight: bold;
 
−
    padding: 12px 0px 0px 15%;
 
−
    width: 100%;
 
−
}
 
−
 
−
/*level 2 menu (submenu) items on hover*/
 
−
.igem_2019_team_menu .submenu .submenu_item:hover {
 
−
background-color: #ecb656 !important;
 
−
}
 
−
 
−
/*color for highlighting current page on the wiki*/
 
−
.igem_2019_team_menu .submenu .submenu_item.current_page,
 
−
.igem_2019_team_menu .menu_item.current_page,
 
−
.igem_2019_team_menu .menu_item.direct_link.current_page {
 
−
background-color:#a2d3d0;
 
−
}
 
−
 
  
 
/*mobile menu bar styling*/
 
/*mobile menu bar styling*/
Line 264: Line 157:
  
  
−
nav{
+
igem_2019_team_menu{
 
   position: fixed;
 
   position: fixed;
 
   top:0;
 
   top:0;
Line 276: Line 169:
 
   opacity: 1;
 
   opacity: 1;
 
}
 
}
−
nav.black{
+
igem_2019_team_menu.black{
 
   background: rgba(0,0,0,.8);
 
   background: rgba(0,0,0,.8);
 
   height: 80px;
 
   height: 80px;
Line 282: Line 175:
 
}
 
}
  
−
nav a{
+
igem_2019_team_menu a{
 
   text-decoration:none;
 
   text-decoration:none;
 
   color: #fff;
 
   color: #fff;
 
}
 
}
−
nav .logo{
+
igem_2019_team_menu .logo{
 
   float: left;
 
   float: left;
 
}
 
}
−
nav .logo img{
+
igem_2019_team_menu .logo img{
 
   height: 150px;
 
   height: 150px;
 
   transition: .5s;
 
   transition: .5s;
 
}
 
}
−
nav.black .logo img{
+
igem_2019_team_menu.black .logo img{
 
   height: 60px;
 
   height: 60px;
 
}
 
}
−
nav ul{
+
igem_2019_team_menu ul{
 
   float: right;
 
   float: right;
 
   margin: 0;
 
   margin: 0;
Line 302: Line 195:
 
   display: flex;
 
   display: flex;
 
}
 
}
−
nav ul li{
+
igem_2019_team_menu ul li{
 
   list-style: none;
 
   list-style: none;
 
   margin-top: 25px;
 
   margin-top: 25px;
Line 314: Line 207:
 
   text-shadow: 0 0 4px #000;
 
   text-shadow: 0 0 4px #000;
 
}
 
}
−
/* nav ul li a{
+
/* igem_2019_team_menu ul li a{
 
   line-height: none;
 
   line-height: none;
 
   font-size: 18px;
 
   font-size: 18px;
Line 325: Line 218:
 
} */
 
} */
  
−
/* nav.black ul li a{
+
/* igem_2019_team_menu.black ul li a{
 
   color: #fff;
 
   color: #fff;
 
   line-height: 20px;
 
   line-height: 20px;
 
} */
 
} */
−
nav.black ul li{
+
igem_2019_team_menu.black ul li{
 
   color: #fff;
 
   color: #fff;
 
   line-height: 20px;
 
   line-height: 20px;
 
}
 
}
−
/* nav ul li a.active,
+
/* igem_2019_team_menu ul li a.active,
 
nav ul li a:hover{
 
nav ul li a:hover{
 
   color: orange;
 
   color: orange;
 
} */
 
} */
−
nav ul li.active,
+
igem_2019_team_menu ul li.active,
−
nav ul li:hover{
+
igem_2019_team_menu ul li:hover{
 
   color: #e5e8a2;
 
   color: #e5e8a2;
 
}
 
}
Line 694: Line 587:
  
  
−
     <nav>
+
     <div class="igem_2019_team_menu">
 
       <div class="logo">
 
       <div class="logo">
 
         <a href="https://2019.igem.org/Team:DTU-Denmark"><img src="https://static.igem.org/mediawiki/2019/thumb/f/fe/T--DTU-Denmark--happylogotemp.png/428px-T--DTU-Denmark--happylogotemp.png" alt="logo"></a>
 
         <a href="https://2019.igem.org/Team:DTU-Denmark"><img src="https://static.igem.org/mediawiki/2019/thumb/f/fe/T--DTU-Denmark--happylogotemp.png/428px-T--DTU-Denmark--happylogotemp.png" alt="logo"></a>
Line 773: Line 666:
  
 
       </ul>
 
       </ul>
−
     </nav>
+
     </div>
  
  
Line 779: Line 672:
  
  
−
<div class="igem_2019_team_mobile_bar">
 
−
 
−
<div class="igem_logo_mobile">
 
−
<img src="https://static.igem.org/mediawiki/2019/3/3c/Igem_mobile_menu_logo.svg">
 
−
</div>
 
−
 
−
 
−
<div class="igem_menu_control_mobile">
 
−
<img id="menu_control_image" src="https://static.igem.org/mediawiki/2019/e/ee/2019_team_menu_icon.svg">
 
−
</div>
 
−
 
−
</div>
 
  
  

Revision as of 17:08, 15 July 2019