|
|
Line 1: |
Line 1: |
| + | {{SFLS_Shenzhen}} |
| <html> | | <html> |
| <head> | | <head> |
Line 9: |
Line 10: |
| <script src="js/popper.min.js"></script> | | <script src="js/popper.min.js"></script> |
| <script src="js/bootstrap.js"></script> | | <script src="js/bootstrap.js"></script> |
− | <script>
| |
− | ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
| |
− |
| |
− | $(document).ready(function() {
| |
− |
| |
− | $("#HQ_page").attr('id','');
| |
− |
| |
− |
| |
− | //highlight current page on the menu
| |
− | highlight_current_page_menu();
| |
− |
| |
− | //accessing submenus
| |
− | $(".menu_item").click(function(){
| |
− | $(".submenu_control_icon", this).toggleClass("open");
| |
− | $(this).next(".submenu").fadeToggle(400);
| |
− | });
| |
− |
| |
− | //mobile menu access
| |
− | $(".igem_2018_team_mobile_bar").click(function(){
| |
− | $(this).next().toggleClass("displaying_menu");
| |
− | });
| |
− |
| |
− | });
| |
− |
| |
− |
| |
− | function highlight_current_page_menu() {
| |
− |
| |
− | var page_url="https://2018.igem.org/";
| |
− | page_url = page_url + wgPageName;
| |
− | $("a[href$='"+ page_url +"']").children().addClass("current_page");
| |
− |
| |
− | //if the page is in a submenu, open the submenu and make the appropiate changes
| |
− | if( $( ".current_page" ).hasClass( "submenu_item" )){
| |
− |
| |
− | $(".current_page").parent().parent().fadeToggle(400);
| |
− | $(".current_page").parent().parent().prev().addClass("current_page");
| |
− | $(".menu_item.current_page > .submenu_control_icon").toggleClass("open");
| |
− |
| |
− | }
| |
− | }
| |
− | ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
| |
− | </script>
| |
− | <style type="text/css">
| |
− | /*this wraps the whole of the menu*/
| |
− | .igem_2018_team_menu {
| |
− | background-color:#c4baba;
| |
− | border-left: 1px solid #c4baba;
| |
− | display:block;
| |
− | float:right;
| |
− | height:100vh;
| |
− | max-width: 270px;
| |
− | overflow-y: auto;
| |
− | overflow-x: hidden;
| |
− | padding:0px;
| |
− | position:fixed;
| |
− | right:0%;
| |
− | text-align:left;
| |
− | width: 15%;
| |
− | }
| |
− |
| |
− |
| |
− | .igem_2018_team_menu.displaying_menu{
| |
− | display:block;
| |
− | }
| |
− |
| |
− | .igem_2018_team_menu a {
| |
− | color: #484848;
| |
− | text-decoration:none;
| |
− | }
| |
− |
| |
− | .igem_2018_team_menu img {
| |
− | width:100%;
| |
− | }
| |
− |
| |
− |
| |
− | .igem_2018_team_menu .menu_item {
| |
− | background-color: #c4baba;
| |
− | border-bottom: 1px solid #928b8b;
| |
− | clear: both;
| |
− | color: #484848;
| |
− | cursor: pointer;
| |
− | float: left;
| |
− | font-size: 120%;
| |
− | font-weight: bold;
| |
− | padding: 15px 0px 15px 5%;
| |
− | width: 100%;
| |
− | }
| |
− |
| |
− | .igem_2018_team_menu .menu_item.direct_link {
| |
− | color: #484848;
| |
− | padding-left: 15%;
| |
− | }
| |
− | .igem_2018_team_menu .menu_item:hover {
| |
− | background-color: #ecb656;
| |
− | }
| |
− |
| |
− |
| |
− | .igem_2018_team_menu .menu_item .submenu_control_icon {
| |
− | color: #484848;
| |
− | float: left;
| |
− | width: 10%;
| |
− | }
| |
− |
| |
− | /* submenu icon "+" "-"*/
| |
− | .igem_2018_team_menu .menu_item .submenu_control_icon::before {
| |
− | content: "+";
| |
− | }
| |
− |
| |
− | /* submenu icon "+" "-"*/
| |
− | .igem_2018_team_menu .menu_item .submenu_control_icon.open::before {
| |
− | content: "-";
| |
− | }
| |
− |
| |
− | /*submenu wrapper*/
| |
− | .igem_2018_team_menu .submenu{
| |
− | background-color: #e4dede;
| |
− | clear:both;
| |
− | display:none;
| |
− | float: left;
| |
− | width:100%;
| |
− | }
| |
− |
| |
− | /*styling for a submenu item*/
| |
− | .igem_2018_team_menu .submenu .submenu_item {
| |
− | border-bottom: 1px solid #c4baba;
| |
− | color: #635d5d;
| |
− | height: 30px;
| |
− | float: left;
| |
− | font-size: 110%;
| |
− | font-weight: bold;
| |
− | padding: 12px 0px 0px 15%;
| |
− | width: 100%;
| |
− | }
| |
− |
| |
− | .igem_2018_team_menu .submenu .submenu_item:hover {
| |
− | background-color: #f3bd5d;
| |
− | }
| |
− |
| |
− |
| |
− | .igem_2018_team_menu .submenu .submenu_item.current_page,
| |
− | .igem_2018_team_menu .menu_item.current_page,
| |
− | .igem_2018_team_menu .menu_item.direct_link.current_page {
| |
− | background-color:#7acbd8;
| |
− | }
| |
− |
| |
− |
| |
− |
| |
− | /*mobile menu bar styling*/
| |
− | /**************************************************************************************************************************************************************************************************/
| |
− |
| |
− |
| |
− | .igem_2018_team_mobile_bar {
| |
− | background-color:#e4dede;
| |
− | border-bottom: 1px solid #c4baba;
| |
− | cursor:pointer;
| |
− | display:none;
| |
− | float:left;
| |
− | margin-top: 0;
| |
− | padding: 5px 0;
| |
− | position:fixed;
| |
− | width:100%;
| |
− | }
| |
− |
| |
− | .igem_logo_mobile img {
| |
− | width:70px;
| |
− | }
| |
− |
| |
− | .igem_logo_mobile {
| |
− | float:left;
| |
− | padding-left: 5%;
| |
− | width: 30%;
| |
− | }
| |
− |
| |
− | .igem_menu_control_mobile img {
| |
− | width:25px;
| |
− | }
| |
− |
| |
− | .igem_menu_control_mobile {
| |
− | float:right;
| |
− | padding-right:5%;
| |
− | padding-top:5px;
| |
− | text-align:right;
| |
− | width: 30%;
| |
− | }
| |
− |
| |
− |
| |
− |
| |
− | /**************************************************************************************************************************************************************************************************/
| |
− | /* CONTENT OF THE PAGE */
| |
− | /**************************************************************************************************************************************************************************************************/
| |
− |
| |
− | /* general wrapper for the content */
| |
− | .igem_2018_team_content {
| |
− | background-color:white;
| |
− | display:block;
| |
− | width: 87%;
| |
− | }
| |
− |
| |
− | /* subwrapper to center content */
| |
− | .igem_2018_team_content .igem_2018_team_column_wrapper {
| |
− | margin:auto;
| |
− | max-width: 1400px;
| |
− | width:90%;
| |
− | }
| |
− | </style>
| |
| </head> | | </head> |
| <body> | | <body> |