|
|
Line 28: |
Line 28: |
| }); | | }); |
| | | |
− | // when the screen size is smaller than 800px, the display_menu_control button appears and will show/hide the whole menu
| + | |
− | $("#display_menu_control").click(function(){
| + | |
− | $('#menu_content').fadeToggle(400);
| + | |
− | });
| + | |
| | | |
| // call the current page highlight function | | // call the current page highlight function |
Line 408: |
Line 405: |
| /***************************************************** RESPONSIVE STYLING ****************************************************/ | | /***************************************************** RESPONSIVE STYLING ****************************************************/ |
| | | |
− | /* IF THE SCREEN IS LESS THAN 1200PX */ | + | |
− | @media only screen and (max-width: 1200px) {
| + | |
− | | + | |
− | #content {width:100%; }
| + | |
− | .igem_2017_menu_wrapper {width:15%; right:0;}
| + | |
− | .highlight {padding:10px 0px;}
| + | |
− | .igem_2017_menu_wrapper #display_menu_control { display:none; }
| + | |
− | #menu_content { display:block;}
| + | |
− | .menu_button.direct_to_page {padding-left: 17px;}
| + | |
− |
| + | |
− | }
| + | |
− | | + | |
− | /* IF THE SCREEN IS LESS THAN 800PX */
| + | |
− | @media only screen and (max-width: 800px) {
| + | |
− | | + | |
− | .igem_2017_menu_wrapper { width:100%; height: 15%; position:relative; left:0%;}
| + | |
− | .igem_2017_content_wrapper {width:100%; margin-left:0px;}
| + | |
− | .column.half_size {width:100%; }
| + | |
− | .column.full_size img, .column.half_size img { width: 100%; padding: 10px 0px;}
| + | |
− | .highlight {padding:15px 5px;}
| + | |
− | .igem_2017_menu_wrapper #display_menu_control { display:block; }
| + | |
− | #menu_content { display:none;}
| + | |
− | .igem_2017_menu_wrapper .menu_button .expand_collapse_icon { width: 5%; }
| + | |
− | .menu_bottom_padding {display:none;}
| + | |
− | .menu_button.direct_to_page { padding-left: 36px; }
| + | |
− | }
| + | |
| | | |
| | | |